-
Life after Verdana
Typekit launched recently amid a tremendous buzz from designers and bloggers across the web.What typeset 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.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, one of the nicest serif-fonts online Georgia is used all over the place for online publishing. The arrival of Typekit should help reduce the reliance on Georgia for this purpose.So how does Typekit work? It’s actually very 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. And those licenses don’t exist. Ot they do but their prohibitively expensive.Typekit have got round this problem by allowing you to 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 chose your fonts and enter the URL of the destination site and 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).It’s all quite ingenious really. And 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 typographers art 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 the PC became more and more pervasive. The world became filled with rainbow coloured, Times, Comic Sans and Brush Script-rendered signs in corner shops? The same people who used the <blink> tag and texture-mapped animated gifs. I fear we may be treading the same path again.Whatever, in the right hands this opens up 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 for seeing exactly how the 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) but the principles are the same. These include, Kernest, Fontdeck (coming soon) amongst others.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.
-
Taking on PNG files in IE
PNG (Portable Network Graphics) files are great – the lovely little graphic file format that allows for a gradation from full colour to transparency within a graphic. It’s a handy little tool in your kit to help you translate a designer’s vision into a web page.
Well, handy in some browsers. In other browsers it’s more of a “hmmmm, how does this work?” kind of thing. Those “other browsers” being IE6 and IE5.5.
Not being averse to the odd “hmmmm” moment I’ve been trying to use PNGs where relevant, sometimes more successfully than others. But I thought I’d share one of my successes here to hopefully show that it can be done, and relatively painlessly too!
I’ve used PNGs for the main navigation of this site so I’ll use that as an example.

