Seoxpert.io
highAccessibility

Pages Missing `<main>` Landmark

48 pages lack a <main> landmark, making primary content hard to access for screen-reader users.

By Seoxpert Editorial · Published

Why it matters

Without a <main> landmark, screen-reader users must navigate through all navigation and sidebars before reaching core content, reducing accessibility. This can lead to poor user experience for those using assistive technologies and may impact compliance with WCAG guidelines, which can indirectly affect SEO.

Impact

Leaving this unresolved makes your site less accessible and may lead to non-compliance with accessibility standards.

How it's detected

Automated crawlers scan each page's HTML for the presence of a <main> element or an element with role="main".

Common causes

  • Primary content is wrapped in a <div> or other non-semantic container instead of <main>.
  • Templates or layout files omit the <main> element.
  • Developers are unaware of the importance of landmark regions for accessibility.
  • Legacy code predates HTML5 semantic elements.

How to fix it

Identify the primary content section of each page and wrap it in a <main> element. If you cannot use <main>, add role="main" to the appropriate container. Update layout templates in your framework to include <main> around the main content area. Test with a screen reader to ensure correct navigation.

Code examples

Problem: No <main> landmark

<body>
  <nav>...</nav>
  <div>
    <!-- Primary content here, but not inside <main> -->
    <h1>Page Title</h1>
    <p>Welcome to our site.</p>
  </div>
</body>

Fix: Add <main> landmark

<body>
  <nav>...</nav>
  <main>
    <h1>Page Title</h1>
    <p>Welcome to our site.</p>
  </main>
</body>

Alternative Fix: Use role="main"

<body>
  <nav>...</nav>
  <div role="main">
    <h1>Page Title</h1>
    <p>Welcome to our site.</p>
  </div>
</body>

FAQ

Why is the <main> landmark important for accessibility?

It allows screen-reader users to quickly skip to the primary content, improving navigation and user experience.

Can I use role="main" instead of <main>?

Yes, but <main> is preferred for semantic clarity. Use role="main" only if you cannot use the <main> element.

Should there be more than one <main> landmark per page?

No, each page should have only one <main> landmark to avoid confusing assistive technologies.

Does adding <main> affect SEO rankings directly?

While not a direct ranking factor, improved accessibility can enhance user experience and indirectly benefit SEO.

Found this issue on your site?

Run a scan to see if Pages Missing `<main>` Landmark affects your pages.

Scan my website →