Skip header information, go directly to content

mwas standard Standard 15 -- Skip Navigation.
A method shall be provided that permits users to skip repetitive navigation links. .

Examples:
15.1 -- A link is provided to skip over lengthy lists of links (e.g. navigational menus).

Navigation -- Dos and Don'ts

Do Don't

Allow users to skip navigation.

Bury content far down the page or after a lengthy links-list.

Why: Web sites are often top-heavy with menu items and screen readers must read all these items each time a page is loaded before the main content is read. Even a repeating menu of just five links can quickly become annoying. Further, more recent screen reader updates include an auto-detect feature that automatically positions the cursor at the "content" anchor rather than reading the full menus.

How: This in-page link may be either visible or invisible. You can make it invisible by using a style sheet to color the text the same color as the page background or by using a transparent image link (no less than 2 pixels by 2 pixels). Place an anchor/bookmark in the page immediately before the start of the content. Link the skip navigation text or image to that anchor. The link text or image ALT tag should be either "skip navigation" or "skip nav."

More Navigation Hints and Tips for Accessible Design.

Do Don't

Use clear navigation that is focused on user tasks.

Include repeated navigation links on every page to infrequently visited sections of the site or areas meant for only a small portion of your users (e.g., internal pages).

Why: More choices do not always mean better choices. Users need help narrowing choices in making fast decisions. While the form of navigation -- navigation bar, breadcrumb navigation, text navigation -- should be consistent throughout the site, it is preferable to change the navigation options to fit the particular function of the site page. A page directed at students may not need to include links to pages directed at faculty or staff.

How: Don't put a link to every page in your site on every page in your site. Help users navigate your site by creating navigation paths for different users -- students follow one path, instructors another, and administrators yet another. Then you need only include links to the start of each major "path" on each page.

Do Don't

Give users an indication of where they have been and where they can go in the site.

Override visited and unvisited link colors, so users are unsure which areas of the site they visited last, want to return to, or still need to view.

Why: As a site grows, it is important to help users find what they are looking for quickly. By differentiating between visited and unvisited links, you help the user quickly return to a desired section or narrow-down choices when looking for specific information.

How: Don't use style sheets to make all links look the same. Whenever possible, use the universally recognized colors: blue = unvisited link; violet/red = visited link.

Do Don't

Provide multiple entry and exit points into each page, so users can navigate the entire site without using the browser's navigation.

Break the BACK or HISTORY lists so users cannot return or jump back to a previously visited page. This includes using pop-up windows.

Why: Forcing users to use your own navigation system including a script created back button or frame navigation, reduces the functionality of the site and can be extremely disorienting. Users cannot bookmark pages to "jump" back to specific information and cannot "back out" of navigation when they have taken the wrong path.

How: Avoid frames whenever possible. Do not turn off browser navigation, such as the back button. Do not open pages in new windows.

Do Don't

Create custom Error 404 pages that direct users to helpful pages (e.g., site search or site map) when an incorrect or missing URL is entered.

Cause pages to refresh or redirect automatically.

Why: Generic Error 404 pages offer no help when users are looking for a specific page in your site. Automatic redirects break the history list and can cause continual loops when using the back button to return to the previously viewed page.

How: Create an Error 404 page with a link to your home page and site map and, if possible, include a search option on the page. Do not automatically direct users to moved pages: provide the new URL on the old page and ask users to use the new link.

Do Don't

Include a site map or table of contents for the site.

Stylize the site map or organize it using embedded tables and lists which may be difficult to navigate using assistive technology.

Why: Different users rely on different browsing strategies: some like to use the site search, others use the navigation menus, and others prefer a well-organized site map that conveys the "lay of the land" and offers both a text-based and visual interpretation of the sites organization.

How: Organize your site map using headers and lists. Avoid tables. Users who choose to navigate the site using the site map do not need/want the other elements on the site map page -- remove duplicate navigation menus and search boxes and make the site map page as clean and simple as possible.

Get more help with navigation, visit WAI's "13. Provide clear navigation mechanisms".

previousPrevious Nextnext

Top of Page || Return to Index
View/print in PDF format. (Acrobat Reader required.)

Ohio State University