Landmarks

Landmarks are a set of eight roles that identify the major sections of a page. Each landmark role enables assistive technology users to perceive the start and end of a feature of the high-level page structure that is usually conveyed visually with placement, spacing, color, or borders.

— Landmarks Pattern, WAI ARIA Authoring Practices Guide (APG)

Notes

Missing.css relies on the implicit landmark roles for HTML sectioning elements.

The <header> and <footer> elements are only given landmark roles when they are direct descendants of the <body> element. Note that in order for a <section> element to be an implicit landmark role, it must be given a valid aria-label or aria-labelledby attribute.

For best practices, please refer to the APG's Landmark Regions page.

Keyboard Interaction

Not applicable.

§ Example