This document is in beta. Help us by reporting issues via Github or email.
When content (like a header with navigation links) is repeated at the top of several pages, keyboard users should be able to bypass it and move the keyboard focus directly to the start of the main content area of the page.
On this page:
<main>
element is used to represent the main content area of the page.<main>
element has been used, but there is no skip link that points to it;This ensures that people who do not use a mouse can quickly and easily reach the primary content of the page.
2.4.1 Bypass Blocks: A mechanism is available to bypass blocks of content that are repeated on multiple Web pages. (Level A)
See the W3C’s detailed explanation of this guideline with techniques and examples.
a
element with the text “Skip to main content” is placed right at the start (or very near the start) of the page.a
element has an href
attribute pointing to the id
of the page’s main
element.:focus
.<body>
<a href="#main">Skip to main content</a>
<!-- header and navigation go here -->
<main id="main">
<h1>Main heading on the page</h1>
<p>This is the first paragraph of content on the page</p>
<!-- ... -->
</main>
<!-- ... -->
</body>
This document is in beta. Help us by reporting issues via Github or email.