Justifying font choices

Web fonts are nothing new. Support for @font-face has been available since Internet Explorer 4 and the CSS3 specification is being designed to standardise this innovation. So why have I been on such a roller-coaster ride with them?

The problem has always been one of copyright and consistent design across browsers. With version 3.5 (released June 2009), Firefox was the last of the major browsers to support the @font-face rule. Before then, web designers had to use other ingenious font replacement methods.

Up until September this year my personal choice in font replacement was still sIFR.

Now, I know what you’re probably thinking… most standards-aware web designers would recoil in disgust at the mere mention of a Flash-based technology. You’d be right, in my case I had to think long and hard about whether to stick with this technology. It was a constant source of frustration for me and prompted much debate with my peers.

Why would I use it?

Flash is a processor hog (on Mac), it’s inaccessible (on Mac) plus some people actively block it in their web browsers (probably mostly on Mac). I used it simply because it gave me a choice of font. Something that, had I stuck with the developer coding doctrine of the time, I wouldn’t have had. On a blog where the minimal design is mostly down to my choice of font, this was important.

Thanks to the well-intentioned development efforts of Mike Davidson, Mark Wubben and others, sIFR is mature and manages to get around a lot of the inadequacies that other font substitution technologies still suffer from. Resizing is impossible with image replacement and Cufón, plus what happens when images are switched off? Then there’s the screen-reader-unfriendly use of span tags. sIFR text is selectable and it gracefully degrades to a chosen system font where JavaScript or Flash isn’t available (think iOS), it’s even accessible and protects fonts from online piracy, in that regard only image replacement beats it. sIFR deals with all of this.

What changed?

Web font services matured and started offering the web fonts I actually want to use, plus free fonts improved. With Fontdeck, Typekit, Fonts.com, Google Font Directory and Font Squirrel I have choice! Within two weeks of Fontdeck offering my chosen font Baskerville, I started using it on this blog. Fontdeck can even serve corporate fonts for those that don’t use something generic. Plus, the speed with which these font services are bringing new (and old) fonts on board seems to be reaching a critical mass.

This means the reasons for using sIFR are diminishing and it’s taking its rightful place as a backup to open web font embedding. Which is really what it always was. Cool! Don’t use it, seriously don’t… unless you have a very good reason, it will never be as good as @font-face.

So when someone wants to proclaim today as the first Web Font Day to promote their conference (#wbfntdy), I support it; after what feels like two years of wrangling I finally believe it’s a good time to say, at least for me, web fonts have arrived.

If you’re interested to read more, there are lots of great resources on the web, including: http://craigmod.com/journal/font-face/

Posted on Saturday 13 November 2010.

Posted in accessibility, browsers (UA), css, css3, design, google, layout, typography | Add a comment »