Make sure the user knows where they are

Example of a website with breadcrumbs and a selected tab
Image description: A website with breadcrumbs navigation that says, "Home > Park districts > Lovely Park > FAQ". FAQ is the current page. Below is navigation that says, "What is this? What is that? What is there?" The words “What is that?” are selected.

This page is in progress -

If you would like to contribute or make a case to prioritize this page, please fill out the form below.

Why This is Important

Informing people of where they are within a set of pages is accessible to those with cognitive and attention-related disorders.

Blind and visually impaired people use screen readers to interact with websites and apps. A screen reader is a type of assistive tech that converts things on screen to audio and/or braille. It's important that things are understandable and interactive to screen readers.

Keyboard accessibility is essential for people who do not use a computer mouse (which might be because they have unpredictable or very specific movement due to a motor disability). Many Blind and visually impaired people also use keyboard interactions in order to use their screen reader.

Error support is accessible to people with a diversity of disabilities. A cognitive disability might affect how a person perceives and understands things. A physical disability might lead to unpredictable movement. Other factors such as environment, stress, and multi-tasking may also lead to errors.

In order to be accessible, gestures and interactions must account for people with physical and motor disabilities, who might have unpredictable or very specific movement.

With the complexity of many websites and apps today, it can be easy to lose track of where you are, especially if you have a cognitive or attention-related disorder. Informing people of their location is like a “you are here” pin on a physical map - it lets people know where they are so that they know what they can do and where they can go from here.

This references WCAG criterion 2.4.8 Location (Level AAA).

Level AAA compliance is considered more difficult to meet because it requires more resources to fulfill. It also might encompass conflicting access needs (meaning what is accessible to some might be inaccessible to others). Use your best judgment of your target audience and your team's capabilities to determine if this is a pragmatic goal to reach.

How to Implement This

This is related to providing a unique page title and consistent navigation. There are a few different ways to add to those measures to provide an optimal accessible experience.

Draw Attention to the Selected Page

Out of a list of pages/tabs, you can use visual styling and ARIA labels to show which page is currently selected.

For example: 

Website with the "Space" tab selected.
Image description: A website with 4 tabs at the top: “Lace, Space, Mace, Race.” Space is selected and the page displays a large moon emoji and several star emojis scattered on a dark purple background.

Keep in mind that in order to be accessible to colorblind folks, you should not rely on color alone to signify that the “Space” tab is selected.

MDN Web Docs recommends the following ARIA labels for the tab role.

<button role="tab" aria-selected="true" aria-controls="tabpanel-id" id="space">Space</button>

Breadcrumbs trail

A breadcrumbs trail is a great way to show a page that is nested within other pages (kind of like a Russian Matryoshka doll).

For example:

Website with a breadcrumbs trail on the "Earth" page.
Image description: A website with a breadcrumbs trail at the top that displays 3 levels of pages, “Space, Milky Way, Earth.” We are on the Earth page, which displays a view of the earth and 3 stars.

A breadcrumbs trail is ideal for a page that is nested within 3 or more levels. If there’s only 2 levels, it’s not entirely necessary.

How to Test This

Manual Test
Semi-Automated Test
Automated Test
  • Interact with the website/app. Make note of any pages where it is unclear what the current page is.
  • To help prioritize, conduct user testing and make note of any areas where the user is confused about where they are.


No credits yet. But this could be you!
No items found.

Contribute and Give Feedback

If you would like to provide feedback or contribute content on this resource, please fill out the form below.

Thank you, your submission has been received!
Oops! Something went wrong while submitting the form. Please check your internet connection and try again.

If you continue to encounter issues, please reach out to alexyingchen(at)