One of the challenges of designing for the web is that the font you want for your design may not be available on the computers your audience use. Resolving this usually requires either 1) Ditching the design intent and sticking with broadly supported font families; 2) Creating images containing text, in which case you can use whatever font you have; or 3) Using a web font type kit.
Option #1 is unappealing to most designers, although it shouldn’t be dismissed out of hand. There’s a good reason that those fonts are widely used. They’ve stood the test of time. Ever see the documentary Helvetica? Watch it.
Option #2 is not so great, though I’ve seen it done and it can work successfully if kept to a minimum. Images are always heavier than text alone, and much more difficult to update. Search engines can’t read them well, so you need to include ALT text.
Option #3 requires a little more effort, but the results are much more flexible. There are several web font kits available.
TypeKit was one of the original. They are a commercial service with access to a large library of quality, licensed fonts. You can get a free account for a single website, which is what I did recently for U.S. Speed Sport. You can see the page title (“Drag Racing” in this case) uses a special font provided by TypeKit. The drawback with the free account is that you have a limited library of fonts, and you’re required to display the TypeKit badge. It’s not obtrusive and might work for a smaller site, but bigger sites will probably want to pay for the non-badged license.
Google Web Fonts is a free alternative that is based on the TypeKit code. The javascript kits are very similar. The advantage here is that there is no badging requirement, but the library is even more limited than TypeKit’s free level.
My most recent discovery is a site called Font Squirrel. They literally hundreds of web fonts available in prebuilt kits, and you can create your own. I haven’t had a chance to use Font Squirrel yet, but it looks promising.
Are you using web fonts in your designs?
Leave a Reply