Goal
Ensure that two or more landmark containers of the same type are labeled.
Why this matters
If there are two of the same section on the page (say, the main navigation and a local navigation), users of assistive technology (AT) should be able to tell them apart through the use of ARIA labels. Otherwise they both read out as the same thing (“navigation”), forcing the user to navigate into the section to figure out which one they’re on, and that’s frustrating.
How to implement
See Are all elements on the page contained in semantic HTML or landmark elements? for the list of semantic containers and how to implement them.
If the container has a visible text label, use the aria-labelledby attribute to point to that label.
If the container does not have a visible text label, use the aria-label attribute to add a unique label.
How to test
Right-click various sections of the page that use the same semantic containers and ensure that they have aria-label or aria-labelledby attributes as described in How to Implement.