Navigation
Back to complex components
Navigations allow users to easily navigate through important pages of a website. There can be more than one navigation on each page, so its important to make the difference between them clear to the user.
WHEN I am navigating using a keyboard.
AND I tab into a navigation.
THEN The screen reader informs me this is a menu.
WHEN I am on a page with multiple navigations or navigation levels.
AND I tab into one of the navigations.
THEN the screen reader announces the label.
WHEN I am on a page.
AND it is a page linked in the menu.
THEN I expect to see an active state on that menu item indicating its the current page.
AND I tab into a navigation.
THEN The screen reader informs me this is a menu.
WHEN I am on a page with multiple navigations or navigation levels.
AND I tab into one of the navigations.
THEN the screen reader announces the label.
WHEN I am on a page.
AND it is a page linked in the menu.
THEN I expect to see an active state on that menu item indicating its the current page.
More Information
Navigation MUST meet the following:
- If repeated on multiple pages, navigational mechanisms must be in the same relative order each time they are repeated, unless a change is initiated by the user. [ WCAG 3.2.3 ]