← All terms
Glossary

ARIA landmark

ARIA landmarks are HTML5 semantic elements (`<header>`, `<nav>`, `<main>`, `<aside>`, `<footer>`, `<form>`) and their `role=` equivalents that map to navigable page regions for screen-reader users.

Also: ARIA landmarksAlso: HTML5 landmarksAlso: page region

Detailed explanation

Screen readers expose a "landmarks" navigation mode that lets users jump directly between regions of a page — header, navigation, main content, sidebar, footer — without traversing every interactive element. Proper landmark structure makes a page navigable in seconds rather than minutes.

HTML5 native elements (`<header>`, `<main>`, `<nav>`, etc.) implicitly map to ARIA landmark roles. Where native elements are unavailable or insufficient, explicit `role="banner"`, `role="navigation"`, `role="main"`, etc. work the same way. Pages should have exactly one `<main>`, exactly one `<header>` at the top level, and exactly one `<footer>`.

How this applies to Shopify stores

Themes that wrap everything in `<div>` lose the landmark structure entirely. AccessComply rewrites theme layouts to use `<header>`, `<nav>`, `<main>`, and `<footer>` correctly, with optional `aria-label` to disambiguate multiple navigations on the same page.

Primary source: w3.org