Skip link

A skip link is used to skip repetitive content on a page. It is hidden by default and can be activated by hitting the "Tab" key after loading/refreshing a page.

To show the skip link, click this paragraph and hit the "Tab" key on your keyboard to show the skip link.

View a live version of this component and see how it can be customized.

<rh-skip-link>
  <a href="#main-content">Skip to main content</a>
</rh-skip-link>

<h1>Skip link</h1>
<p>To show the skip link, click the white background and press your tab key.</p>

<link rel="stylesheet" href="../rh-skip-link-lightdom-shim.css">
<script type="module">
  import '@rhds/elements/rh-skip-link/rh-skip-link.js';
</script>

• When there are many navigation items preceding main content
• When there are blocks of content that are repeated on multiple pages

Status checklist