Ensure Each Page Has at Least One Mechanism for a User to Bypass Navigation and Jump Straight to the Content

Yotam Flohr
Researcher
Blind Hearing
WCAG 2.1 Level A

Written and researched for humans by humans

Yotam Flohr
Researcher
Ritvik Shrivastava
Expertly reviewed by
Comments: 0
Your entire domain
Get detailed instructions on how to resolve every accessibility issue on your website

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

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