Designing Navigation

Providing a Roadmap For the Internet Traveler

By Linda Moore


 

The Internet has been called the Information Superhighway. Some readers travel it using search engines. Others may access a site directly. What happens when a reader exits the highway to visit your site? Are the signposts clearly marked, or is the reader left to find his or her own way?

Return to Newsletter

 

"When a reader accesses your site, he or she will ask 'Did I get there?' followed by 'Is this where I wanted to go?' Once the reader is satisfied that your site is the intended destination, the next question will be 'Where can I go from here?'"

When a reader accesses your Web site, the first question he or she will ask is "Did I get there?" followed by "Is this where I wanted to go?" If the reader is satisfied that your site is the intended destination, the next question will be "Where can I go from here?"

First Impressions Are Important

How many times have you accessed a Web site and, once there, did not know whether it covered the topic you were seeking. What did you do? Scroll through the information to try and find what you were looking for? Or, did you enter another Web address in the Command line or click the back button in your browser to select a better candidate from the search engine results.

The first image in your Web site should outline your site's contents and highlight its features. You may never get another chance to make a first impression.

   

 

Designing the First Image

The first image is what the reader sees upon accessing your Web site, without scrolling. It should clearly announce your site's purpose, include a list of topics and link to key areas.

If the main menu is too large to fit within the first image, use a smaller menu to link to key sections. If your site is large enough, divide it into chapters and use the first image to link to them.

   
 

Designing the Main Menu

The main menu is the first menu in your site. If your site is small, the main menu may list all the topics available to the reader. If your site is large, the main menu may list general topic areas and link to other menus in individual sections. If your site provides features and tools as well as content, the main menu can link to them as well. The goals of the main menu are to provide a snapshot of your site and invite the reader's commitment by prompting him or her to select an item.

In designing the main menu, you aren't limited to a list. A matrix or site map can be an effective tool to get the reader's attention and help him or her navigate your topics.

Here are some main menu examples.

   
 

Designing Section Menus

If your site is complex, you can use section menus to provide more detailed links for the reader. Section menu goals are the same as those of the main menu: to provide a snapshot of the section's content and invite the reader's commitment.

Again, if possible, try to fit the section's contents in the first image (although this may not always be possible). If your content is highly-structured and includes topics that can stand alone, you can use a matrix menu to provide exact links for the reader.

   
 

Adding Flexibility With Backward Links

No matter where a link takes your reader—to another file or to another location in the same file—always provide a way for the reader to link back to the point, or at least the file, of origin. The Internet is full of one-way tickets that leave a reader stranded at the end of a link. Be sure you give your readers the option of a round trip.

To link back to the file of origin, link back to the file name. The link will take the reader to the top of the file (you can also use this approach to link back to the top of a long file). To link back to the point of origin, link back to the bookmark in the file of origin that is closest to the point where the reader took the link. Sample

   
 

Linking to Glossaries and Tools

If your Web site includes a glossary or other tools, you probably want them to be constantly available for the reader. Unfortunately, there is no easy way to do that on the Internet. You can't have a header, footer or sidebar accompany your page without using frames.

One way to provide frequent access to tools is to include links to them with headings. Another is to include links to them with return links. Sample

If you have a variety of tools to make available to the reader, you can use frames to create a toolbar that is always accessible to the reader.

   
 

Linking With Graphics and Image Maps

A graphic is a picture that can link to a single topic. An image map is a picture with designated hot areas that can link to multiple topics. Both are effective navigation tools. Here are some pros and cons.

Graphics

  • Pro: Graphics simply need to be inserted in your document and linked. No additional work is required to define and process hot areas.
  • Con: When linked, a graphic is bordered with the selected-link color, detracting from its appearance in many cases.
  • Con: If you want to link to more than one topic, you must use more than one graphic.

Image Maps

  • Pro: When linked, an image map is not bordered with the selected-link color, preserving its appearance.
  • Pro: You can use one image map to link to many topics.

Image maps used to be difficult to create, requiring placement of processing files for hot areas on the Internet server. Newer Web authoring packages have made image maps easy to create, and it is possible now to place all coding on the client side.

PushpinQuick Reference Guide

The Internet has made it easy for us to communicate with our colleagues worldwide. Navigation is a key part of that communication. Whether you take your readers down the main road or off the beaten path, be sure your routes are well-marked. Your readers will thank you for a pleasant, and informative, trip.

Top

© 1997-2002 Linda Moore: Instructional Designer, Writer, Editor
P. O. Box 5158 Dearborn, MI 48128

Phone: (313) 277-8542 Fax: (313) 277-8541 Email: lmoore@gr-lakes.com