Stop Using mailto: for Forms! (Do This Instead)

If you learned HTML in the 90s or early 2000s, you might remember this pattern:

<!-- ❌ THE OLD WAY (DON'T DO THIS) -->
<form action="mailto:me@example.com" method="post" enctype="text/plain">
  <input type="text" name="name">
  <input type="submit" value="Send">
</form>

It seems like a great idea: a form that sends data directly to your email without needing a backend server.

But today, this is a terrible practice. Here is why you should stop doing it immediately.

Why action="mailto" Fails

1. It Exposes the User’s Email Client

When a user hits “Submit,” the browser tries to open their default email client (Outlook, Mail app, etc.).

• If they don’t have one configured (common on public computers or mobile), nothing happens.
• If they do, it pops up a scary warning window asking to send an email.

Technical note: The mailto: URI scheme was designed for simple hyperlinks, not form submission. See the HTML forms specification by W3C for recommended form submission methods.

2. No Success Message

Since the browser hands off the action to an external app, your website has no way of knowing if the email was actually sent. You can’t show a “Thank You” page or a success message.

3. Ugly Data Formatting

Even if it works, the data arrives in your inbox looking like this:

name=John+Doe&message=Hello+World&submit=Send

It’s raw, unreadable, and unprofessional.

4. Security and Spam Concerns

Exposing your email address directly in the form’s action attribute makes it easy for bots to harvest and spam you. Email harvesting is a significant problem for publicly-visible contact forms.

The Better Alternatives

If you need users to submit files or send attachments via a form, remember that mailto: links do not support attachments natively. Check out our Mailto with Attachment Guide to learn how to securely handle file uploads.

Option 1: The Simple Mailto Link (For Small Sites)

If you don’t have a backend, just use a regular link! It sets the right expectation: “I am clicking a link to send an email.”

<!-- ✅ BETTER -->
<a href="mailto:me@example.com?subject=Inquiry">Email Us</a>

This is honest UI. The user knows they are opening their email client.

Want to create a professional mailto link? Learn the proper syntax or use our generator to handle encoding automatically.

Option 2: Form Backend Services (For Static Sites)

If you want a real form look-and-feel but are hosting on a static site (like GitHub Pages or Netlify), use a form service:

• Formspree - Free tier available, handles spam filtering
• Netlify Forms - Built into Netlify hosting
• Getform - API-first form backend

These services give you a URL to put in your action attribute. They handle the email sending for you.

<!-- ✅ BEST FOR STATIC SITES -->
<form action="https://formspree.io/f/your-id" method="POST">
  <input type="email" name="email">
  <button type="submit">Send</button>
</form>

Option 3: Server-Side Processing (For Dynamic Sites)

If you’re running Node.js, PHP, or Python, handle form submissions server-side and use a proper SMTP library or email API service like SendGrid or AWS SES.

Conclusion

The action="mailto" pattern is a relic of the past. It provides a poor user experience and unreliable delivery.

• For simple contact needs: Use a styled mailto link.
• For actual data collection: Use a form backend service.

Need to generate a perfect mailto link for Option 1? Use our generator.

Related Resources:

• How to Add a Mailto Link in HTML - Proper mailto link guide
• Mailto Generators vs. Manual Coding - Time-saving comparison
• Browse All Articles
• Developer Resources