How to fix region on Shopify

Steps for Shopify

1. From your Shopify admin go to Online Store → Themes → (your active theme) → Actions → Edit code.
2. Open 'layout/theme.liquid' — this is the master shell for every page.
3. Locate the opening and closing of your page structure. Ensure the site header is wrapped in `<header role='banner'>` (or just `<header>`), the main content area uses `<main id='MainContent'>`, the footer uses `<footer role='contentinfo'>`, and any navigation uses `<nav aria-label='Main'>` (or similar).
4. Open any section files under 'sections/' (e.g. 'sections/announcement-bar.liquid', 'sections/header.liquid') and confirm their rendered output lands inside the correct landmark in theme.liquid.
5. For promotional banners or custom sections that render outside `<main>` or `<header>`, wrap their content with `<section aria-label='Promotion'>` inside the appropriate landmark.
6. Save changes and verify with the axe DevTools browser extension on your storefront.

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.