Guide to Web Design

Navigation

There is only one navigational goal: Let visitors quickly and easily find whatever it is they’re looking for on your site.

A navigational system that's easy to understand has to answer four questions.

1.      Where am I? Your visitors should always know where they are in your site and how this location relates to the home page. It's their point of reference.

2.      Where have I been? Yes, graphic links are popular, but you can't look at a button that says, “About This Site” and know whether you've clicked it before or not. You have to rely on your memory. One reason for using text links is that if you've set them up correctly, they change color once a user clicks them — a nice visual cue that most Web users are familiar with.

3.      Where can I go next?

4.      Where's the Home Page?

Navigation must be simple and consistent.

Take a look at this mess! Teacher Express.  And another example of terrible navigation

Common mistakes include different types of navigation on the same site, a link to the current page on the current page (home page link on home page), and poorly worded links so the visitor doesn't know where he'll go if he clicks, no links back to the home page, and confusing links to the home page.

Nobody cares about you or your site.

Really. What visitors care about is solving their problems. Most people visit a web site to solve one or more of these four problems:

  1. They want/need information
  2. They want/need to make a purchase / donation.
  3. They want/need to be entertained.
  4. They want/need to be part of a community.

A web site is about solving your customers' problems and meeting their needs.

File Size and Contrast

Physically reduce the file size of your graphics

Don't use unnecessary music files and cut down the file size of the page.

 Make sure there's enough contrast between the text and the background. Make your text readable. Here’s an example of poor contrast (Xerox) Xerox Inks

Check your site in different browsers (this tip is good for any site) and tighten up the white space. Lack of Contrast

Focus

Tone down the graphics

 Eliminate unnecessary design items. Here’s an example of a bad design. Gates and Fences

Here’s an example of a flashing, blinking nightmare! Car Leasing.  And another!! Accept Jesus

Finally - some more examples of truly BAD sites

Worst Web Site of 2006
Mystery Meat Navigation
A Design Mess
Another Poor Navigation Site
Text Doesn't Match Graphics
Mystery Meat Navigation from Big Company!