Inappropriate Banner Landmark Check

Description

The “Inappropriate Banner Landmark Check” evaluates whether the banner landmark is nested in another region’s landmark.

Example outcome

I noticed that the banner landmark is contained within other landmark.

Impact

• Visual Impairments: Screen reader users may not recognize or access the banner as expected. It could be skipped or misinterpreted.
• Motor Impairments: Improper structure can interrupt keyboard-only navigation, increasing the number of actions needed to reach site-wide navigation or branding.
• Cognitive Disabilities: Incorrect landmark nesting can lead to confusion and poor page comprehension.

Fixes

To address banner landmarks inappropriately contained within other landmarks:

1. Locate the inappropriately placed banner landmark.
2. Removing it from the other landmark region, and place it on top of the page.

Resources

• WCAG 2.2: Understanding Success Criteria 1.3.1
• WCAG 2.2: Understanding Success Criteria 2.4.1
• WCAG 2.2 Techniques: Technique ARIA11: Using ARIA landmarks to identify regions of a page
• WebAIM: Semantic Structure: Regions, Headings, and Lists