Type III: Screen Fonts and Letter Spacing

by Heather Champ

You are most likely thinking: "Heather, enough with the type already!" I seemed to have opened a mental can of worms regarding type issues, but I promise this will be the last . . . at least for a while.

While noodling around Emigre recently I stumbled on an interesting document that made me stop and think about the very basis of what designers use to render type for the Web and multimedia environments. My years as a designer, in what seems a lifetime ago, of what I now called "print media" taught me that what you would see on the screen was not always, or at least not usually, identical to what would print from a laser writer or other higher end imaging machine. Type 1 or Postscript fonts are composed of two elements: a screen font and a printer font. On a Macintosh system these two parts comprise the whole that can either reside in one's system folder leading or elsewhere with the assistance of a font management application like SuitCase II.

It's been the case that until quite recently fonts have been designed such that the printer font would dictate the look of the screen font. The character width of the screen fonts are adjusted to fit around the outline fonts as outline fonts have a greater degree of flexibility. Now that screen fonts are more than a tool for the designer, where previously they did virtual duty for their more tangible other half, perhaps something has been sacrificed.

But what practical application does this have? While monospaced fonts, with monospace meaning identical letter spacing--the letter "i" is entitled to the same amount of real estate as that of a fatter "w" despite its thinness--(Courier is typically Netscape's default "fixed" font), proportional fonts are created in such a way that the thinner "i" will take less space than the wider "w." Letter spacing is the problem. You can render the type and accept it as is, but at the very least for larger "header" text it's important to eyeball your type to ensure that the letter spacing is as it should be. It's worth shifting characters even one pixel left or right if the end-result flows more appropriately.

Additionally, Adobe Photoshop can be rather tight if you don't adjust your spacing preferences. I always add a minimum of .125 spacing, which may seem to be a rather minute amount, but it adds just enough to give characters enough breathing room between each other.

Base 12 & 9 designed by Zuzana Licko was designed "backwards" in that the screen font "dictated the look of the printer fonts." Base 12 & 9 is "optimized for use in multimedia environments." It will be interesting to see if more type designers begin to create fonts for multimedia so that we designers have less twiddling to do.



Tip du jour: David Siegel's Creating Killer Web Sites: ATM (Adobe Type Manager), which is used to render Type 1 Postscript Fonts, gives you the choice of preserving letter spacing or character shapes. Select "Preserve Character Shapes" to ensure that character descenders display properly and are not cut off.

Past installments of Design Diary