How to fix region on Webflow

Wrap all visible page content inside HTML landmark regions (e.g. `<header>`, `<main>`, `<nav>`, `<footer>`) so screen-reader users can navigate the page by section.

Steps for Webflow

  1. In the Webflow Designer, open the Navigator panel (the layers view) for the page you want to fix.
  2. Select the outermost wrapper for your site header. In the Element Settings panel (D key), change the HTML tag from 'div' to 'header'. If you have more than one nav, add a custom attribute: 'aria-label' → 'Main navigation' on the `<nav>` element.
  3. Select your main content area wrapper and change its tag to 'main'. Ensure there is only one `<main>` per page.
  4. Select your footer wrapper and change its tag to 'footer'.
  5. For any Section (`<section>`) elements, add a custom attribute 'aria-label' with a descriptive value (e.g., 'Featured products') in the Element Settings panel.
  6. Publish the site and verify with the axe DevTools extension. Repeat for any CMS-template pages by editing the Collection Template.
Official Webflow documentation ↗

What is region?

Landmark regions are special HTML tags — like `<header>`, `<main>`, `<nav>`, `<aside>`, and `<footer>` — that divide a page into named zones. Screen readers and assistive technologies use these zones as a navigation menu, letting users jump straight to the area they need (e.g. "skip to main content") instead of listening to every element. The WCAG "region" rule fails when any visible content sits outside of all these landmark zones — meaning a portion of your page is effectively invisible to screen-reader navigation.

Approximately 7 million Americans rely on screen readers, and "landmark navigation" is one of the primary ways they move through a web page. When content sits outside landmarks, those users cannot find or reach it at all — a direct barrier that can expose your store to accessibility lawsuits under the ADA (Title III) and similar laws in Canada, the UK, and the EU. Beyond legal risk, accessible stores convert better: removing navigation barriers keeps more users on the page and completing purchases. Google also uses page structure as a quality signal, so a well-structured landmark layout can reinforce your SEO.

See the complete Region guide for every platform and the full background.

Not sure if your Webflow store has this?

Run a free SEOLZ scan — we’ll find region and every other issue across your whole site.

Scan my site free

Fix region on another platform