HTML Email Links (mailto)

Learn how to create clickable email links using the mailto: protocol in your HTML.

Creating Email Links

Want users to be able to email you with a single click? HTML has a special type of link for that using the `mailto:` protocol. Let's see how it works!

Syntax

To create a link that opens the user's default email client, use the mailto: prefix in the `href` attribute, followed by the email address.

Purpose

Email links provide a quick and direct way for users to contact you without having to copy an email address. They are commonly used on contact pages and in website footers.

Practice Zone


Interactive Test 1: Drag & Drop

Arrastra en el orden correspondiente.


Arrastra las opciones:

href="mailto:contact@example.com"
Contact Us</a>
<a>

Completa el código:

______
______
______

Interactive Test 2: Fill in the Blanks

Rellena los huecos en cada casilla.

<a href="">Send Email</a>

Practice Example: Code Editor

Create an email link to `support@company.com` with the link text "Email Support".

* Write the code below. Correct characters will be shown in green and incorrect ones in red.

<a href="mailto:support@company.com">Email Support</a>

Knowledge Check

What is the correct protocol for creating an email link in an `href` attribute?