Must haves
- The skip link is the first tab stop on the page
- TIP: the skip link can be visually hidden / positioned off-screen until someone tabs to it. Once the user tabs to it, it must become visible and have a clear indication of keyboard focus.
- The skip link serves to bypass blocks of content that are repeated across multiple site pages - this is usually the header content.
- The skip link targets the beginning of the unique page content (i.e., the page title (H1) or “main content”).
Learn more about skip links from WebAim
Skip Nav guidance from the Office of Digital Accessibility
Visual Example
Do and Don't
| Do | Don't |
|---|---|
<a href="#main-content">Skip to main content<a> … <main> … <div id="main-content"> <h1>Events</h1> … </div> … </main> | No skip link or the skip link is broken and does not target the start of the main content. |
