cufon

So, if you come up with a fab design with sexy typefaces and a wonderful layout…  and then you can pretty much kiss that goodbye within a browser. After all, you are limited to a handful of rather dull typefaces, and until now there was very little you could do about that….

The solution? Well, over the past week or so I’ve been playing with the Cufon font library.

Cufon is a very clever tool that lets you upload fonts and reprocess them in a format that can then be displayed in almost all browsers. Simply including the Cufon script:

<script type=”text/javascript” src=”/script/cufon.js”></script>

…the font script (generated via their web site)…

<script type=”text/javascript” src=”/fonts/EurostileT_400-EurostileT_700.font.js”></script>

…and a simple jQuery call and you’re good to go:

Cufon.replace(“.myCssClass”);

Cufon will walk through your page and replace all instances of “.myClass” with your fancy font. It’ll even maintain the formatting (including colour).

We’ve tested this on Internet Explorer 6 and 7, FireFox 3.5 and Safari 4.1 and it works like a charm – and ideal tool for a type-heavy publication like a magazine (BiteSizedJapan).