An email link opens the visitor's default email application with a message already addressed — using the mailto: URL scheme instead of a normal web address.
Syntax
<a href="mailto:hello@codingnowai.in">Email us</a>Basic Example
<p>Questions? <a href="mailto:support@codingnowai.in">support@codingnowai.in</a></p>Browser output: a normal-looking link; clicking it launches the user's configured email app (Outlook, Gmail app, Mail, etc.) with a new message already addressed to that address.
How It Works
The browser recognizes the mailto: scheme and hands the request off to whatever email application (or web-based mail handler) is registered on the visitor's device — HTML itself never sends the email; it just opens the compose window.
Important Attributes / Query Parameters
| Parameter | Purpose | Example |
|---|---|---|
subject | Pre-fills the subject line | ?subject=Course%20Inquiry |
body | Pre-fills the message body | ?body=Hi%20team%2C |
cc | Pre-fills a CC recipient | ?cc=team@codingnowai.in |
Multiple parameters are joined with &, and spaces/special characters must be URL-encoded (a space becomes %20).
Real-World Example
<a href="mailto:admissions@codingnowai.in?subject=Course%20Inquiry&body=Hi%2C%20I%27d%20like%20to%20know%20more%20about...">
Ask About a Course
</a>A pre-filled inquiry link on a course page — the visitor's email app opens with the subject and a starter message already in place.
Common Mistakes
- Forgetting to URL-encode spaces and special characters in
subject/bodyparameters, which can break the link on some email clients - Displaying a raw email address as plain text without a working
mailto:link, forcing users to manually copy and paste it - Publishing a raw email address anywhere it can be scraped by spam bots, without any obfuscation or contact-form alternative
Best Practices
- Use a real
mailto:link, not just visible plain text, so the address is one click away from an open compose window - For high-traffic public pages, consider a contact form instead of (or alongside) a visible
mailto:link to reduce spam harvesting
Accessibility Considerations
Make sure the link text clearly indicates it's an email link, especially if you style it to not show the raw address — "Email our admissions team" is clearer than an unlabeled icon alone.
SEO Considerations
No direct ranking effect from mailto: links.
Browser & Modern HTML Notes
Behavior depends entirely on what the visitor has configured as their default mail handler — on a device with no email client configured, clicking a mailto: link can appear to do nothing, which is worth keeping in mind for mobile-heavy audiences.
Mini Practice
- Build an email link with a pre-filled subject line.
- Add a
ccparameter to that same link.
