What font to use - serif vs. sans-serif

A font is simply the typeface that you use in your document. Just about everything you create on your computer allows you to select the font, or typeface to use. A complete discussion on typography is well beyond what we want to tackle here, there are plenty of books written on the subject if you're interested. What we'll do with our discussion (as we do with most things), is boil it down to a gross over-simplification of the facts.

All we're going to talk about here are the two main styles of fonts - serif and sans-serif. As a picture is worth a thousand words:

serif and sans-serif fonts

Serifs are the small lines at the ends of the characters on the letters of the typeface. A serif font has those small lines, a sans-serif font does not.

Typical serif fonts are:

  • Times, Times New Roman
  • Courier, Courier New
  • Georgia
  • MS Serif

Typical sans-serif fonts are:

  • Arial
  • Helvetica
  • Tahoma
  • Verdana
  • MS Sans Serif

Ancient wisdom (well, at least since the days the heavy metal letterpress) tells us that we should use sans-serif fonts for titles, headers, and other short blocks of text, and serif fonts for the main body of the document. The reasoning behind this has to do with the purpose of the serifs. The serifs on the letters are designed to pull the text together, making it easier for your eye to transition from one letter to the next, then from one word to the next. In effect, the serifs 'pull' you through the document, and in doing so make the text easier to read. Therefore, long blocks of text will be easier to read if they are written with a serif font. Sans-serif fonts work well in short blocks of larger text, what you would typically find in titles and headings.

Now, before you go creating your next eBook about your pet rock you should know that reading text on a computer screen is considerably different than reading text on paper. The primary reason for this has to do with something called resolution. While making a detailed comparison of the relative resolution of paper and the average computer monitor would no doubt bore you to tears, for the purpose of our discussion we can say it is the number of ink 'dots' you can fit into every square inch of surface material. The smaller the dot the more you can fit into every square inch of, let's say, paper or computer screen. The more dots you can fit into every square inch the higher the resolution. The higher the resolution the easier it is to read. You can create smaller dots, thereby fitting more dots, onto every square inch of paper than you can on every square inch of your computer screen. Therefore, paper has a higher relative resolution than your computer screen. The logical conclusion then is that something printed on paper is easier to read than something 'printed' on your computer screen. Simple, huh?

Actually, technically I've taken some shortcuts here and it's really a whole lot more complicated than that. Still, I think everyone will agree that it is more difficult to read text on your computer screen than it is to read the same text on paper. For that reason you should not necessarily automatically use a serif font for long blocks of text, especially if the primary purpose of your document is to be read electronically. The small serifs can sometimes blur when you view them on your computer monitor, which will actually make your text more difficult to read, instead of making it easier. That's why the vast majority of websites (including this one) use a sans-serif font, instead of a serif font, for all of the text, regardless of the length of the document.

So what does this mean to you? Well, it always seems to come back to the primary purpose of the document. If you are creating something whose primary purpose is to be printed on paper, then the typical sans-serif for titles and headers, serif for the body of the text is probably best. However, if you're creating something that will primarily be viewed on the computer, you are probably better off sticking with a sans-serif font for everything.

Additional resources: