How to fix landmark one main on Webflow

Add a single `<main>` landmark element (or `role="main"`) to every page so that screen-reader users and assistive technologies can skip directly to the primary content.

Steps for Webflow

  1. Open your project in the Webflow Designer.
  2. In the Navigator panel, find the top-level `<div>` or `<Section>` that contains your page-unique content (below the Navbar component, above the Footer component).
  3. Click the element, then in the right-hand Settings panel (the gear icon) change the HTML Tag from `div` to `main`.
  4. Set the element ID to `main-content` (Settings panel → ID field) so a skip link can target it.
  5. Add a Text Link element as the very first child of `<body>` (before the Navbar): set its URL to `#main-content`, give it a class `skip-link`, and use Webflow's visibility settings (display: none / show on focus) to style it as a visually-hidden skip link.
  6. Publish and confirm with the axe browser extension.
Official Webflow documentation ↗
<main id="main-content" role="main">
  <!-- All unique page content goes here -->
</main>

<!-- Skip link (add just after <body> opens): -->
<a href="#main-content" class="skip-link">Skip to main content</a>

<style>
.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.skip-link:focus {
  position: static;
  width: auto;
  height: auto;
}
</style>

What is landmark one main?

Every web page should have one clearly marked "main content" region — the part of the page that is unique to that page, as opposed to the header, navigation, and footer that repeat everywhere. In HTML this is done with the `<main>` element (or by adding `role="main"` to a wrapper `<div>`). This marker is called a **landmark**. Screen readers and keyboard-only users rely on landmarks to jump around the page without having to tab through every single link and menu item first. The `landmark-one-main` rule fails when a page has zero `<main>` elements, or when it has more than one.

Without a main landmark, visually impaired shoppers using a screen reader (NVDA, JAWS, VoiceOver) cannot use the "skip to main content" shortcut — they are forced to listen to every navigation link on every page before reaching your products or checkout. This is a WCAG 2.1 Level A failure (Success Criterion 1.3.6 / ARIA Landmark Regions), meaning it carries legal accessibility risk in jurisdictions with web-accessibility laws (ADA, EN 301 549, EAA). Beyond compliance, a poor experience for assistive-technology users directly hurts conversions and brand trust. Fixing it is typically a one-line HTML change.

See the complete Landmark one main guide for every platform and the full background.

Not sure if your Webflow store has this?

Run a free SEOLZ audit — we’ll find landmark one main and every other issue across your whole site.

Scan my site free

Fix landmark one main on another platform