Web Site Navigation
In the beginning (circa 1970), the idea of a hyperlink (a way to jump to any content anywhere on the World-Wide-Web from a simple link on a web page) seemed very cool! So cool in fact that the amateur web designers of the day (there were no professionals yet) linked everything to everything in their zeal to take advantage of this fantastic new technology. As the Internet grew however, indiscriminate use of hyperlinks caused chaos and surfers getting lost in the net. Professional web developers had to find a better way to provide surfers with a simple and straightforward way to access the content of a web site.
The menu bar commonly seen on web sites today evolved from this need.
Still the most common mistakes made in web sites today are the improper use of hyperlinks and poorly designed navigational systems.
To avoid these mistakes, follow these rules:
- The menu bar should appear in the same place consistently on every page of the web site. A menu bar that moves around, changes its appearance, or sometimes disappears completely, is confusing and disconcerting to the visitor and is a dead give-away indication of an amateur web site.
- Links to all of the pages should be on the menu bar, not embedded in the pages, or lost in the text. Don't hide your content! If it deserves a separate page on your web site then it deserves a place on your menu bar. Do not expect a visitor to read through your pages again just to find a link.
- Feedback (such as rollovers) should be used to indicate active links and a successful click. Too often it is not immediately clear which items are click-able (hyper-linked) and which are not. Use a clear, consistent style for links and headings, and make sure your links change as the cursor is passed over them.
- Indicate which page the visitor is currently viewing by highlighting that menu item. Knowing where you are is the key to getting where you want to go. Mall maps are illustrative of this concept. There is usually a big red 'X' and a 'You Are Here' caption clearly marked. Imagine making sense of one of these maps without this reference point, and you will understand the need for a similar device on your web site menu bar.
- Name each link appropriately, call it what it is, be specific, and use the conventions. Don't get cute, or verbose, or try to be original for originality's sake. Visitors do not know your business, so use language that lay people will understand, even if it is not 100% accurate. Also, never use hidden menus that only reveal themselves once you pass your mouse over them! Who thought that one up anyway?
- Targeted links, e-mail links, PDF links, media links, and especially off site links, should be marked accordingly and should not be on the menu bar. The menu bar is for pages to the rest of the site. Links to subsections of a long page should only be on the same page, usually at the top, so visitors can easily skip down to the content they want to view. Links to other kinds of content should be clearly marked so the visitor will know in advance what will happen if the link is clicked. For instance, if your 'Contact Us' link on your menu bar is actually an email link, the visitor who only wanted to see where you were located, gets a surprising launch of their email program instead!
- There should be only one main navigation bar. Providing only one path through your web site makes finding information, and then finding it again when needed, straightforward and easy to remember. Multiple menu bars - especially with redundant items - add confusion, clutter, and maintenance headaches to your site.
Back2Front has done extensive usability research to develop these rules and has created many successful web sites following them. Break these rules at your own risk!
By Candace Carter, Back2Front -The Web Site People, 2006