Ensure exactly one <main> landmark per page

WCAG 1.3.1
Info and Relationships

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

Multiple <main> elements confuse assistive technologies, as there should only be one main content area per page.

How to fix this issue

Use a single <main> or `role='main'` per document. Wrap your core content inside it.

Automated detection · Manual review recommended

Developer guidance

Avoid adding `role='main'` to unrelated containers like sidebars or modals.

Code examples

Incorrect Implementation

<main>Content</main><main>Sidebar</main>

Correct Implementation

<main>Content</main>
eu icon getwcag

Trusted by organizations across Europe working toward WCAG and EAA conformance