Life after Verdana
Typekit launched recently amid a tremendous buzz from designers and bloggers across the web.
What Typekit offers are ‘real’ fonts on the web. Don’t quite know what this means. Surely Arial, Verdana, Georgia, Tahoma et al are all ‘real’ fonts. I think what they mean is that there is now access to a huge library of extra fonts to employ in browser-based design beyond the standard set of ‘browser-safe’ fonts.
This sort of follows on from my previous post about Art Direction on the web. This wider choice of fonts should allow greater freedom for the designer to inject some personality into their designs and help achieve some differentiation. As, arguably, the nicest browser-safe serif-font, Georgia, is used all over the place for online publishing. The arrival of Typekit should, if nothing else, help reduce the reliance on Georgia for this purpose.
So how does Typekit work? It’s actually quite clever. You see, the problems with fonts online are the same as digital music publishing, namely DRM. As soon as I install a font on my web server and use it on my site then I need a license for the distribution of that font. Despite the fact that some tiny foundries license their fonts for this purpose, the vast majority don’t.
Typekit have got round this problem by allowing you to effectively rent the font from their servers for use in your site CSS and HTML. You pay a monthly subscription (on a freemium model), the level set depending on how many fonts you want to use and how many sites you want to publish those fonts on. Once you’ve chosen your fonts and entered the URL of the destination site it spits out a couple of lines of javascript for you to place into the <head> of your HTML file. It looks a bit like this…
<script type="text/javascript" src="http://use.typekit.com/etn1iee.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
This works in all major browsers (Firefox 3.5 and up, Safari 2.4 and up) and even IE (version 5 an up) woo hoo! I’ve had a brief play around with it and if my rudimentary CSS and HTML skills can make it work then it shows that they’ve got it very right.
It’s all quite ingenious really. Because it’s CSS driven if javascript is disabled then it simply reverts to whatever browser-safe font that’s been specified. A very elegant solution to a problem that looked insurmountable a few years ago.
However, I’m slightly wary of where this might lead. The old saying ‘just because you can, doesn’t mean to say you should’ needs to be plastered all over the Typekit site. The font catalogue may be extensive but there are some absolutely hideous examples of the typographer’s craft on there. Allow the user to set them small onscreen any they’ll be completely illegible.
This may also open up the floodgates for some crimes against typography. Remember when, in the early-mid 90s when the PC, and thus cheap desktop publishing, became more and more pervasive? The world became filled with rainbow coloured, Times, Comic Sans and Brush Script-rendered signs in corner shops? Probably done by the same people who used the <blink> tag and texture-mapped animated gifs. I fear we may be treading the same path again.
Photo from Sermoa on flickr under Creative Commons
Whatever, in the right hands this promises a very exciting future for web-based editorial design and art direction. A future that may be even brighter when some of the larger foundries come onboard with the likes of Garamond, Franklin Gothic, Clarendon etc.
For those that care about typographic nuances I found this useful tool, Web Font Specimen, for examining exactly how a given font will render in a browser, at different sizes, white out and at varying shades of grey.
It’s probably worth pointing out that there are others doing similar things to Typekit. Some use a different method of linking back to the font file (@font-face as opposed to javascript for example) but the principles are the same. These include Kernest, Fontdeck (coming soon) and Typotheque’s Webfonts amongst others.
[Update - 18 November 2009] Typekit have just announced on their blog that they’ve struck a deal with the FontFont foundry. So, fonts like [Update - 18 November 2009] Typekit have just announced on their blog that they’ve struck a deal with the FontFont foundry. So, fonts like FF Meta, FF Dax, and FF Netto will now be available.
4 comments
“This may also open up the floodgates for some crimes against typography. Remember when, in the early-mid 90s when the PC, and thus cheap desktop publishing, became more and more pervasive? The world became filled with rainbow coloured, Times, Comic Sans and Brush Script-rendered signs in corner shops? Probably done by the same people who used the tag and texture-mapped animated gifs. I fear we may be treading the same path again.”
Oooh its coming – the even bigger worry is they always think its great!
Great post Simon.
Excuse me for my technical ignorance but I still don’t get it. How will Typekit prevent the fonts from being stolen. Font makers are terrified by @font-face, what makes Typekit different. If your still linking to a Font how will you prevent that font from being downloaded.
Hi Eric. As with anything involving what to all intents and purposes is DRM, it’s quite technically involved.
Basically, when you set up your account with Typekit, you specify the URL on which the font(s) you’re hiring will be displayed. This is where that line of javascript comes in. It encodes the fonts to only work on the specified URL. They’re also only web-based fonts so cannot be used outside of the browser.
It has the backing now of the FontFont library, so it must be pretty robust and secure.
Typekit creators themselves agree that you can steal their fonts:
“With enough knowledge of web technologies, it’s possible to circumvent each one of these steps. Many can be automated with scripts and command line tools.”
See: http://blog.typekit.com/2009/07/21/serving-and-protecting-fonts-on-the-web/
http://blog.typekit.com/2009/07/21/serving-and-protecting-fonts-on-the-web/
We simply need to standardize font licensing and protection, not to find an excuse to spend billions of dollars on a trivial solution. The web is full of legally protected content that is available for download (e.g. copyrighted images) – fonts are no exception. And what about protecting HTMLs and javascripts themselves? It is also an intellectual property.