This guide explains how to to choose fonts when designing a web site. The basic rule of thumb is to use no more than a couple of fonts on the same page. Using many fonts on a page is similar to a sit with lots of ads – the eyes and brain will have a hard time to understand what is important and what is not. By using a few fonts and changing the size and style (normal, italics and bold) we can make it easy for the reader to differentiate between the different elements on the page.
I will lay out in this guide which kind of fonts is good for each purpose. To select fonts that will be compatible with most of the operating systems and browsers, please read my article about common web fonts.
Short Documents
Short documents tend to look better in a sans-serif font – for example Helvetica, Verdana or Geneva.
Long Documents
Long documents such as manuals, books etc., should use a serif font for the body text – for example Times New Roman.
Headers, footnotes and tables
Headers , footnotes and tables, can be written in serif or sans-serif and should be different than than the body text by using a different font, using different or displaying in bold.
Width of text
To make it easy to read long texts, it is recommended to limit the width of the body text to 45-80 characters, including punctuation marks and spaces between the words.
Line Spacing – Line Height
The spacing between each line should be about 120-150% of the font size.
Spacing Between Paragraphs
Spacing betwen paragraphs should be set to about %150 of the line height.