Web Design Principles--Typography
    Home

    Planning

    Alignment

    Contrast

    Proximity

    Repetition

    Color

The key to typography on the web is to make sure that your text is readable and legible. Readability and legibility sound similar, but they are not the same.

The ease at which you can read large amounts of text is readability. Legibility refers to smaller amounts of text, such as headings or even a short paragraph of text.

When deciding which fonts to use, the general rule of thumb is to choose a serif font for long sections of text, and a sans serif font for small amounts of text. More importantly, make sure the font is clean and easy to read. Try a few different fonts on your website and decide which ones works the best for you.

A few more suggestions to ensure readability and legibility of your website are:

  1. Size
    • No bigger than 14 point
    • No bigger than 10 point
  2. Don't apply text effects to an entire paragraph
    • Bold
    • Italic
    • All caps
  3. Avoid very long lines of text
    • Use phantom tables for layouts
    • Use blockquote to increase margins
  4. Color
    • Contrast between text and background
    • Choose complimentary colors

Source: Tollett, John and Williams, Robin (1998. The Non-Designer's Web Book (pp. 213-224). Berkeley: Peachpit Press.

© Copyright 2007 Kenny Loveall