Overall Effect 
About Works Used
Links to Works Used

Front Page 
Author's Home Page 

Last Updated: 
April 27, 1998 


To the Top 

Good Sites: Typography

I have been the faculty advisor for several yearbooks. One of the lessons I learned along the way was to be careful of varying your fonts too much.  By my final year as advisor, my students would determine the font type used for all headers (headlines), and the font type used for all copy (text -- like this paragraph).  Experts from our publishing company suggested that no page have more than two different type of fonts on them. More over, they suggested that one type be "curly" (serif), and one type be "straight" (sans serif).  You will see this strategy employed in my own pages:  Note my header is always 36-point monotype corsiva.  More over, my text is always 12-point "variable width."  At any rate, to produce a successful site, one must employ good typographic skills  --  the same type used to create good yearbooks!

1)  Font sizes are consistent:   All headers, subheaders, and copy should be the same sizes.  (That is, if the header on one page is 36-point and the copy 12-point, than the header on all pages on that site should be 36-point, and the copy 12-point, etc.)

2)  No more than two font types per page, under normal  circumstances.  Students want to avoid the scattered look many different fonts creates -- unless of course the scattered look is the specific effect being achieved.

3)  Student uses bolds, blinks, italics --etc. -- deliberately. Just because you can, doesn't always mean you should! Bolds, blinks, italics, etc. serve to make certain text "stick out". If everything is bold, or blinking, or in italics -- than is anything really being emphasized?  I don't know who first said it, but it is a good saying:  "If you emphasize everything, than you emphasize nothing!"

4)  Make text reading easy!  According to The Yale Style Guide, the average eye cans about three inches or so in width.  Thus, if you make your text columns more than three inches wide, than you are making your reader work more than necessary. Look at modern reference books being published today.  You will see that many do not fill the entire page with text.  By shortening the width of text, they attempt to make text reading easy!

5)  Use "white space" wisely:  Think of your copy in terms of boxes.  Each "box" of copy (text), needs to be spaced from the other boxes so that the human eye can easily distinguish between the two.  This page is set up  so that their is a 10-space gap (or "gutter") between the table of contents and the main text.  Use white space to help guide the reader to the different chunks of information.

Note:  Remember, that font sizes and font types vary greatly from computer to computer.  It is a good idea to view your page on a variety of browsers -- on both low and high-end equipment -- to determine if the copy you have selected works on the majority of your user's computers.

                                                                   to rubric