Better Typography Coming to a Screen Near You
Despite the many advantages of electronic publishing – it’s relatively cheap, the potential audience is vast, content delivery can happen instantaneously – I am continually surprised at how many people still print hard copies of their email and Web pages. The electronic revolution was supposed to save us from the bulk and waste of publishing onto sheets of dead, cut up trees, yet people still lug around armloads of printouts. Why? Because reading text onscreen can still be a difficult, even painful, process.
Anyone who works with large amounts of text on a computer is familiar with the bloodshot eyes and strain that come with reading from a computer monitor. It’s estimated that 10 million cases of computer-related eyestrain are seen by optometrists each year. Until recently, options for improving onscreen typography have been limited. Now that people are spending more hours reading from the Web, new approaches and technologies are emerging to tackle a problem that’s become a pain in the eyes.
No Time for Times — I’ll say it here and stick to my guns: 12-point Times is lousy for onscreen reading. Most Web browsers use 12-point Times as their default font, and although it looks great when printed, millions of people are reading themselves into fits of headaches and eyestrain because of it. To alleviate this, vendors are finally beginning to develop screen-friendly fonts designed expressly for viewing on monitors. For example, Adobe and Bitstream have just released a $50 set of Web fonts including Myriad Web, Minion Web, and Caflish Script Web; Microsoft’s Typography Web page offers free downloads of fonts such as Georgia, Verdana, and Trebuchet (which are also bundled with new versions of Windows and Internet Explorer). [I’ve become a great fan of setting my browsers’s default font to Comic Sans MS, another freebie font from Microsoft. -Tonya];
<http://www.microsoft.com/typography/>
<http://www.adobe.com/prodindex/webtype/ details.html>
Other good alternatives are Apple’s venerable "city" fonts, such as Monaco, Chicago, New York (my favorite), Geneva, and – abandoning the city connection – Charcoal, which ships with Mac OS 8. Newer versions of Adobe Type Manager (ATM), a long-time staple for those who work with PostScript fonts regularly, offers the ability to anti-alias screen type on the fly, removing the "jagginess" of bitmap fonts (more on this later).
<http://www.adobe.com/prodindex/atm/main.html>
Types of Type — The Mac OS currently uses three basic varieties of fonts: bitmap, PostScript, and TrueType. Bitmaps are tiny images comprised of nothing more than the pixels to be displayed on screen. Although they’re the least flexible when printing, bitmaps are the best option for onscreen typography because they’re created at screen resolution (72 dots per inch) and computers can display them very quickly. Bitmap fonts usually reside in the font suitcases scattered in your System Folder’s Fonts folder. Poking around in one will reveal that bitmaps exist only for specific sizes, which is why you often find several versions of a font within a given suitcase. The Mac OS can display bitmap fonts in sizes you don’t have available, but they’ll usually be blocky since the computer is actually showing a distorted version of a smaller bitmap you do have installed.
PostScript fonts (sometimes referred to as Type 1 or Type 3 fonts) were developed by Adobe and debuted for Macintosh users when the first LaserWriters appeared. Unlike bitmap fonts, PostScript fonts are "resolution independent" because they’re made up of mathematical representations of the outline for each character in a font. When you use a PostScript font, those representations scale to whatever resolution the output device – like a laser printer, imagesetter, or monitor – can handle, either via a PostScript interpreter in your computer or printer, or (most commonly on Macs) to the screen via ATM. However, on your hard disk, PostScript fonts are typically paired with bitmap versions of the same font in common sizes because – remember – bitmap fonts are generally designed for the screen and can be displayed very quickly.
The last type of font, TrueType, is also a resolution-independent, mathematical way of representing type, and (like PostScript fonts) TrueType fonts are often paired with common sizes of bitmap fonts for fast onscreen display. Developed by Apple and Microsoft (and shipping with the Mac OS and Windows for many years), TrueType allows high-resolution output on the screen and to printers without requiring a PostScript interpreter or ATM. That’s why StyleWriters and other non-PostScript printers can create high-quality text output with TrueType fonts. Although TrueType is widely deployed on personal computers, it hasn’t been widely adopted in the publishing world, since it’s not directly supported by many high-end printers and imagesetters.
Hinting at Something Better — With all this technology at our disposal, why is reading text onscreen still such a chore? For the most part, Macintosh typography has been focused on printing; once ATM solved the problem of jaggy text onscreen, type was readable enough to work with in word processors and page-layout applications. Font foundries concentrated on creating new typefaces and styles, knowing that most reading would be done on paper. This is not to say that screen fonts were neglected – a great deal of effort goes into creating bitmaps that accurately match the weight, spacing, and character of each font. However, the impetus has most often been to provide a closer correlation between screen and paper versions, rather than to provide onscreen legibility.
To create a font specifically for onscreen viewing, typographers pay close attention things like hinting and kerning. If you compare Times to Georgia, for example, you’ll see that Georgia’s letter spacing makes it more readable. None of the characters end up smashed against each other or pulled apart disproportionately, a frequent consequence when your Mac generates bitmaps on the fly (especially when viewing nonstandard sizes such as 13 or 15 points).
Another important aspect is the clarity of a font’s x-height, or the height of lower-case letters like x, a, or e. If the pixels in the loops that close an "e" or round out an "a" crunch together, your eyes must work harder to discern words, which quickly leads to eyestrain. Words like "faeries" or "earwax" for example, can interrupt your flow of reading if the characters aren’t clearly defined.
Anti-Aliasing Brings Fuzzy Clarity — Using Web fonts is probably your best bet for readable type; however, only about a dozen typefaces are currently optimized for onscreen use. Plus, if you’re like me, you already have a ton of fonts installed and may not want (or be able to afford) new sets of typefaces.
As a solution, software developers have come up with ways to anti-alias all fonts displayed onscreen. Anti-aliasing is a method of smoothing a font’s jagged edges by slightly blending the font’s pixels into the background color behind the type. ATM 4.0 provides a Smooth Font Edges on Screen option; the shareware program SmoothType also provides this ability. The downside of this approach, however, is that text at small sizes tends to look slightly fuzzy or out of focus, which could contribute to eyestrain.
<http://greg.math.harvard.edu/smoothtype.html>
Making It Work — There are a few things you can do to set up your fonts for better online reading. If you’ve been using the Mac for a while, you may be sick to death of the various city fonts I mentioned earlier. If that’s the case, I strongly recommend you play with Charcoal or check into the font packs such as those from Microsoft and Adobe noted earlier.
If your Mac runs Mac OS 7.x, you can specify a screen-friendly font for your desktop by choosing a font in the Views control panel. If you use Mac OS 8, choose Preferences from the Finder’s Edit menu to change the font of file and folder names; choose a font in the Appearance control panel to modify the font used in menu bars and dialog boxes.
Selecting a new default font for a Web browser is a phenomenon equivalent to setting the clock on a VCR: anyone can do it, but most people tend not to bother. To break out of that stereotype, select a screen-friendly typeface in the Language/Fonts window of Internet Explorer’s Preferences dialog box, or change the font in Netscape Navigator’s General Preferences dialog box. While you’re setting preferences, you might as well change the default home page to something besides the default, such as:
Font Futures — Even if you change the default font of your browser, many Web sites today specify other fonts by using the <FONT> tag or Cascading Style Sheets, though you can also typically set preferences for whether you want your default font to override these fonts. However, it’s become an informal standard among Web designers to use only the handful of fonts that ship with both the Mac OS and Windows, which helps ensure that a desired effect (usually using a sans-serif font instead of a default serif font) will work in most browsers.
Two technologies are emerging that will enable your browser to download fonts as needed: OpenType and TrueDoc. Essentially, OpenType will be a convergence of PostScript and TrueType font technologies, although it currently only supports TrueType. The advantage for Web publishing, though, is that it allows for OpenType embedding, whereby font information is stored on a Web site and accessed by your browser just as graphics and text are downloaded and viewed. To allay the security concerns of font development companies, OpenType fonts can be protected with an "embedding bit" that can be set to No Embedding, Installable, Editable, and Print and Preview. As of this writing, however, a security flaw has been found in the Windows version of Internet Explorer 4, allowing users to grab fonts from a site to use on their computer.
<http://news.i-us.com/wire/wire.htm>
Netscape’s and Bitstream’s TrueDoc technology (also known as Dynamic Fonts) takes a similar approach to embedding font information, but instead of accessing a font object at the Web site’s source, it sends a Portable Font Resource file that stores only the information needed to display the used characters in the font correctly. Using a feature called direct rendering, the text is used only in the browser’s window and not stored on a user’s hard disk.
<http://www.bitstream.com/truedoc.htm>
Both approaches, in addition to providing varying levels of security to avoid font pirating, also include techniques to compress dramatically the font information and minimize the time it takes to download (Microsoft has claimed compression gains of 75 to 99 percent in some cases).
Just My Type — One of the most visible results of the Macintosh and personal computer revolutions has been the ability to use the thousands of different available typefaces in documents. Slowly, that ability is coming to the Web and a screen near you, bringing with it the realization that there are ways to display text onscreen that won’t make you see red.