Why this matters
Keyboard and screen reader users encounter the same navigation, header, and sidebar on every page. Without a way to skip these repeated blocks, they must tab through dozens of links before reaching the main content.
Common failures
These are the most frequent ways this criterion is violated in real-world websites:
- No skip navigation link at the top of the page
- Skip link exists but is permanently hidden (display:none) so screen readers can't use it
- Skip link target doesn't exist or points to the wrong element
- No landmark roles (main, nav, aside) for screen reader navigation
How to fix
- Add a skip link as the first focusable element: <a href='#main' class='skip-link'>Skip to content</a>
- Make the skip link visible on focus (CSS: .skip-link:focus { position: static; })
- Use HTML5 landmark elements: <main>, <nav>, <aside>, <header>, <footer>
- Ensure the skip link target has id='main' or matching value
Related axe-core rules
xsbl uses axe-core to automatically detect violations of this criterion. The following rules are checked:
Check your site for 2.4.1 violations
xsbl scans your rendered pages in a real browser and finds violations of this criterion automatically.
Scan your site freeOfficial reference: Understanding WCAG 2.4.1: Bypass Blocks (W3C)