January 18, 2006

Playing the Percentages with Web Fonts

A designer friend heard that the list of "system faces" on the web had grown and wanted to know if this was true. Since I'm often asked about the technical aspects of web typography, both by designers new to the medium and design-oriented clients, I figured I'd publish my response.

The concept of web "system faces" is a misnomer. It's really a matter of percentages; specifically, the percentage of users with particular fonts installed on their computers. When people say that the number of system faces has grown, they mean (or should mean) that the percentage of users with certain fonts on their computers has increased. As far as I know, there's only been one large-scale survey of installed fonts, the results of which were first published in 2003 and have been regularly updated since. You will doubtless find this fascinating, although bear in mind that the results reflect the demographics of the respondents, not web users as a whole.

This aside, it's true that in recent years web designers have added some new fonts to the mix—chiefly Lucida Grande, Trebuchet MS, and to a lesser degree, Tahoma. While other fonts are doable given the percentages, they don't necessarily read well online, where large x-heights and generous white space between and within characters work best.

The playing field may change some when Microsoft releases their new operating system, Vista, which will include six new fonts designed specifically for extended on-screen reading. Once Vista is released, it will take some time for the new fonts to achieve a sizable installation base, however the lag time is somewhat irrelevant because fonts are (or should be) specified in a prioritized list ending in a generic font family (e.g., "Verdana, Arial, Helvetica, sans-serif"). The way this works is that the browser checks the user's computer for the availability of the first font; if that's not installed, it checks for the second, and so on. So the new Vista fonts could be used from the get-go provided one recognizes that most users will see the second or third font in the list.

The Challenge of Flexibility

The practice of assigning fonts in a prioritized list is indicative of the difference between print and web as design mediums. Print affords control; the web requires flexibility. I've seen print designers cry when they realize this—it runs counter to their training, their experience, and often their temperaments.

My take on this may surprise you: I find it exciting. It poses a fascinating challenge: how to incorporate flexibility into design. This challenge is in no small part technical in that it requires sophisticated understanding of a technical medium, both how it works and how it's used. The best web designers not only understand this but use it as a foundation for their work.

Published in Design, WWW, Web Standards