November 4, 2009
@font-face Generator Expectations
Hint: Keep Them Low
We are all very excited to finally see browsers support some form of font embedding. Hurray you get to use any font you want now. While we were all celebrating that fact, the elephant in the room started trumpeting...
That elephant is named Windows. Here’s the short of it: Windows browsers do not render type well unless you have a perfectly hinted TrueType font. OpenType (OTF) fonts don't rendered well, unhinted TrueType don't render well,
and even "auto-hinted" TrueType don't render well. Update: I changed my mind. The Font-Face Generator does a pretty good job of auto-hinting. Try it out and see.
Many Font Squirrel users have become frustrated that their OTF files that are being run through the Generator come out looking like a pixelated mess. Particularly bad are fonts that are light and thin.
So what should you do about it? My recommendation is to:
- Stick with the standard font stack for body copy until Microsoft can deliver a better rasterizer to most of your users.
- Use custom @font-face fonts for headlines and other "big" type. The bigger the type, the less noticeable the rendering.
- Always start with a TrueType font if you can help it.
You will be disappointed by most of the converted @font-face fonts you see in Internet Explorer and Firefox for Windows. And we don't think it is our fault. Just look at how nice a Mac renders! Again, I changed my mind. The type coming out of our Generator is looking pretty good now!
- 456 Sans Serif
- 360 Display
- 215 Serif
- 87 Script
- 72 Slab Serif
- 65 Handdrawn
- 41 Dingbat
- 41 Monospaced
- 35 Retro
- 33 Novelty
- 29 Comic
- 27 Stencil
- 21 Blackletter
- 20 Calligraphic
- 15 Typewriter
- 7 Pixel
- 6 Programming
- 2 Grunge
About Font Squirrel
Font Squirrel is your best resource for FREE, hand-picked, high-quality, commercial-use fonts. Even if that means we send you elsewhere to get them... more info