Links & navigation

01A link needs a destination

The href attribute sets the destination. Use meaningful link text: “Read our services” tells people more than “Click here”.

<a href="services.html">Read our services</a>
<a href="https://dect.dev">Visit DECT</a>

02Jump to a section

Give a section a unique id, then link to it with # followed by that id. A link to another page can include a fragment too.

<a href="#contact">Contact details</a>
<section id="contact">
  <h2>Contact details</h2>
</section>

03Links versus buttons

Use a link to go somewhere. Use a button to perform an action, such as opening a menu. Do not use an anchor without href as a replacement for a button.

<nav aria-label="Main">
  <a href="index.html">Home</a>
  <a href="services.html">Services</a>
</nav>
<button type="button">Open menu</button>

04Try it yourself

Add a “Back to about” link under Contact.

Further reading

Use the MDN learning guides and HTML Living Standard for deeper explanations and current browser guidance.