missing-landmark-region

Description

Content must be placed under the correct ARIA landmark regions, such as menu, contentinfo, or banner, to ensure proper navigation and structure for assistive technology users. Landmarks help users understand the layout and quickly navigate to key sections of a page.

The missing-landmark-region rule aligns with:

• WCAG Success Criterion 1.3.1 (Info and Relationships), which requires that information and relationships must be programmatically determinable.
• WCAG Success Criterion 2.4.1 (Bypass Blocks), which requires that a mechanism is available to bypass blocks of content that are repeated on multiple web pages.

Examples

In the following example, a navigation menu is not wrapped in a <nav> landmark or labeled with role="navigation", violating the missing-landmark-region rule.

In the following corrected example, the navigation menu is properly placed inside a <nav> landmark:

How to fix?

To fix violations of the missing-landmark-region rule:

1. Identify content that belongs in a landmark region (e.g., navigation, header, footer).
2. Wrap the content in the appropriate landmark element (<nav>, <header>, <footer>, etc.) or use ARIA roles (role="navigation", role="banner", etc.).
3. When two landmarks of the same type exist on a page, provide an accessible name to the common landmarks (using aria-label or aria-labelledby). If using the role="region", ensure that an accessible name is always provided.

Reference

• WCAG Success Criterion 1.3.1: Info and Relationships
• ARIA11: Using ARIA landmarks to identify regions