Anchor: mailto MCQs Quiz | Class 10

Understanding mailto Links in HTML

The mailto attribute is a powerful feature in HTML that allows web developers to create hyperlinks which, when clicked, automatically open the user’s default email client (like Outlook, Gmail, Apple Mail, etc.) and pre-fill certain fields of a new email message. This simplifies the process for users who want to send an email directly from a webpage without having to manually copy an email address.

How mailto Links Work

A mailto link is essentially a special type of URL used within the href attribute of an anchor (<a>) tag. Instead of pointing to a web page, it points to an email address using the mailto: scheme.

<a href="mailto:info@example.com">Send us an email</a>

When a user clicks this link, their email client launches with a new message addressed to info@example.com.

Formatting mailto Links: Adding Subject, Body, CC, and BCC

Beyond just specifying the recipient, you can pre-fill other parts of an email, making it even more convenient for the user. This is done by adding query parameters to the mailto URL, similar to how parameters are added to regular web URLs. Each parameter is separated by an ampersand (&).

1. Subject (subject)

To add a default subject line, use the subject parameter:

<a href="mailto:info@example.com?subject=Inquiry%20from%20Website">Inquire Now</a>

Notice the %20. This is URL encoding for a space. It’s crucial to URL-encode special characters (like spaces, `&`, `?`, etc.) to ensure the link works correctly across all browsers and email clients.

2. Body (body)

To pre-fill the email’s body text, use the body parameter:

<a href="mailto:info@example.com?body=Dear%20Team%2C%0D%0AI%20would%20like%20to%20know%20more%20about...">Start a query</a>

Here, %0D%0A is URL encoding for a new line (carriage return and line feed), which helps format the pre-filled text.

3. Carbon Copy (cc)

To add recipients to the Carbon Copy (CC) field, use the cc parameter. You can specify multiple CC recipients by separating their email addresses with a comma:

<a href="mailto:info@example.com?cc=support@example.com%2Csales@example.com">Contact Support/Sales</a>

4. Blind Carbon Copy (bcc)

Similarly, for Blind Carbon Copy (BCC) recipients, use the bcc parameter. Multiple BCC recipients are also comma-separated:

<a href="mailto:info@example.com?bcc=hidden@example.com">Confidential Contact</a>

Combining Parameters

You can combine all these parameters in a single mailto link. Remember to use ? for the first parameter and & for subsequent ones:

<a href="mailto:main@example.com?subject=Website%20Feedback&body=I%20have%20some%20feedback...&cc=admin@example.com">Send Feedback</a>

Quick Revision

• mailto: links are used to initiate email messages directly from a web page.
• They use the href attribute of the <a> tag.
• Parameters like subject, body, cc, and bcc can pre-fill email fields.
• The first parameter starts with ?, subsequent ones with &.
• Always URL-encode special characters (spaces, newlines, etc.) in parameter values.

Practice Questions

1. Which HTML tag is used to create an email link?
   a) <email>
   b) <mail>
   c) <a>
   d) <link>
2. What is the correct scheme used in an email link’s href attribute?
   a) http:
   b) ftp:
   c) mailto:
   d) emailto:
3. Which parameter is used to add a subject line to a mailto link?
   a) title
   b) subject
   c) topic
   d) heading
4. How do you separate multiple email addresses in the cc field of a mailto link?
   a) Semicolon (;)
   b) Space (%20)
   c) Comma (%2C)
   d) Hyphen (-)
5. What does %20 represent in a URL-encoded mailto link?
   a) A comma
   b) A space
   c) A new line
   d) An ampersand