Landmarks

Accessibility Techniques for Landmarks
Topic Technique WCAG AA Requirement
Landmarks to Bypass Blocks of Content Bypass Blocks: Screen readers allow users to navigate by landmarks, so landmarks are an effective way to bypass blocks of content, as required by WCAG 2.4.1. Other methods may be used as well as — or instead of — landmarks, such as skip links, headings, expand/collapse regions, etc. Required
WCAG 2.4.1
Landmark Structural Organization Page Layout Groupings: Landmarks SHOULD be used to accurately designate pre-defined parts of the layout (e.g. the header, navigation, main content, and footer). Best Practice
Content Within Landmarks: All text SHOULD be contained within a landmark region. Best Practice
Landmark Names: Multiple instances of the same type of landmark SHOULD be distinguishable by different discernible names (using aria-label or aria-labelledby). Best Practice
Only One Instance of Some Landmarks: A page SHOULD NOT contain more than one instance of each of the following landmarks: header/banner, main, and footer/contentinfo. Best Practice

Limit the Number of Landmarks: The total number of landmarks SHOULD be minimized to the extent appropriate for the content.

Note: Having a large number of landmarks defeats the main purpose of landmarks, which is to make it easy to navigate quickly to sections of the layout.

Best Practice
Markup Markup: Landmarks MAY be designated with either HTML tags or their equivalent ARIA roles (e.g. <header> or role="banner", <nav> or role="navigation", <main> or role="main", <footer> or role="contentinfo", etc.). Best Practice