Begin site navigation:
Jump to Section Topics | Jump to Page Content | Contact Us | DenverGov Home
City and County of Denver Web Accessibility Guidelines
End site navigation.
Usability Tips
Begin left menu:
Section Topics
End of left menu.
Tech Spotlight
assistive technology photo: Ergonomic, split keyboard chair combination.

Begin main content:

Navigation

Navigation is a fundamental component of all Web sites, and it is one of the first things that visitors will encounter when arriving at your site. Good navigation aids your visitors in finding information and moving about the pages within your site. Bad navigation will confuse or frustrate visitors, who will lose interest in exploring your site.

Usability expert Steve Krug describes the importance of Web navigation in his book, Don't Make Me Think, by comparing it to the visual cues and features available in a department store to help shoppers find products. "Navigation isn't just a feature of a Web site; it is the Web site, in the same way that the building, the shelves, and the cash registers are Sears. Without it, there's no there there," he states.

Krug lists six fundamental purposes for navigation:

When designing your navigation, consider whether you are satisfying these purposes, and rely on these tips to help build effective structure for your Web site:

Create consistency

The use of consistent design strategies for all related documents makes navigation easier for everyone. A consistent look and feel across all pages of a site aids visitors in identifying ownership of a page. Once you have designed an accessible and effective page, use it as a template for all other pages of the site.

Related W3C WCAG 1.0 checkpoints: 13.4, 14.3

Avoid roll-out and/or Flash-based menus

JavaScript roll-out menus and Flash-based menus are common navigational elements on Web sites, which is unfortunate because they are generally inaccessible to many users, including those with older Web browsers, screen reader users, and some hand-held devices. Instead, try to find a balance between global, persistent navigation and local site or page navigation to include as many topics or links as you can without resorting to using these technologies.

Provide a site map or table of contents

Unlike a store or an office building, a Web site does not effectively convey a sense of scale. How big is your site? How much information can someone find on it? One of the ways to help identify the scope of your site is by including a site map or table of contents. This helps visitors to your site find information quickly, and can provide a way to offer content that the visitor might not know is available to them.

Related W3C WCAG 1.0 checkpoint: 13.3

Provide a method to skip past groups of links

Screen-reader users have to hear your list of links on every page before they can reach the interesting content of a page. A "Skip Navigation" or "Skip to Content" link helps these visitors navigate your site more easily and efficiently. For details, see the HTML Techniques for links.

Related Section 508 checkpoint: Paragraph (o)

Follow conventions

Unless you are designing for a specific audience, such as a personal Web site, it is typically best to follow existing conventions when it comes to navigational elements. Providing a site ID or logo in the upper-left corner helps identify ownership of your site. Always provide a Home button. Include a search option. Include Contact Us and Help links. These items should be part of your global navigation that appears on every page. Think about what works well on popular Web sites, and adopt those elements for your own.

Identify location using navigational cues

Include methods to identify the user's location, for example, a marker, an arrow, or a highlighted link so that the user can quickly visualize where they are on your site.

Include breadcrumbs

Studies have resulted in mixed opinions on the benefits of breadcrumbs, however, if you can include them, do so. They can supplement your global navigation and offer another navigational cue. They are typically more effective when they display the path the user took to arrive at the page. Position them near the top of your page, at eye level and close to your main navigation, using small text. Use leading words, such as "you are here," along with a separator between links such as the greater-than sign (>).

Consider tabs

Tab-based navigation, when designed correctly, can help convey the size and scope of your Web site by providing a significant number of links at once in a relatively small amount of space.

End of main content.
Begin page footer:
Validate the structure of this page: XHTML | CSS |
Check the accessibility of this page: WAVE | Bobby | Cynthia|
End of page.