On Typography

This is an extremely complex subject, and one I've been involved with for many years. However, there are some fairly straight-forward ways to work with type on the web that achieve extemely good results.

The essence of the very best description of typography (any kind) was made in the 1920s by Beatrice Warde: Good typography is invisible.

What is meant is that type is a tool used to convey information. It is the information people are after. If the typeface is clear and easy to read, people never notice it. If you notice it, then it is getting between you and the information. You don't want that.

Stick to plain, and readable typefaces. I tend to favor Verdana and Trebuchet MS. The important thing to realize is that for the body of your text, you absolutely need to limit yourself to fonts (typefaces) that you know will be present on your visitor's machine. If you use a face that isn't everywhere installed, you have no way of knowing what will be substituted for it, and therefore can't know what your pages will look like on that visitor's machine.

CSS allows for this and enables you to list several faces in one type family. For instance, the type selection for these pages is made in the body element of the CSS code and looks like this:

    body
    {
      color:#000;
      font-size: 1em;
      font-family: Verdana, Arial, Helvetica, sans-serif;
    }
The type color is black (#000); the size is 11px (11 pixels high); and the type family is sans-serif. If the visitor has Verdana on his or her machine, that is what will be used. If not, the next in line is used--in this case Arial, and so on.

As you get deeper into web design you will find that not all browsers display the type the same way. In other words, the apparent size of the type displayed by IE7 may appear to be of a different size than the same displayed in Firefox 2. That is something you will eventually learn to deal with. (It doesn't always make a significant difference, but sometimes if a browser displays the type larger than you designed for, it can break the layout of your page.

There is a nice introduction to common faces in use on the web at the Web Page Design for Designers site.

© 2007-2012 VT2000 Technical Services. All rights reserved.