WCAG 2.1 · Level A · Operable

WCAG 2.4.1 — Bypass Blocks, explained with examples

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.

Number
2.4.1
Level
A
Principle
Operable
Guideline
2.4 Navigable

Why this criterion exists

Without a skip link, keyboard users tab through the entire navigation on every page load.

If you only remember one thing: a mechanism is available to bypass blocks of content that are repeated on multiple pages. Everything else on this page is detail.

Who feels it when this fails

Accessibility criteria sometimes feel abstract until you see who pays the cost when a site ignores them. Bypass Blocks affects:

  • Keyboard users

  • Screen reader users using landmarks

How sites typically fail it

These are the patterns we see week after week. None are intentional — they are accidents of how teams build interfaces under deadline. Knowing the failure modes is the fastest path to writing them out of your component library.

  • No skip link

  • Skip link visually hidden permanently (must appear on focus)

How to test for it

  • Press Tab on page load; the skip link should appear and work.

Automated scanners catch this criterion most of the time, but never all of the time. Manual testing with the keyboard and a screen reader closes the gap.

A code fix you can copy

Skip link appears on focus, jumps to main content, and main has tabindex="-1" so focus lands.

The problem

HTML
<body><nav>...</nav>

The fix

HTML
<body>
  <a href="#main" class="skip-link">Skip to main content</a>
  <nav>...</nav>
  <main id="main" tabindex="-1">...</main>

Skip link appears on focus, jumps to main content, and main has tabindex="-1" so focus lands.

Frequently asked questions

Can ARIA landmarks replace a skip link?

Landmarks (<main>, <nav>, <header>) allow screen reader users to jump between regions using shortcut keys. But keyboard-only users without a screen reader cannot use landmark navigation — they rely entirely on Tab order. A skip link is the only mechanism that works for both groups. ARIA landmarks supplement the skip link; they do not replace it.

Should the skip link be visible at all times?

No — a permanently visible skip link clutters the page for mouse users who do not need it. The standard pattern is visually-hidden by default (positioned off-screen) and revealed on focus via CSS. This gives keyboard users the benefit without visual noise. The skip link must be the first focusable element on the page so it is reachable from the very first Tab keypress.

Other Operable criteria

Find every accessibility issue on your site in 60 seconds.

Free public scan. No card. AI-generated fixes for every issue we find.