ARIA Landmark Region Patterns
Based on the W3C ARIA Authoring Practices for Landmark Regions

HTML Landmark Elements

It is important to understand that many HTML sectioning (e.g. main, nav, aside ...) elements by default define ARIA landmarks. If HTML sectioning elements are used without understanding the associated landmark structure, assistive technology users will most likely be confused and less efficient in accessing content and interacting with web pages.

Element Landmark Conditions
aside complementary
The aside element without a label is a complementary landmark when not a descendant of any of the following HTML sectioning elements:
  • article
  • aside
  • nav
  • section
The aside element with a label is a contentinfo landmark.
footer contentinfo The footer element is a contentinfo landmark when it is not a descendant of any of the following HTML sectioning elements:
  • article
  • aside
  • main
  • nav
  • section
form form
The form element is a form landmark when it has a label.
The recommended labeling technique is to use an aria-labelledby reference to a visible heading (e.g. an h2-h6) or legend element.
header banner The header element is a banner landmark when it is not a descendant of any of the following HTML sectioning elements:
  • article
  • aside
  • main
  • nav
  • section
main main The main element always defines a main landmark.
nav navigation The nav element always defines a navigation landmark.
search search The search element always defines a search landmark.
section region
The section element is a region landmark when it has a label.
The recommended labeling technique is to use an aria-labelledby reference to a visible heading (e.g. an h2-h6) element.