The best website fonts for legibility

In a previous post titled The best fonts for websites, I talked about how to choose the best fonts for your website so that no matter which operating system your visitor is using (Windows, Mac, Linux, etc.) or which version (Windows 98, XP, Vista, Mac OS 8 through 10.5) they will be able to see exactly what you intended.

In this post, however, I’d like to talk about which font style is best for legibility (i.e. which font is easiest to read on a computer monitor.) But before reading deeper into this post, I encourage you to check out the post mentioned above (The best fonts for websites) as well as the post titled Different types of fonts. They both contain information that will help you understand this post.

All done? Ok! Let’s uncover which fonts are best for website legibility:

Serif fonts: The crowned ruler of the paper kingdom

If you’ve ever read a typical magazine or book (that was actually printed on paper ), then you will have seen a serif font in action. Serif fonts — the kind of fonts with the little “slashes” at the ends of the letter strokes — are the best fonts for the printed word. Why is that? Because the little serifs actually help to make the letters flow together and make reading much easier on the eyes. Some common serif fonts that you probably know include Times New Roman and Georgia.

The computer monitor conundrum

There is one thing that many computer monitors lack that makes using the above mentioned serif fonts the perfect choice for your website: adequate resolution. Resolution is basically how many pixels your monitor can display. The more pixels there are, the more details you can have. For example: my monitor has a resolution of 1600 x 1050 (which is pretty darn good.) But not everyone has such a high resolution monitor. And in order for those little serifs to make reading easier, a large amount of detail is required.

Back in the day (which, in computer years, means about 10 years ago), the best monitor resolution was around 800 x 600. Not that great for serif fonts. And nowadays, devices like Apple’s iPhone (320 x 480) and the new genre of computers called netbooks (most being 800×480) — both of which can be used to surf the Internet — also have a somewhat “limited” resolution to accurately display those detailed serif fonts.

Sans Serif fonts: The masters of all computer monitors

Since not everyone has a high-resolution monitor to surf the Internet, we’ll have to avoid using serif fonts on our websites if we truly want the pure text (i.e. the sentences and full paragraphs of text) to be easy to read and easy on the eyes. That’s where the Sans Serif fonts come to the rescue.

For many years, sans serif fonts have been the main style of font used for the pure text of websites. Since they all lack the little “slashes” of the serif fonts, they don’t become garbled on lower-resolution monitors. This makes them the perfect choice for the pure text of your website.

Looking at the first list from the post titled The best fonts for websites you can see only four serif fonts that all operating systems of all recent versions can display. Those are:

• Arial
• Helvetica
• Trebuchet MS
• Verdana

If you stick to using one of these for the pure text of your website’s content, then you will have almost guaranteed the legibility of your text. Your visitors may not directly thank you for it, but they will be much happier when reading the inspiring words you so arduously brought forth from the creative depths of your mind.