Studio Projects
Newsletter Archive
Base 9 & 12
By Zuzana Licko

This text was first published in 1995 on the reverse side of the promotional poster for Base Nine and Twelve.


Having designed Emigre's "Now Serving!" bulletin board environment and, more recently, the electronic "Emigre Catalog" on the Web, we were reminded that the need persists for a comprehensive family of screen fonts with companion printer fonts. We're responding to this need with three families; two families based on 12 point screen fonts (one serif and one sans serif family) named Base-12, and one family based on 9 point screen fonts named Base-9, consisting of a total of 24 individual faces.

To a great degree, in the design process of these faces, the screen fonts dictated the look of the printer fonts, rather than the other way around, because outline fonts have a greater degree of flexibility than do screen fonts. For example, the proportions of the screen font determined the exact character widths within which the outline characters were adjusted to fit. Usually this process is reversed; character widths are normally adjusted to fit around the outline characters.

The Design Problem

The greatest challenge in harmonizing the legibility of screen fonts with printer fonts is that of spacing. Although some existing printer fonts have companion screen fonts that are quite legible on screen, they tend to have two shortcomings. The first problem is that traditional screen fonts are adjusted to fit the shapes and widths of the printer fonts, and therefore have some inherent spacing and character shape problems, since the printer font inevitably forces unnatural widths or shapes in the screen fonts. The other problem is that of spacing inconsistencies at text sizes due to fractional widths. In traditional fonts, the width of a bitmap character is a rounded off measurement, calculated from the corresponding outline character. For example, an outline character with a cell width of 620 at an Em-square of 1,000 will be rounded to 6 pixels in a 10 point screen font. The information about the remaining 2/10 of a pixel is stored in the fractional width table. When lines of text are composed, many programs (such as page layout programs) match the screen font line length to the printer font line length by calculating the cumulative effect of the character width fractions. For example, if a 10 point line of type was composed of 10 characters, each having a remaining 2/10 of a pixel, as in the example above, then the line of type would need to be increased by 1 pixel in order to match the printer output. As a result, an extra pixel of space would be inserted between two of the characters, thereby causing uneven spacing. In this manner, some characters may be moved a pixel to the left or right, thus overriding the spacing intentions of the hand-edited bitmap font.

The Solution

Rather than deriving the screen font from the printer font, I decided to derive the printer font from the screen font. The first step, therefore, was choosing the most appropriate screen font point size. For various reasons, the 12 point size proved to be the most useful. 12 point is the default size for most applications and Web browsers, and 12 point is cleanly scaled to many of the standard sizes to which some applications are limited, namely 24 and 36. Later on in the development process, I added a family based on the 9 point bitmap to facilitate the other popular sizes, 9 and 18.

Base-12 Sans: 12 point screen font enlarged 3x to 36 point,
with 36 point comparison shown below.

Base-12 Serif: 12 point screen font enlarged 3x to 36 point,
with 36 point comparison shown below.

Base-9 Sans: 9 point screen font enlarged 4x to 36 point,
with 36 point comparison shown below.

The popularity of the 12 point screen font is also due to the relatively coarse screen resolution of computer screens, which cause the perceived font size on screen to be smaller than the corresponding high resolution printout. On the screen, 12 point is comfortable to read, 10 point is still readable, 9 point becomes difficult for extensive text and 8 point is difficult to read. In print, however, the comfort level of reading the various sizes shifts down by at least 2 point sizes.

To clarify the measurement of typefaces, I should explain here that each point size is generated by scaling the font Em-square. The Em-square is the vertical measurement of the body around the font (top to bottom). The Em-square needs to accommodate some breathing room for accents, descenders, and other protruding elements, and therefore the point size does not relate specifically to any part of the typeface's anatomy. That is, a 12 point size measures 12 points from the top to the bottom of the Em-square, and the actual dimensions of the x-height or cap-height will vary between typeface designs.

That's the physical measurement of the typeface. However, there are various factors that may make a typeface appear larger or smaller within the same physically measurable point size. For example, a large x-height or a wide character width makes a typeface appear larger than a design with a smaller x-height or narrow character width. Since most of the text we read is lower case, the x-height is the most influential element in the perceived size of the typeface. The larger the inside shapes of the x-height (also called "counters"), the larger the face will appear. Therefore, when relating this perceived point size to screen fonts, it needs to be specified that a 12 point screen font is generally one with a 6 pixel x-height, which is the pixel size that I used for the Base-12 family.

