Use skip links to let users:
- navigate quickly through links and form elements
- navigate your page when interacting only through the keyboard
- let users navigate directly to the main page content.
Skip links bypass the primary navigation links (the top horizontal menu items appearing on every page).
Until the user activates it through a keyboard press, a skip link won’t display.
When visible, it's always the first item on a page and pushes down all page content.
- It must be on every page.
- When visible, it must be the first element on the page.
- Only use at the top of the page.
- Don't edit the styling.
- Don't overlay page content. It must push down the page content.
The skip link uses the site’s focus state colour. This creates a seamless user experience. If we used a different colour, keyboard users would have colour changes between focusing on and interacting with a skip link. This could be jarring or confusing to users.