Whole page
Page landmarks are missing or share a name
WCAG 2.2 success criterion 1.3.1 Info and Relationships (Level A)
- WCAG 2.2
- 1.3.1 Info and Relationships
- Level
- A
- Default severity
- Needs review
- Available in
- Free
Updated for Lumtera 1.2.2 and Lumtera Pro 1.1.1.
Why does it matter?
Landmarks — header, main content, navigation, sidebar, footer — let screen reader users jump straight to a part of the page instead of listening from the top. That only works if the main content is marked once, and if landmarks of the same kind have different names: a list with three entries all called "navigation" does not say which is the main menu and which is the footer menu.
Who it affects: Keyboard, screen reader and low-vision users — every visitor meets the page title, language, landmarks, keyboard focus, target sizes and zoom settings on every page.
What does Lumtera flag?
Checked in review mode's Whole page tab, on the rendered page: no main landmark (no <main> element or role="main"), more than one main landmark, and two or more landmarks of the same kind (navigation, sidebar, header, footer, search, form or region) that share a name, or that have no name at all; one unnamed menu among named ones is not reported. Each is for review. Headers and footers inside an article, aside, main, nav or section are not counted as page landmarks, and sections and forms count only when they have a label.
Check IDs page-no-main, page-many-main, page-landmark-labels, as shown in review mode and saved results.
How do I fix it in WordPress?
The theme should wrap the page content in a single <main> element (or role="main"); accessibility-ready themes do this. If a page builder or plugin adds a second one, change the extra one to a <div> or <section>. Give each landmark of the same kind a short, different aria-label, for example "Main menu" and "Footer menu". In block themes, set it in the Navigation block's Advanced → ARIA label; in classic themes it is set in the theme's templates.
Example
<nav>…</nav>
<div class="content">…</div>
<footer><nav>…</nav></footer>
<nav aria-label="Main menu">…</nav>
<main id="main">…</main>
<footer><nav aria-label="Footer menu">…</nav></footer>
How do I check the fix?
- Reload the page in review mode and run the Whole page tab again. The finding disappears once the rendered page passes.
- Load the page and press Tab: a "Skip to content" link should appear first, and you should always see where focus is, even under a sticky header. Pinch-zoom on a phone, and check the browser tab shows a meaningful title.
Check your pages with Lumtera
This check is free. Open any post, choose Accessibility in the admin bar, then the Whole page tab: Lumtera checks the page as your browser renders it, theme, menus and footer included, one page at a time.
Related checks
-
WCAG 1.3.1 · AError
Heading is empty
-
WCAG 1.3.1 · ANeeds review
Heading level is skipped
-
WCAG 1.3.1 · ATip
Content uses an H1 heading
-
WCAG 1.3.1 · ATip
Bold text may be a heading
-
WCAG 1.3.1 · ATip
Heading is very long
-
WCAG 4.1.2 · AError
Form field has no label
Start with the free plugin today
All 69 content checks and 33 whole-page checks, fixes you approve with undo, and the site report — free, with no account and no page limits.