AccessibilityNavigation

‘Navigation’ describes all the ways a user can find their way around a page or a service, from top menus, to footers, to clear structure and headings.

Even if a user reaches your site through a search engine, they will usually rely on internal navigation to:

• find the exact content they’re looking for
• understand where they are within their journey

Helping everyone

Clear signposting makes the user’s journey through a service much smoother for everyone - and the more complicated a service is, the more important this is.

With multiple ways to navigate, users are free to choose the way that works best for them, whether this is through a standard navigation menu, a search option, or some of the built-in screen reader functions that help users find their way around a page.

The basics

Do:

• provide multiple navigation options where possible
• make sure all link text is clear
• be consistent with the navigation elements from page to page, both in terms of order and placement

Do not:

• assume that your users will all navigate the site in the same way

Creating good navigation

Multiple ways to navigate

Everyone has their own favourite method for navigating around a site. For example, some users prefer a search function, while others prefer navigation links, breadcrumbs or a site map. So, it’s important to provide at least two of these options to help users navigate your site in a way that’s most comfortable for them.

Be consistent

Users with some visual or cognitive issues can become very confused if your navigation looks different from one page to another. Keep your navigation elements in the same place across your site and use the same wording for navigation links (such as ‘Continue’ or ‘Next’).

Let users know where they are

A breadcrumb trail can help users orient themselves within a site and increase their confidence that they are accessing the right information.

For a linear journey, it’s good practice to show a step indicator or progress bar, so a user can gauge how far they are through the process. Make sure that this is also intelligible to screen readers – in the below example, the screen reader reads the list and announces ‘Current step’ for the step the user is on.

If your service has a linear journey that must be completed in a certain order, you don’t need to provide an extra navigation method to reach the later steps – though it’s still good practice to let users step backwards to review screens they’ve already completed.

Dynamic menu controls

Dropdown menus can sometimes be hard for users to navigate. If you need to use these, be careful that they can be opened and closed without a mouse (for example, they don’t only expand on mouse-hover, and you can access all the content or dismiss the menu with keyboard controls).

Never use navigation links that operate ‘on focus’ – keyboard-only users will tab through a list of links to find the one they need, and on-focus operation (which takes them to a new page at every tab stop) will prevent them from using your navigation altogether. The more content in your main navigation, the more important it is to include a skip link that lets users quickly move past it if they need to.