The next challenge was that of making the proportions of the screen font and printer font the same. In order to modularly relate the screen font character widths to the printer fonts, I made the Em-square of the scalable printer font divisible by 12. I chose an Em-square of 1,200 units, thereby making each pixel equal to exactly 100 units in the printer font. This solved the fractional-width problem described earlier.

Since the widths of the printer font had to exactly match those of the 12 point screen font, the process was similar to that of designing a monospaced typeface in that the printer font character outlines had to be adjusted to fit into predefined character cells. Like the size of the Em-square, the size of the character space includes the space around the character; not the measurement of the character itself. The character cell width is the horizontal measurement around a character, including breathing space left to right. The breathing space of one character, when added to the breathing space of the adjacent character, creates the space between those particular two letters. If this is done correctly, words will look recognizable and the typeface will be legible. In most typefaces, this breathing room between characters is further improved by adding kerning pairs between problematic pairs. In the case of the Base-9 and Base-12 typefaces, however, kerning pairs would have destroyed the modularity of the spacing, and so the spacing had to be optimized solely by adjusting the characters shapes.

After resolving the measurement and spacing issues, the design of the printer font could take various departures from that of the screen font. Since the printer font design functions separately from the screen font design, the details of the characters themselves need not exactly follow the structure of the screen fonts; the printer font design need only echo the implied shapes of the screen font. A circle can be implied with as few as 4x4 pixels; other shapes may be similarly derived. Since there is room for much interpretation at this point, the Base-9 and Base-12 typefaces are merely one design solution; other interpretations may be yet to come.

Intended Usage

When using the Base-9 and Base-12 fonts in situations where character display and spacing on the screen are of primary importance, such as in multi-media, these fonts should be used at point sizes which are multiples of their "Base." For example, Base-12 is best used at 12 point, 24 point and above. Base-9 is best used at 9 point, 18 point and above. Carefully hand-edited screen fonts are provided at these sizes for the best possible screen display. Of course, any other point sizes may be used as with any other PostScript or TrueType outline fonts when print is the final product. ATM and TrueType rasterizers will generate acceptable screen fonts at sizes other than the hand-edited ones mentioned above, but such automatically generated screen fonts are not recommended for use where screen display is primary.

When creating on-screen graphics, there is a temptation to use anti-aliased displays of typefaces to make them consistent with the smoothness of full color images. In fact, anti-aliased versions of fonts can be generated by some programs, such as Adobe Photoshop. However, just like standard unedited screen fonts, these anti-aliased screen fonts will be plagued with distracting irregularities unless they are hand-edited. Therefore we do not recommend using automatically generated anti-aliased screen fonts below 18 point.

Although the design of the Base-9 and Base-12 fonts was guided by a specific functional intent, the goal was also to create a comprehensive family of typefaces suitable for traditional print purposes.

The Future of Bitmaps

When I designed my first bitmaps in 1984 for the Macintosh computer (the Emperor, Emigre, Oakland and Universal families), bitmap fonts were the only fonts available for the Macintosh. My intent was therefore to create a series of legible fonts for the computer screen and dot matrix printer. After the introduction of laser printer technology and high resolution outline fonts, I imagined that these bitmaps would be relegated to the status of novelty fonts, as they were in fact for several years. But with the current interest in multimedia CDs, electronic bulletin boards and the World Wide Web, on-screen design has gained importance. In re-evaluating the necessity of screen fonts, I was able to make use of the many lessons that I had learned from my early bitmap experiments.

It is ironic that for years, pioneers of emerging computer technologies have been slighting the validity of bitmaps, judging them to be merely temporary solutions to a display problem that would soon be fixed by the introduction of high definition TV and computer monitors. Well, a decade later, we're still waiting. It has become obvious that even if such advancements are eventually made, because the user base of today's technology is so huge, we will still be addressing coarse resolution needs for a long time to come. This is especially significant since there is a lot of talk today about the forthcoming multi-media style interactive TV programming, enabling users to view such sources as CD-rom programming or the World Wide Web directly on their existing TV sets. If this happens, then the U.S. TV monitor (even coarser in resolution than most computer monitors) will be our next challenge.


Base 9 & 12 Main Page