When ways to navigate content are repeated on multiple pages, they must be presented in a consistent manner. This makes it easier for people to learn how to navigate the service, and it enables people to develop strategies (like using screen reader shortcuts) for more efficient navigation.
Accessibility Requirements for 3.2.3 Consistent navigation (AA)
- Navigation mechanisms are presented consistently wherever they are used.
Common mistakes for 3.2.3 Consistent navigation (AA)
- A main navigation block is used on multiple pages, but is located in a different place on each page;
- A breadcrumb navigation is used on multiple pages, but is presented in a different format on each page.
The following are common mistakes that are considered failures of Success Criterion 3.2.3 by the WCAG Working Group.
FAQs for Consistent navigation (AA)
Why is Consistent navigation important?
Ensuring that repeated components occur in the same order on each page of a site helps users become comfortable that they will able to predict where they can find things on each page. This helps users with cognitive limitations, users with low vision, users with intellectual disabilities, and also those who are blind.
Why is consistency important in design?
Overall consistency creates a sense of structure for the viewer. Which helps them understand more about your product, idea or message. It also helps to form a framework for a designer to work within. Saving them time and focusing the work they create so it is as successful as possible!
How to ensure websites/devices has consistent navigation?
1.Keep navigation menus in the same location on all pages; and
2.Present the options in navigation menus in the same order on all pages; and
3.Keep all other standard elements (for example, your search box) in the same location on all pages.
What are the challenges in adding secondary navigation bar?
Providing consistent navigation does restrict content authors or developers from adding secondary navigation or additional components into the layout of the page.
Below is an existing navigation region on a web page.
Home About Blog Screen Reader
Below is a failure scenario after adding one additional element.
Home ScreenReader About WAI ARIA Overview Blog
In the example above a new element WAI ARIA Overview is added. At the same time the Screen readers is moved from position 4 to position 2 in the order in which the navigation links display.