Links and attributes

Fragments, email, and phone links

Link to a specific part of a page and create email or telephone actions with fragment, mailto, and tel destinations.

A fragment link points to an element in a document.

Give the destination an ID:

<h2 id="pricing">Pricing</h2>

Then link to it with #pricing:

<a href="#pricing">Skip to pricing</a>

The browser scrolls to the element and updates the URL. You can also add a fragment to another page:

<a href="/guide/#pricing">Read about pricing</a>

IDs must be unique so the browser knows which element to find.

The mailto: scheme opens the visitor’s configured email application:

<a href="mailto:[email protected]">Email us</a>

The tel: scheme offers to call a number on devices that support calls:

<a href="tel:+4532123456">Call +45 32 12 34 56</a>

These links trigger an action rather than navigating to an HTTP page. Make that action clear in the link text.

Quick check

Result

You got of right.

Lesson completed

Take this course offline

Get every free book, course edition, and software download.

Get the download library →