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

Brand Documentation Component Settings

Main content starts here

Quick checkChoose the best answer

Keyboard users Tab through a long navigation on every page before reaching content. What should be provided?

Automatically move everyone to main on page loadProvide a focusable Skip to main content link at page start that targets mainPermanently hide main so people do not pass navigation

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.

Skip Link≠Anchor

Skip Link is a keyboard shortcut available when entering a page. Anchor is an in-page table of contents that anyone can use.

When to use it

Long site header
Skip to main contentKeyboard users see this first after pressing Tab
Keyboard navigation
Skip to main contentKeyboard users see this first after pressing Tab
Pages with repeated controls
Skip to main contentKeyboard users see this first after pressing Tab

When NOT to use it

Hiding it from keyboard focus
Skip to main contentKeyboard users see this first after pressing Tab
Linking to a missing or unclear target
Skip to main contentKeyboard users see this first after pressing Tab
Using it to hide essential navigation
Skip to main contentKeyboard users see this first after pressing Tab

Anatomy

Repeat navigation

Main content

Placed before repeated navigation, usually as the first focusable link

The focus should fall here after the jump

Variants

Focus reveal

Common practices when pages need to skip repeated navigation

Visible top

When a skip link should remain visible instead of appearing only on focus

Typical use cases

Documentation page

Brand Product Price Login

Home page main content

Product site

Catalog Guide API Example

Document text

Long article

Project Members Settings Notifications

Project workspace

Want GPT or Codex?VibeHubGPT support

GPT-6 Astra

Build in 3D. Put your computer to work.