Principia Hypertextica · A Mathematics Educator's View of Web Design

                                       ------------
intro  speed  accessibility  validity  navigability  typesetting  links
                                       ------------

Navigability

A well organized site is a pleasure to navigate through. Visitors understand the scope of the site and how to get from one place to another. There can be surprises, but the overall feeling is calmness because the parameters within which surprises occur are well defined.

On these pages, for example, identical navigation bars appear at the top and bottom of each page. This predictability helps visitors review what they've seen and what they want to see next. It also suggests a possible way of reading through the material. Within this established structure there is perhaps only one surprise: selecting the "links" item brings you to a location on the links page that depends on the page you are jumping from. Aside from this, the navigation system is simple to master.

• Avoid dead-end documents. Put at least one hyperlink on every web page. In other words, every page should have some kind of navigation, even if only to point the way to a suggested exit.
• Don't link pages to themselves unless you are linking to a named anchor within a long page. Note, for example, that the navigation bars on these pages deactivate the name of the current page.
• Consider using <tt> or <pre> for navigation items, because they will likely be presented in a monospaced font that will contrast with the font used for regular content on the page. I think it is useful to separate "navigation" from "content" in this way.
• Repeat navigation items at the top and bottom of larger pages. Some authors repeat navigation items on a regular basis throughout very long pages.
• Limit the levels of depth. If you link every page in your site to a main page, and then link your main page to a site map page, then a visitor can get from one page to any other page in your site with a maximum of 3 selections. (This can be reduced to 2 selections if you link every page in your site to the site map page itself.) Avoid building a site where it takes 5 or 6 links to reach the innermost level.

It's important to imagine your web pages in other contexts. One of the principal features of the World Wide Web is that every web page -- and indeed any named anchor within a web page -- can be accessed from any other web page.

• Don't be too unconventional. Because someone can jump to any web page or anchor in your site from anywhere in the Internet, your navigation system is going to be part of a larger system. It should be easy to understand.
• Don't use "go back" as navigation text. There is no such thing as a "back" button on a web page because there is no reliable way for a browser to know where the visitor came from. It's better to be terse and say "go to home page" or simply "home page" when you are making a link to a home page. If visitors want to move back in their history, they'll use the "back" feature of their browser.
• Don't hyperlink the words "click here." You should hyperlink the noun that describes the target of the link. When people scan pages and read only the hyperlinks, this is more informative.

Because images grab attention, they are frequent items on web pages. Sometimes they can be used effectively as navigation tools. If you use images for navigation, make sure their purpose is clear.

• Don't encourage visitors to click on dead areas. If a graphic image on your site looks like it represents a link -- such as a button with a 3-d beveled appearance -- then make sure it is a link.
• Try navigating through your pages with images turned off. Are your ALT texts sufficient? Is there a text-based navigation system that works?
• Don't give ALT text for bullets or divider lines that say "bullet" or "divider line." Instead, just use "" or "*" or something simple like "-----". If an image is a link to another page, then the name of this target is probably more useful than a description of the image itself. Alan Flavell has prepared a useful essay on good and bad ALT texts.
• Consider using only text-based navigation. Image maps take a long time to load, and users may not always realize which areas are clickable in an image.

A good navigation system helps your visitors find their way around your web pages. You can do a few other things to help your visitors and encourage them to visit again.

• Include the date of last revision on the page itself. Savvy people can find this information using the "document info" feature of their browser, but it's useful for regular visitors to know how up-to-date the material is.
• Include the URL (web address) of the page on the page itself, so that people who have only a paper printout of the page can revisit the site. Not all browsers print the URL automatically.
• Include your name and contact information, such as an e-mail address, on the page itself. Take credit for your work and help visitors ask you for more information.

                                       ------------
intro  speed  accessibility  validity  navigability  typesetting  links
                                       ------------

http://world.std.com/~wij/web-design/navigability.html
revised 26 June 1997
HTML 3.2 validated

William I. Johnston Home Page

wij@world.std.com