Skip to content

ARIA Landmarks

Semantic regions of a page (`<main>`, `<nav>`, `<aside>`, `<header>`, `<footer>`) that screen readers expose as a navigable list.

Landmarks are the page's structural regions: <header> (banner), <nav> (navigation), <main> (main content), <aside> (complementary), <footer> (contentinfo), and form elements like <form> and <search>. Each one's HTML element implies the corresponding ARIA role; screen-reader users press D (NVDA, JAWS) or VO+U (VoiceOver) to bring up a list of landmarks and jump directly to the section they want.

A page with proper landmarks is navigable in seconds; a page that's all <div> with classes is a wall of text. WCAG doesn't strictly require landmarks but Success Criterion 1.3.1 (Info and Relationships) effectively does -- the structural relationships need to be programmatically determinable.

Use exactly one <main> per page. Multiple <nav> is fine if each has a distinct aria-label ("Main navigation", "Footer navigation").

Related terms

Further reading

Send Feedback