A11y Lablearn by doing
0/20

Semantics · 03

Map the page with landmarks

A visual page frame needs structural regions that assistive technology can navigate.

What to do

  1. Use native header, nav, main, and footer elements.
  2. Keep exactly two navigation landmarks.
  3. Give the two nav elements distinct, non-empty aria-label values.
/index.html
Preview
updating…

Result

Run the checks

Edit the HTML and select “Check solution”. The preview updates automatically.

If you are stuck

A top-level header and footer map to banner and contentinfo. Repeated landmarks need unique names.

Read the exact rule or pattern

Exercise 3 of 20

axe-core

Automated audit