5 Web Font Services Reviewed

Typography and web design have long had an uneasy relationship. Until recently, if you wanted to go beyond the limited web-safe fonts on most computer systems, you had to render type as bit-mapped graphics, or maybe use plug-in technologies such as Flash. All major browsers now have the ability to link to fonts stored on remote servers, but the software licenses that accompany most fonts generally prohibit their use in this manner.

This has given rise to a new breed of online services that provide a legal way for web designers to access high-quality fonts. The fonts are licensed from established foundries or type designers specifically for web hosting, and in many cases the fonts are optimized or re-designed for screen display. A few of the companies behind these services are foundries themselves.

In most cases, you don’t download the actual font files. Instead, you select the fonts from an online library and specify the websites where you want to use them. Each service then generates brief snippets of code that you paste into your web pages. When someone visits your website, the browser downloads a copy of the font from the vendor’s server. The end user can then view your design with correctly formatted type as if the fonts were installed on their own computer.

The fonts may add a bit to the download time, and some users may notice a brief flash as the browser replaces default system fonts with downloaded ones. Otherwise, the process is transparent. And though the fonts are downloaded, you’re not giving them away as freebies—the technologies underlying these services limit use of the fonts to the pages you’ve specified.

I looked at five of these services: Typekit from Small Batch Inc.; Fontdeck from Fontdeck LLC; Fonts.com Web Fonts from Monotype Imaging; WebInk from Extensis; and Webtype, a joint venture of The Font Bureau and Ascender Corp.

No programming skills are required to use these services, but you’ll need at least a basic understanding of CSS. The services work with the vast majority of web browsers, though it’s still a good idea to specify alternate fallback fonts for those few users who might be left out.

How much does it cost?
The key differences among these services include their pricing models, user interfaces and the range of fonts they offer. None of these services allow you to purchase the fonts, though some will make arrangements by which you can host them on your own server. That’s uncommon, however: in most cases you pay monthly or annual subscription fees that let you link to fonts on the vendor’s server.

Fontdeck has the simplest pricing: You pay an annual fee for each font and that’s it. Pricing for the others depends in large part on web traffic — the number of users who visit the sites and download the web fonts. However, head-to-head comparisons are tricky because each vendor measures traffic in different ways. Monotype and Small Batch use subscription tiers based on monthly page views: one price for up to 500,000 page views, a higher price for a million page views, etc. As any web producer knows, page views can vary from month to month, but most should still have a pretty good idea of which tier is likely to apply.

Extensis and Webtype base their fees on font bandwidth, meaning the total file size (in GB) of downloaded web fonts. You might pay one rate if site visitors collectively download up to 3GB of fonts, and more if it’s up to 9GB. This bandwidth can vary widely based on web traffic, the number of fonts on each page and even the size of the character sets. You can already hear the bookkeepers howling—websites measure traffic in all sorts of ways, but font download bandwidth is not among them. Both companies help you deal with this by estimating the likely bandwidth based on the number of unique monthly visitors. Extensis even provides a calculator: you enter the average number of site visitors, the number of fonts per website and the character set you want to use, and the calculator tells you which pricing tier most likely applies. Tiers for both services are broad enough that you should be able to find a good fit, and they’ll also negotiate custom pricing for large enterprise sites.

Netflix vs. iTunes
Beyond the way they measure traffic, each service uses one of two models for providing access to its font collections. One is similar to Netflix, in which you pay a monthly or annual fee that lets you use any fonts in its collection. The other model is more akin to renting videos on iTunes: You sign up for free, browse through the library and then pay an annual fee for each font you want to use. Extensis, Monotype and Small Batch use the Netflix model, whereas Webtype and Fontdeck follow the iTunes approach.

The services following the Netflix model could be the best deals if you plan to use a lot of different fonts. But in at least one respect, the iTunes model is a better reflection of how designers do business. All of these vendors offer some form of free trial, but Webtype and Fontdeck trials work on a font-by-font basis. You can choose any font from the vendor’s collection, use it in a design mock-up, obtain client approval, and then pay for it when the site goes live. Webtype lets you use its fonts for free for up to 30 days. With Fontdeck, up to 20 users (based on unique IP addresses) can view a site with its fonts before you pay for them.

The best bargain of all is not included in this review: In May, Google unveiled the absolutely-free, no-strings-attached Google Font API. Don’t let the “API” scare you—it doesn’t require programming skills and operates much like the other services mentioned here. The only catch is that it’s limited to a small number of public domain fonts. It’s still in beta mode, but in the Google world, “beta” is often equivalent to “Version 1.0” at other places.

• Want to learn about web design? Visit MyDesignShop.com.

Previewing Your Work
All of these services let you specify a localhost web domain, an important consideration if you want to preview the fonts within your designs on your own computer. To do this, you set up a local web server and place your site in the server’s designated folder. If you point your browser to this location (such as http://localhost/pagename.html), you’ll see your design with any fonts that you’ve specified.

I also found that I could preview web fonts in Dreamweaver CS5’s Live View mode, though this capability isn’t documented by any of these services. You’ll need to use Dreamweaver’s site manager to designate your local computer’s server as a testing server, and you may have to check “Use Testing Server for Document Source” in the Live View menu (see screen shot).

Dreamweaver CS5’s Live View function lets you preview linked web fonts in your designs. The screen shot on top shows a page with the web fonts enabled. The one below shows the same page with the fallback system font.

Let’s take a look at each of the five services.