Skip to main content

landmark-unique

A distinctive role or a unique combination of role, label, or title (accessible name) must be possessed by each landmark element.

Severity: Moderate

Description

It is necessary to have multiple instances of landmarks with the same role possess distinctive, accessible names to ensure accessibility.

Why is it important?

Each landmark on a website must have a unique combination of accessible name or role. Landmarks serve to identify content regions on a webpage. In cases where a landmark lacks an explicitly defined accessible name, assistive technologies rely on its ARIA role for identification. However, when multiple landmarks of the same type (e.g., navigation or region landmarks) exist on a page, it becomes necessary to provide additional labeling using author-defined accessible names. It ensures that users can distinguish between them effectively.

How to fix?

Although you can define ARIA landmarks using the role attribute, certain HTML5 sectioning elements have predefined landmark roles by default. These include main, nav, aside, and, in some cases, header and footer. Consequently, it is important to assign a unique, accessible name to each of them when using multiple navigation elements on a page. Use the aria-label and aria-labelledby attributes to provide uniquely accessible names.

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback

Is this page helping you?

Yes
No

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback!

Talk to an Expert
Download Copy