Definition All rendered content must be placed inside of container elements with appropriate ARIA landmark roles.
Purpose
  • Landmarks provide a way to organize the various types of content on a page for users of assistive technologies. The organization of content regions using landmarks is functionally similar to the way visual designers organize information for people who rely on a graphical rendering of the content.
  • When content is not contained in a landmark, it will be unreachable using landmark navigation, which is an important feature provided by assistive technologies such as screen readers.
Mappings
  • HTML5 and ARIA Techniques (Required)
WCAG 2.0 Success Criteria

1.3.1 Info and Relationships (Level A, Primary Success Criterion)

Rule Category Landmarks
Scope Element
Target Resources all rendered content
Techniques
  • Use the appropriate landmarks to identify the different regions of content on a web page.
  • The most important landmark roles are main and navigation, as nearly every page will include at least those regions.
  • Other commonly used landmark roles include banner, contentinfo, complementary and search.
  • Use HTML5 sectioning elements that have a default ARIA landmark role: main (main), nav (navigation), aside (complementary) and in some situations header (banner) and footer (contentinfo). When using these elements, the role attribute should NOT be defined.
  • In HTML4 and XHTML 1.0 documents, a landmark can be created using a div element with a role attribute and the appropriate ARIA landmark role value (e.g., role="main").
  • The search role is typically placed on a form element or a div that surrounds the search form.
Manual Checks
  • object, embed and applet tags may be used to render content. Use inspection tools to determine if any of these elements actually render content on the page.
Informational Links