Task

Use landmark elements to indicate important content regions

Category: 
Code
Check as complete

Landmark regions help communicate the layout and important areas of a page or view to assistive technologies and can allow quick access to these regions.

Set landmark elements to communicate layout and important areas

Allow for quick access to important areas in the Element Settings panel:

  • Use the <checks-richtext_code>nav<checks-richtext_code> element to wrap a site's navigation
  • Use the <checks-richtext_code>main<checks-richtext_code> element to contain the primary content of a page (also remember to give an ID of #main so that it can be accessed with the #skip-to-main link in the navigation)
  • Use the <checks-richtext_code>section<checks-richtext_code> element to have a clearer representation of how the page is divided
  • Use the <checks-richtext_code>aside<checks-richtext_code> element to contain sidebars
  • Use the <checks-richtext_code>footer<checks-richtext_code> element for the footer
Landmark tags can be set in the Tag dropdown in the Element Settings panel.

WCAG reference:

4.1.2 Name, role, value

Back to checklist

Total progress

Congratulations on making the web a more accessible place. Celebrate your work on Twitter.
Celebration horn and streamer emoji
0 / 0
Hide progress
Show progress