Linking within a page in HTML

A fragment link jumps to whatever element carries that id.

<a class="skip" href="#main">Skip to content</a>

<nav aria-label="On this page">
  <ol>
    <li><a href="#install">Install</a></li>
    <li><a href="#usage">Usage</a></li>
  </ol>
</nav>

<main id="main">
  <h2 id="install">Install</h2>
  <p>Two commands and a coffee.</p>
  <h2 id="usage">Usage</h2>
  <p>One command.</p>
</main>

How it works

href="#id" scrolls to the element with that id.
href="#" alone goes to the top of the document.
A skip link is the first thing in the body and the first thing focused.

The run, in numbers

Lines: 15
Characters to type: 311
Tokens: 115
Three-star pace: 65 tpm

At the three-star pace of 65 tokens a minute, this run takes about 106 seconds.

Type this snippet

Step 4 of 7 in Links & images, step 19 of 28 in Document structure.

← Previous Next →