Skip to main content

Add a main landmark

About 10 min

A <main> (or role="main") landmark marks the primary content for crawlers and assistive tech. Follow the steps below on your stack, then re-check the live URL.

A <main> (or role="main") landmark marks the primary content for crawlers and assistive tech.

We remember this on this browser so the next guide opens with the same CMS.

At a glance

Time~10 min
CategoryContent
Steps3
StacksWordPress, Shopify, Webflow, Next.js, HTML, more

Steps

  1. Wrap the primary page content in a single <main> element.

  2. Keep nav, header, and footer outside <main>.

  3. Don’t nest multiple <main> landmarks on one page.

In HTML / static

Keep a single <h1> and a logical h2→h3 outline.

Snippet
<header>…</header>
<main>
  <h1>Page topic</h1>
  <!-- primary content -->
</main>
<footer>…</footer>

FAQ

What does “Add a main landmark” fix?
A <main> (or role="main") landmark marks the primary content for crawlers and assistive tech.
How long does this usually take?
About 10 minutes on most CMS and code stacks when you already have access to edit the page.
Where do I start?
Start with: Wrap the primary page content in a single <main> element. Then use the platform picker on this page for placement notes.

Related guides