Coder Perfect

What’s the best technique to hide an e-mail address on a website?


I’ve been working on revamping my personal website for the past several days. My personal website’s address is (my first name). Because my last name is rare, I was fortunate enough to secure the domain name (my last name).com. (my first name)@(my last name).com is my e-mail address. So really, when it comes down to guessing it, it’s not very hard.

Anyway, I’d like to include a mailto: link on my website so that visitors can contact me. And, despite the fact that my e-mail address isn’t difficult to guess, I’d rather not have it gathered by spam bots that crawl websites looking for e-mail address patterns to add to their database.

What’s the ideal approach for me to hide my e-mail address, preferably in the form of a link? I’m familiar with the following methods:

<a href="">e-mail me</a>

It works, but it also means that as soon as my website is indexed by Google, I’ll be inundated with spam because spam bots can readily identify my e-mail address.

<img src="images/e-mail.png" />

This is less desired since not only will visitors be unable to click on it to send me an email, but sophisticated spam bots will almost certainly be able to discern the characters included within the image.

I understand that there is likely no perfect solution, but I was curious as to what everyone thought was the greatest option. I’m more than eager to employ JavaScript if it’s required, as my website already has a lot of it.

Asked by Adam Rezich

Solution #1

I use HTML entities to encode the characters (something like this). It doesn’t require JS to work and appears to have stopped the majority of spam. It’s possible that a clever bot may still harvest it, but I’ve never had any issues.

Answered by chroder

Solution #2

I’ve given up trying to hide my email address. It’s easier for me to research better spam-filtering techniques than it is to worry about obfuscation. You could spend days attempting to obfuscate your address, just to have one individual sell your address to a spammer, rendering all of your efforts meaningless.

Answered by Chad Birch

Solution #3

The current accepted solution is to create a contact form that allows users to email you. If you receive a lot of spam from that (I don’t on my site), then you can add a captcha for good measure, and you’ll be far from the “low hanging fruit” at that point.

The truth is that if you provide a link that a user can click to open their email client with your address in the To: field, the computer, as well as a spam bot, can discern the email address from the page.

Answered by JoshJordan

Solution #4

This is for your personal website, like you stated. I only have a paragraph on my personal website (for example, that says:

People appear to be able to figure it out just fine, since I regularly receive real email. The best solutions don’t always necessitate the use of code. 🙂

Answered by Bob Somers

Solution #5

Base64-encoding an anchor’s href is a quick and easy approach to disguise it:

> btoa('')
< "bWFpbHRvOmVtYWlsQGV4YW1wbGUuY29t"

Then include it as a hardcoded variable:

<a href="javascript:window.location.href=atob('bWFpbHRvOmVtYWlsQGV4YW1wbGUuY29t')">E-Mail</a>

Alternatively, dynamically on the server side, as in PHP:

<a href="javascript:window.location.href=atob('<?= base64_encode("") ?>')">E-Mail</a>

It could be quite spam-free when combined with string reversion:

<a href="javascript:window.location.href=atob('<?= base64_encode("") ?>')" style="unicode-bidi: bidi-override; direction: rtl;"><?= strrev("") ?></a>

Answered by Fabio Poloni

Post is based on