I’m having trouble with mailto links on my website. Some of my visitors use Gmail as their default email client in Chrome. When they click a mailto link, it opens in the same tab and takes them away from my site. They don’t like this.
I tried adding target=“_blank” to the links. It works great for Gmail users, but it’s annoying for people who use other email clients like Outlook. They end up with a new blank tab every time they click a mailto link.
Is there a way to make this work well for everyone? I want Gmail users to have the link open in a new tab, but keep the normal behavior for other email clients. Can we detect what email client someone is using and adjust the link behavior accordingly?
Any ideas or solutions would be really helpful. I want to make sure all my visitors have a good experience on my site, no matter what email setup they’re using.
As someone who’s dealt with this exact problem, I can tell you there’s no perfect solution, unfortunately. The behavior of mailto links is largely dependent on the user’s browser and email client settings, which we can’t control.
One approach I’ve found somewhat effective is using a JavaScript-based email obfuscation technique. It replaces mailto links with a script that constructs the email address on click. This can help prevent the immediate redirect for Gmail users while still working for other clients.
Another option is to use a contact form instead of mailto links. This keeps users on your site and works consistently across all email setups. It does require more setup on your end, though.
Ultimately, it’s a trade-off between functionality and user experience. You might want to survey your users to see which solution they prefer.
I faced a similar issue on my own website a while back. After some trial and error, I found a decent workaround using JavaScript. Here’s what I did:
I added a script that checks if the user’s default email client is Gmail (by looking at the user agent string). If it is, the script modifies the mailto links to open in a new tab. For other email clients, it leaves the links as-is.
It’s not a perfect solution, as it doesn’t catch all Gmail users (like those using desktop clients), but it worked well enough for most of my visitors. The key is to do the check client-side, so you’re not relying on server-side detection.
One caveat: make sure to test thoroughly across different browsers and devices. I had a few hiccups with mobile browsers at first.
If you’re comfortable with JavaScript, give it a shot. If not, you might want to consider a plugin or ask a developer friend for help implementing this approach.