Navigation
Consistent Navigation
WAI Definition (Checkpoints 13.4 and 13.5)
Use navigation mechanisms in a consistent manner.
Provide navigation bars to highlight and give access to the navigation mechanism.
Explanation
Navigation mechanisms direct the user to key sections and/or pages of the site. These mechanisms should be designed to clearly state their destinations and to indicate the current position of the user. They should also remain consistent visually and structurally from page to page.
Rationale
The navigation mechanisms should be presented in a uniform, well-structured and logical order so as to avoid confusion or disorientation.
Technique
In order to ensure a uniform site, you should:
- establish a consistent visual presentation from page to page;
- maintain a constant sequential order;
- maintain language and terminology consistency;
- maintain consistency in the location of navigation controls.
This provides a smooth transition from page to page, enabling the user to navigate easily and quickly.
The navigation menu should always include a link to the site's homepage.
Breadcrumbs
Sites with complex architecture can also benefit from breadcrumbs. They typically appear horizontally across the top of a web page, usually below any title bars or headers. They provide links back to each previous page that the user navigated through in order to get to the current page. In hierarchical structures, it is often the parent of the current page. Breadcrumbs provide a trail for the user to follow back to the starting/entry point of a website and an indication of where they are on the site. They may look something like this:
Home page → Section page → Subsection page
Validation
Test
Look at the page.
Success Criteria
As you navigate to each page, the following elements should be consistent:
- visual presentation;
- sequential order;
- language and terminology;
- location of navigation controls.