Ensure Each Page Has at Least One Mechanism for a User to Bypass Navigation and Jump Straight to the Content
Each page on a website must have a main landmark to provide a way for users to bypass repeated blocks of content or interface elements (like headers and navigation), allowing them to arrive at the main content as quickly as possible.
Why It Matters
Keyboard-only users benefit from faster, more direct access to the primary content on any given web page.
Users who cannot use a mouse will find it more time-consuming to interact with websites that don’t cater to keyboard navigation, leading to a poor user experience.
Some users may even experience fatigue and physical pain when using a site that isn’t keyboard navigable.
Fixing the Issue
Ensure each page on a site has a main landmark, which is used to designate pre-defined parts of the layout such as the main content section. A page shouldn’t contain more than one main landmark.
Good Code Example
<header>
<div>This is the header.</div>
</header>
<nav>
<div>This is the navigation.</div>
</nav>
<main>
<div>This is the main content.</div>
<section>
<div>This is a section.</div>
</section>
<article>
<div>This is an article.</div>
</article>
<aside>
<div>This is an aside.</div>
</aside>
</main>
<footer>
<div>This is the footer.</div>
</footer>
Copy Test Cases
For more examples, visit the following pages in the W3C’s GitHub’s ATC Rules library: