Skip Link
You might say
Keyboard users have to press Tab too many times to reach the main content. Can they jump there directly?
A link that lets keyboard users skip repeated navigation and move to the main contentA skip link appears when someone starts tabbing through a page and moves focus past repeated header links to the main content. It is not ordinary navigation, and it needs a visible focus state and a working target.
SkipLinkSkip to content
You can say this to an AI Agent
Add a Skip to main content link first in page order, visible on keyboard focus, targeting the single main region. Ensure the target can receive focus, for example with tabindex="-1" when needed. Press Enter from the link and confirm document.activeElement moves into main; it should not occupy layout during normal pointer browsing.
When to use it
- Long site headerSkip to main contentKeyboard users see this first after pressing Tab
- Keyboard navigationSkip to main contentKeyboard users see this first after pressing Tab
- Pages with repeated controlsSkip to main contentKeyboard users see this first after pressing Tab
When NOT to use it
- Hiding it from keyboard focusSkip to main contentKeyboard users see this first after pressing Tab
- Linking to a missing or unclear targetSkip to main contentKeyboard users see this first after pressing Tab
- Using it to hide essential navigationSkip to main contentKeyboard users see this first after pressing Tab
Anatomy
Placed before repeated navigation, usually as the first focusable link
The focus should fall here after the jump
Variants
Typical use cases
Documentation page
Product site
Long article
Recommended tool
Web fine-tuning tool · Selector Pro
Select page elements for precise AI edits
Click a button, text, or card, note the change, then copy its exact location to AI.
Open Selector Pro website↗Further reading
Quick check