Aside should not be contained in another landmark

Accessibility isn’t only about avoiding violations — it’s about ensuring your product can be used confidently by everyone. This guide explains the principle of this rule, shows what goes wrong in real-world code, and provides a verified fix that meets WCAG and the European Accessibility Act (EAA).

Why this matters and how to fix it

Why this matters

Complementary landmarks identify supporting content (like sidebars). Nesting them inside other landmarks makes them difficult for screen readers to locate.

How to fix this issue

Ensure <aside> or role='complementary' appears at the top level next to <main>, not inside it.

Automated detection · Manual review recommended

Developer guidance

Complementary regions should be programmatically separate from main content. Screen reader users rely on unique landmark navigation.


Code examples

Incorrect Implementation

<main>
  <aside role='complementary'>Related links</aside>
</main>

Correct Implementation

<main>
  <article>Content</article>
</main>
<aside role='complementary'>Related links</aside>
eu icon getwcag

Trusted by organizations across Europe working toward WCAG and EAA conformance