What does it take to make a web font? A lot of work

Typefaces used under CC license by Flickr user Kate Fink

Typefaces used under CC license by Flickr user Kate Fink

For years, the web has consisted of just a handful of fonts, used over and over again — designers, limited by the default fonts on most computers, just slapped some Arial or Verdana, or even the dreaded Comic Sans, onto their pages and carried on. But those choices have become more complex with the advent of modern web browsers that are now capable of supporting many more fonts. As a result, a wide range of companies have sprung up to help web designers deliver really great fonts in their work: the likes of Typekit, Fontslive and even Google. Even since we outlined a few of the options last year, more have appeared, like Fontdeck and MyFonts.

But while these services are great at providing access to fonts, most of them don’t actually make the fonts themselves. That job is left to the foundries, which have to convert their existing libraries of typefaces into web-compatible fonts. Still, that task must be fairly easy, right? After all, surely it’s straightforward to take an existing typeface made for print and translate it into digital form.

Not so.

On Friday, I heard Jonathan Hoefler, one of the founders of the massively respected type foundry Hoefler & Frere-Jones, explain exactly what it takes to turn a typeface designed for print into a real web font. And it was amazing.

He was appearing at Ampersand — a conference in Brighton, England, dedicated to the art of web fonts — where he stood on stage and announced that the studio has now converted 100 percent of its typefaces for use on the web.

The news was greeted with a sage nod by attendees, but in truth it should have been met with crazed whoops, wild cheers and yelps of astonishment — because it’s really a task of herculean proportions.

Think about this: H&FJ has been designing new typefaces for more than 20 years, with clients that include Apple, the New York Times Magazine, Esquire and Sports Illustrated. In the past only a handful of these have been available as fonts to use on the web, but since 2008 — when the World Wide Web Consortium decided that next-generation web browsers should be able to support any fonts — his studio of 32 people has been working overtime trying to make web-friendly versions.

Doing that is an arduous and laborious process, because it requires a scale and flexibility that goes way beyond what a printed typeface can deliver. For instance, one of the foundry’s most popular typefaces, Gotham, had to be expanded dramatically in order to be fit for purpose online.

In print, the uses are restrained: text is used for straightforward display purposes, largely in a major language like English, and largely consisting of actual words. Online, you have to consider everything that anyone could possibly want to do with a font, which means providing as many of the 109,000 individual characters in Unicode as possible in order to cover every eventuality.

That means Gotham went from a print-based library that included 7,520 individual characters (known as glyphs) to a web version that counted 47,778. That’s almost seven times as large as the original, and each one has to be carefully designed to operate at any size and a range of weight.

At the same time, the quality assurance process — testing each glyph in different circumstances to make sure it works properly — went from 74 individual tests for print through to 210 steps for the web. In total, the team at Hoefler & Frere-Jones had to commit to more than 90 million individual operations in order to make their foundry web-compatible.

It’s nothing short of stunning, really, to understand the extent of work that goes into making those characters available for you to use on your site.

Hoefler’s revelation was part of a broad range of talks at Ampersand that encompassed almost every aspect of fonts on the web, including talks by Vincent Connare, the author of Comic Sans (“I was really, really bored,” he quipped), and Jason Santa Maria, the creative director of Typekit and A List Apart.

Over the course of the day, though, what really stood out for me was how the broad ecosystem of companies around this fast-growing area were working together, rather than against each other.

Most of the names in the area were on board with the conference, despite the fact that it was ostensibly organized by one of their competitors (design consultancy Clearleft, which is a co-creator of Fontdeck). You might expect them to push back against working together, but they seem to understand that it makes sense to partner up while the opportunities are still very wide. After all, there’s still a vast percentage of the web that remains stuck in the past, with designers still just slapping some Arial or Verdana — or even the dreaded Comic Sans — onto their pages and carrying on.

Photograph used under Creative Commons license, courtesy of Flickr user Kate Fink

Disclosure: TypeKit is is backed by True Ventures, a venture capital firm that is an investor in the parent company of this blog, Giga Omni Media. Om Malik, founder of Giga Omni Media, is also a venture partner at True.

loading

Comments have been disabled for this post