Skip navigation is a styled link that appears at the top of a page when the Tab key is pressed. It bypasses the navigation and jumps users down to the main content when selected.
Skip to main content is a styled link that consists of a text label and a background container. Even though it looks like a Button, it functions more like a jump link.
A skip to main content link helps some users browse the web more effectively. It should be invisible on every page as a commitment to accessibility.
Don't apply the skip to main content link style to other components.
When a user presses the Tab key upon page load, the skip to main content link will appear centered at the top above the navigation. When a user presses the Enter key, the page will move down and the focus indicator should highlight the main content.
A skip to main content link uses space tokens to define spacing values between elements.
Related elements or patterns
To give feedback about anything on this page, contact us.