‘Consistent Navigation’ requires that menus and standard controls are positioned consistently.
Introduction
When you visit a website these days, it’s almost second nature to understand where the main menu is and to expect it to be in the same place on every page. Web designers know that having a consistent navigation menu helps users move around websites.
Consistent navigation helps users who may have trouble moving around a website and find themselves ‘lost’ more often than others. Your users who rely on spatial navigation, due to impaired sight, or need extra help understanding your website benefit most.
This consistency also applies to standard controls of your website – things like your search box or ‘Skip to Content’ link. Don’t move them all over the place, use a consistent template for key elements.
How to Pass ‘Consistent Navigation’
- Keep navigation menus in the same location on all pages; and
- Present the options in navigation menus in the same order on all pages; and
- Keep all other standard controls (for example, your search box) in the same location on all pages.
‘Consistent Navigation’ Tips
Using a standard template for your website will help you meet this guideline.
See Also
- Bypass Blocks
- Multiple Ways
- Location
- Consistent Identification
- Understanding Success Criterion 3.2.3 (W3C)
Free Developer Resources
Join over 3,700 subscribers on my weekly web accessibility email and get free developer resources like WCAG Checklists and special offers.
Over 600 developers like you have learned more about the Web Content Accessibility Guidelines with my guidebook.
One of the biggest difficulties in this area is the result of responsive design. For perfectly good reasons, navigation is often presented quite differently to mobile/small screen users. Sometimes a horizontal list is made vertical, sometimes it becomes a dropdown selection, and sometimes just an icon to open up the full menu. It is a usability issue for everyone who accesses a particular website from different devices.
I certainly wouldn’t fail the checkpoint in an accessibility audit because of that, but of course there has to be some subjective assessment as well. If the mobile version of a website moved the main navigation from the header to the footer then that would be too inconsistent in my view.
I would always prefer that a responsive website let the user have control, so they can override things and see the desktop view if they prefer, or perhaps vice-versa and see the mobile view on the desktop. You only have to look at Gmail to see how frustrating things can get – when using it on an iPad, the desktop view isn’t directly available (there were/are ways of getting to it but it can mean scrolling all the way down to the bottom of the inbox).
Good points as usual Richard – one of the key points to get across is always taking a “common sense” approach to the guidelines, and not slavish worship of them. You’re quite right that with all the different devices people use, there has to be some thought in interpretation.
For me, it’s making sure that a single viewport (say, an iPhone) has a consistent navigation – which may be different to the website when viewed on a PC. Of course, within this is, as you say, not doing anything counter-intuitive like putting the main menu in the footer.