Complementary landmarks and/or asides are top level

Rule ID: landmark-complementary-is-top-level
Ruleset: axe-core 3.5
User Impact: Moderate
WCAG: Best Practice

Learn Web Accessibility

Subscribe to our extensive curriculum of online self-paced courses

Compliance Data & Impact

User Impact

Moderate
Minor
Critical

Disabilities Affected

  • Sighted Keyboard Users
  • Blind
  • Deafblind
  • Mobility

Requirement(s)

  • Best Practice

WCAG Success Criteria

  • Not specified, or not applicable

Section 508 Guidelines

  • Not specified, or not applicable

How to Fix the Problem

This best practice rule ensures that aside elements or elements with role=complementary are not an internal part of another ARIA landmark. Nesting landmarks create confusing document structures. This rule is similar to existing rules that test this same ARIA requirement for the banner, contentinfo, and main roles.

Examples

The following example FAILS the Complementary landmarks are at the top level rule:

<main>
  <p>Some text</p>
  <aside><p>An aside</p></aside>
</main>

The following example PASSES the Complementary landmarks are at the top level rule:

<main><p>Some text</p></main>
<aside>An aside</aside>

Why it Matters

Complementary content is ancillary content to the main theme of a document or page. Screen reader users have the option to skip over complementary content when it appears at the top level of the accessibility API. Embedding an <aside> element in another landmark may disable screen reader functionality allowing users to navigate through complementary content.

Rule Description

Ensures the complementary landmark or aside is at top level

The Algorithm (in simple terms)

Do not include <aside> elements or elements containing role="complementary" within other content marked up as a landmark.

Resources

Other Resources

You may also want to check out these other resources.

Refer to the complete list of axe 3.5 rules.

Was this information helpful?

You have already given your feedback, thank you..

Your response was as follows:

Was this information helpful?
Date/Time feedback was submitted: