Navigation Links

A small navigation bar adds anchors to the page before the matching sections appear below it.

Program

Anchor elements define destinations. A nav element groups those destinations as page navigation rather than ordinary body text.

navigation_links.html

<nav aria-label="Sections">
  <a href="#overview">Overview</a>
  <a href="#steps">Steps</a>
</nav>
<main>
  <section id="overview">Overview content</section>
  <section id="steps">Step list</section>
</main>

anchor An anchor creates a link to another URL or to an element id on the same page.

aria-label An aria-label gives an accessible name to an otherwise unlabeled region.