Style comments

These are of course, just my opinions.
  1. ORGANIZE, ORGANIZE, ORGANIZE. If your student's can't find what they want in a few minutes with a couple clicks of the mouse they will not bother. You need a clear, logical, and consistent structure to help them find what they want.
  2. Keep each web page short and to the point. Scrolling to read long web pages is tedious. Scrolling through a web page is boring. Long web pages take more time to load. Break long documents into short pieces if you want students to read it on the screen. If you want them to print it out, make one longer document.
  3. KISS (Keep it Simple S-----). There is an extraordinary array of formatting features available for web pages. But overwhelming your audience with features may not help them.
    1. Don't use the blink tag. Did you ever look at a web page and say to yourself, "that flashing text really makes this easier to read"?
    2. Don't use animated gifs (graphics image file) just to be cute. In an outline, is that flashing spinning smiley face any more effective than a bullet? Or is it just distracting?
    3. Don't specify the font. If the viewer does not have that font, they will not be able to read your page.
    4. Don't underline text. People expect links to display as underlined text, if you use an underline they will try and click on it. When nothing happens, they'll be frustrated.
    5. Don't use blue or purple text. People expect links to be in blue or purple (the default settings). If you use these colors for text, they wil try and click on it. When nothing happens, they'll be frustrated.
    6. Don't change the colors of links. Once again, people expect certain colors to indicate links, if you change this, you will confuse your readers.
    7. Don't specify the background and text colors. You may really like reading yellow text on an orange background, but others may find the combination revolting. If you like yellow text on an orange background, setup your browser to display everything that way. But don't impose your color scheme on others. In addition to being difficult to read and visually repulsive, this can cause problems with printing. For example, if you specify white text on a black background, only a technically savvy user will be able to print your document.

  4. Think about what the web is good at, and focus on that. The web is a rich source of visual material. It is also a quick and efficient method for presenting text (although long passages are difficult to read on the computer screen and will be printed out to by most users). Audio and video are becoming available although these both require specialized hardware and lots of disk space on the server.
  5. Give up the desire for precise layout control. Keep your layout design simple. Don't try to set everything so that the spacing is perfect on your computer. It will show up differently on another computer. And still different when it is printed. The simpler the formatting, the more portable the presentation is. Some common mistakes include:
    1. Using spaces for formatting. Because tabs, indents, columns, and right justifications are not available in HTML, many people try to design pages using spaces. Don't try it, the page will look different on every computer. Often with terrible results.
    2. Using hard returns for line wrapping. Just like when you use a word processor, let the computer control the line wrap. This will let the browser adjust the lines to display properly on different size monitors and when printed. You don't have control over the margins and the page breaks on a web page. So don't try. If you need that level of layout control, look into using acrobat documents.
    3. Page layout control. If you want to carefully control the layout of a page, learn how to use tables. It is more work than you may want, but it does provide control, flexibility, and robust page layout.
    4. Page display. Remember that the page will display differently on different size monitors and also when printed. Take a look at your web page on a 14" monitor and on a printer to verify that it works well under these conditions.

  6. Additional Information
    1. HTML Code Examples. This document contains examples of the most common HTML tags so that you can see how they effect the page layout.
    2. Hypertext Style guide from WWW3 This guide has many useful suggestions about writing "good" HTML.
    3. Composing Good HTMLThis is a more advanced and detailed discussion about writing HTML documents. This is highly recommended for anyone who has started writing HTML and is ready for some more detail. It also offers comments on common mistakes.
    4. The Yale Style Manual
    5. HTML Terrorist's Handbook This is a humorous and useful listing of things to avoid.


This page is maintained by
Scott Van Bramer
Department of Chemistry
Widener University
Chester, PA 19013

Please send any comments, corrections, or suggestions to svanbram@science.widener.edu.

This page has been accessed 3185 times since 5/30/97.
Last Updated 5/18/98