Fix · Moderate · should fix soon
How to fix: missing skip-to-main-content link
Tab on every page goes through 20+ nav items before reaching content. A skip link bypasses repeated content. Visible on focus, hidden otherwise.
- WCAG references
- 2.4.1
- Severity
- Moderate
What it looks like in the wild
Tab on every page goes through 20+ nav items before reaching content.
The screen-reader user, keyboard user, or low-vision user encountering this issue does not get an error message. The page just stops working for them. Which is why this kind of bug rarely shows up in your error tracker; it shows up in support tickets, lawsuits, and abandoned conversions.
Why it fails WCAG
A skip link bypasses repeated content. Visible on focus, hidden otherwise.
Map this back to 2.4.1 when you log the bug. Auditors and procurement teams expect that mapping; "broken" is not enough context.
The wrong pattern (avoid)
<body><nav>... 20 items ...</nav><main>Content</main>The right pattern (copy this)
<body>
<a href="#main" class="skip-link">Skip to main content</a>
<nav>...</nav>
<main id="main" tabindex="-1">Content</main>
<style>
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 8px; top: 8px; background: #000; color: #fff; padding: 8px 12px; }
</style>Notes from real audits
Always make skip link visible on focus; never permanently hidden.
How to verify the fix
Shipping the change is not the same as passing 2.4.1. Re-run these checks against the page you edited before you close the ticket.
Press Tab on page load; the skip link should appear and work.
An automated scan confirms the machine-testable half. Keyboard and screen-reader passes cover the half no scanner can judge — do both before claiming conformance.
What 2.4.1 requires
2.4.1 Bypass Blocks (Level A, Operable): A mechanism is available to bypass blocks of content that are repeated on multiple pages. Without a skip link, keyboard users tab through the entire navigation on every page load.
No skip link
2.4.1Skip link visually hidden permanently (must appear on focus)
2.4.1
Priority: Moderate
This will not stop a user completing a task on its own, but it accumulates. A page carrying several moderate findings degrades into one that is technically usable and practically exhausting — and an auditor counts them individually.
Because the cause is almost always a shared component rather than a single page, fix it where the component is defined and re-scan the whole site. Record 2.4.1 on the ticket verbatim: that string is what an auditor, a procurement questionnaire or a regulator will search for.
Related fixes
How to fix: keyboard trap in modal or widget
2.1.2
How to fix: missing lang attribute on <html>
3.1.1
How to fix: empty links and image-only links
2.4.4, 4.1.2
How to fix: empty buttons / icon-only buttons
4.1.2
WCAG 2.4.1 — Bypass Blocks
A mechanism is available to bypass blocks of content that are repeated on multiple pages.
All fix recipes
Browse fixes by severity
Find every accessibility issue on your site in 60 seconds.
Free public scan. No card. AI-generated fixes for every issue we find.