navigation

GUIDELINES 2.4, 3.2.3

Overview

Navigation refers to how your website and the content is laid out in order to make navigating, finding content, and determining where they are easy for the users. This guideline goes over how to create a page with this in mind, as well as gives insights on how, when. and why you would want your site to be navigable.

Who is impacted?

Users with visual impairments or cognitive limitations are primarily impacted. However, every user can ultimately be impacted by a poorly navigable website.

How to test?

Visit a page of your website and be able to see the proper order that the content should flow in, and understand how to get to specific pages from descriptive headings.

Bypass Blocks

 

Sometimes there are blocks of content that are repeated across multiple pages of a website. We would want to include a mechanism that allows the user to bypass said blocks so that they can get more direct access to the primary content on the web page.

Examples of a repeated block would include navigation links, heading graphics, and advertising frames.

 

 

Skip Links

 

There are pages that exist where users have to navigate a long list of navigation links before getting to the main content. It is important that we allow keyboard and screen reader users the ability to skip these links so that they aren’t required to go through each one before reaching the main content.

You would place a single link at or near the top of the page so that it is one of the first items that users can navigate to. Ensure that the words chosen for the link make it clear that the purpose of the link is for users to skip the navigation or skip to the main contents of the page.

 

 

Page Titled

 

All web pages on your website should have titles that describe either the topic or the purpose of that specific page. Titles help the user identify their current location without having to read or interpret the page’s content. This allows users to easily find content and orient themselves on the website.

 

 

Focus Order

 

Please read the section on our Focus page.

 

 

Link Purpose

 

Link text alone should be able to allow the user to understand the purpose of the link, except where the purpose of the link would be ambiguous to users in general. Users should be able to identify the purpose of the link without moving their focus. This gives the user the option to decide whether they want to follow the link or not.

The link text provided should not require any additional context for the user to understand where the link will take them. Having the link and the title of the page that the link goes be similar provides continuity for the user.

 

 

Multiple Ways

 

There should be more than a single way available to locate a web page within a set of web pages. The only situation where this would not be true is where the web page is the result of, or a step in, a process.

 

 

Headings and Labels

 

The descriptive headings and labels presented to a user do not need to be lengthy to describe a topic or purpose to them. This allows users to understand what information is contained on a specific web page and how that information is organized.

 

 

Focus Visible

 

Please read the section on the Focus page.

 

 

Location

 

The user should be able to recognize their location within a set of web pages. This gives the users a way to orient themselves on the page so that they are able to find the information that they are looking for.

 

 

Section Headings

 

Section headings are used to organize the content presented to the users. This helps to facilitate navigation within the content, as well as help with comprehension of the content.

Other page elements such as lines or boxes may be used to complement headings and improve the presentation.

 

 

Consistent Navigation

 

Navigational mechanisms that are repeated across a website on multiple web pages occur in the same relative order across all pages, unless a change is initiated by the user. In doing so, it allows for a consistent presentation and layout for the users, making it easier for them to locate information and functionality.

© 2023 - All For Web For All