System preferences

Back

SECTOR 02.1Transmission open

Web-safe fonts

In 1985 Apple shipped the LaserWriter. Your font stack still pays for it. Adobe licensed Apple 13 fonts for that machine, and three of them sit in the CSS at the bottom of this page. Each comma in a font stack sits between an original and its clone.

The easy story blames the browsers. The real one starts at a printer and ends in a bankruptcy.

In 1984 HP shipped the HP LaserJet. It was the first laser printer built for mass-market sales. One year later Apple answered with help from Adobe. The LaserWriter carried a built-in PostScript interpreter. With an editor program, anyone could create, publish and distribute their own content. That is the Desktop Publishing revolution.

VISUAL // ARCHIVEThe original LaserWriter640×305px

Printers picked the fonts

Adobe licensed Apple the first 13 mass-market fonts. Times, Helvetica, Courier and Symbol. Four variants of each, and one for Symbol. The LaserWriter Plus added 22 more later, among them AvantGarde, New Century and Bookman.

Why those fonts? Technical limits picked them. Times, Helvetica and Courier print easy. They carry little detail. The printer needs simple roller movements.

Price decided the buyer. Before the revolution IBM sold 600dpi printers at 21.000$. The LaserWriter started at 6.900$.

Microsoft answered with clones

Now the web. In 1986 Silicon Valley was young and the big fight was about operating systems. A decade later the fight moved to browser control.

The record here is thin. No official documents survive, only a bunch of declarations from key members of different companies at that time. Monotype was about to go bankrupt. Monotype drew most of the fonts we use today: Arial, Baskerville, Gothic, Bodoni, Gill. Some of them shipped inside those printers. Microsoft came to the rescue.

Monotype then drew a set of analogous fonts for Microsoft. The new fonts copied the licensed ones. A legal war followed, with many parties in it. I do not know every detail of the case. The result is clear. We do not have standard fonts. We have clones.

The clones are the good news. The Microsoft fonts are almost identical to the original ones. So name the original first, name the clone second, and the pair holds anywhere. This is the closest the modern world gets to a common font face set. It is also why no list of web-safe fonts exists.

The CSS rules below are safe in any combination of browsers and OS. Embrace them. We need it.

CODE // TRANSMISSION11 LINES
.font-serif {
  font-family: Times, 'Times New Roman', serif;
}

.font-sans {
  font-family: Helvetica, Arial, sans-serif;
}

.font-mono {
  font-family: Courier, 'Courier New', monospace;
}

Drop the demand for 100% support and the set widens. The fonts below are the best supported ones. Almost available everywhere.

Mac (and most Unix)MicrosoftFamily
HelveticaArialsans
Arial Black~sans
Courier New~mono
Georgia~serif
MonacoLucida Consolemono
Lucida GrandeLucida Sans Unicodesans
GenevaTahomasans
TimesTimes New Romanserif
HelveticaTrebuchet MSsans
Verdana~sans
Symbol~symbol
GenevaMS Sans Serifsans
New YorkMS Serifserif

The web never agreed on a font. It agreed on a comma.