region low
All page content should be contained by landmarks
Content sits outside any landmark region, so screen-reader users can't jump to it via landmark navigation.
What you see
[region] All page content should be contained by landmarks Some page content is not contained by landmarks Failing element: <div class="content">…</div>
What’s actually happening
axe and Lighthouse flag region as a 'best-practice' (or moderate) issue, listing divs or stray text that live outside <main>, <nav>, <header>, <footer>, etc. Screen-reader users navigate by landmarks (VoiceOver rotor, NVDA's D key), and anything outside one is invisible to that shortcut — they have to read linearly to find it.
Common causes
- No <main> element on the page, so the primary content block isn't a landmark at all
- Loose text nodes, a cookie banner, a breadcrumb, or a back-to-top link dropped directly into <body> between the landmarks
- Everything wrapped in generic <div class="wrapper"> with no semantic landmark or role applied
- A layout that uses <header>/<footer> for the page chrome but leaves the article body in a plain div
- Third-party widgets (chat bubbles, ad slots) injecting top-level nodes outside your landmark structure
How to fix it
- Wrap the primary content in <main>Put the main content of the page inside a single <main> element (exactly one per page). This usually clears most of the rule in one move because the big orphaned content block is now a landmark. Use <nav>, <header>, <footer>, <aside> for the surrounding chrome.
- Find the specific orphans the audit namesaxe tells you the exact failing elements. Pull each one into the appropriate landmark, or if it's genuinely chrome that doesn't fit, give its container a role (role="region" with an aria-label, or role="complementary") so it counts as a landmark.
- Handle injected third-party nodesFor chat widgets or banners you can't move into the structure, wrap them in a labeled landmark (e.g. <div role="region" aria-label="Live chat">) or, if they're decorative/non-content, that's typically acceptable — the rule targets meaningful content sitting outside landmarks.
- Re-scan and check the landmark mapRe-run axe, and use a tool like the landmarks browser extension (or the accessibility tree in DevTools) to confirm every content block falls under a landmark and you have exactly one <main>.
Stop it recurring
Build page templates around semantic landmarks (one <main>, plus <nav>/<header>/<footer>) so content can't land outside a region by default.
Related errors