Writing for the Web

By David Walbert

LEARN NC was a program of the University of North Carolina at Chapel Hill School of Education from 1997 – 2013. It provided lesson plans, professional development, and innovative web resources to support teachers, build community, and improve K-12 education in North Carolina. Learn NC is no longer supported by the School of Education – this is a historical archive of their website.

There are thousands of different fonts out there, and new computers now come with dozens already installed. Which fonts you choose can make a big difference in your audience’s ability to read, understand, and use what you publish. Happily, there are some basic rules you can follow to make your publication easily usable. We’ll look at the various types of fonts (serif, sans serif, and decorative) and then consider choosing when to use them.

Types of fonts

All fonts fall into three basic types: serif fonts, sans serif fonts, and decorative fonts.

Serif fonts

A serif is the little line at the top or bottom of a font such as Times or Garamond that helps to keep your eye moving along the page. Here’s an example of some text written in Times New Roman:

serif fonts example

Notice how all the serif seem to flow in the direction of the text, helping the baseline of each line of text to stand out clearly. Their purpose is to keep your eyes moving along from left to right as you read.

Sans serif fonts

Fonts without serifs are called sans serif fonts (literally, “without serif” — clever, huh?). The most common sans serif font is Arial:

Sans serif fonts example

Sans serif fonts tend to stand out more than serif fonts, but they aren’t as easy to read in long lines of text and long paragraphs.

Decorative fonts

Decorative fonts are for, well, decoration. They’re fancy fonts that are designed to make a visual impact rather than to be easily read. Fonts that look like cursive script or handwriting fall into this category, as do fonts like this one:

Decorative font example

Choosing fonts wisely

It can be really, really tempting to use eight different decorative fonts on a page, especially when you’re first venturing out into the wide world of design. I know: I have over a thousand fonts at my disposal. I want to use all of them. But resist the temptation. You’ll only confuse your readers.

You should use no more than three fonts per page or document: one for text, one for headings, and a third (possibly) for titles and/or decoration.

Print documents

Because serifs help the reader’s eye move along long lines of text, you’ll generally want to use a serif font for your main text. Sans serif fonts are good for headings, because they stand out on the page. And decorative fonts should be reserved (need I say it?) for decoration.

Designers sometimes break these rules. Serif fonts, if they’re large and printed in boldface, can make perfectly good headings. Because they tend to look serious and important, they make good titles and headlines. Sans serif fonts are good for small blocks of text in sidebars or called out from the main text. But until you have some experience and a strong sense of what works and what doesn’t, it’s best to stick with tradition. (And remember, even professional designers make mistakes!)

Web documents

On the Web, the rules are a little different. On paper, fonts print smoothly, but on the Web, fonts display as collections of individual pixels. As a result, the serifs seem to be less useful. Most people find sans serif fonts easier to read on a computer screen.

The best choice, though, is a font designed specifically for display on a computer screen. Georgia (serif) and Verdana (sans-serif) are good choices; others are Tahoma, Lucida Grande, and Trebuchet MS. More web-safe fonts are being designed all the time.

  • Next: