Best way to obfuscate an e-mail address on a websi

Question

I've spent the past few days working on updating my personal website. The URL of my personal website is (my first name).(my last name).com, as my last name is rather unusual, and I was lucky enough to pick up the domain name. My e-mail address is (my first name)@(my last name).com. So really, when it comes down to guessing it, it's not very hard.

Anyways, I want to integrate a mailto: link into my website, so people can contact me. And, despite my e-mail address not being very hard to guess, I'd rather not have it harvested by spam bots that just crawl websites for e-mail address patterns and add them to their database.

What is the best way for me to obfuscate my e-mail address, preferably in link form? The methods I know of are:

<a href="mailto:[e-mail]">e-mail me</a>

It works, but it also means that as soon as my website hits Google, I'll be wading through spam as spam bots easily pick out my e-mail address.

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

This is less desirable, because not only will visitors be unable to click on it to send me an e-mail, but smarter spam bots will probably be able to detect the characters that the image contains.

I know that there is probably no perfect solution, but I was just wondering what everyone thought was best. I'm definitely willing to use JavaScript if necessary, as my website already makes use of tons of it.

Answer 1

mine is actually simple:

<h3 id="email">[e-mail]</h3><!-- add a fake email -->


    $(document).ready(function(){
//my email in reverse :)
            var s = 'moc.elibomajninbew@htiek';
            var e = s.split("").reverse().join("");
            $('#email').html('<a href="mailto:'+e+'">'+e+'</a>');
    });

Answer 2

Apparently using CSS to change the direction of your text works pretty well. That link has a test of a bunch of other obfuscation methods as well.

Whatever you use is inevitably going to be defeated. Your primary aim should be to avoid annoying the heck out of your users.

Answer 3

I don't how well this would work. Could you not leave your email address out and make it load using an AJAX call once the page has finished loading. Not sure if spam bots can pick up the altered HTML or if they are clever enough to listen on other HTTP traffic to try and pick email addresses or if they just scan the page as it is received the first time.

Answer 4

One guy tested nine different ways of presenting an email address on a page and then published results on his blog.

His three best ways were:

1. Changing the code direction with CSS
2. Using CSS display:none
3. ROT13 Encryption

Caveat -- this was posted two years ago. Spam bots might've gotten smarter.

Answer 5

<!-- Multi-Email Obfuscator  -->
<!-- step 1: &#064; = @  -->
<!-- step 2: a scrap element  -->
<!-- step 3: ROT13 encode for .com  -->
info<!-- step 1 -->&#064;<!-- step 2 --><b style="display:none">my</b>domain<!-- step 3 --><script>document.write(".pbz".replace(/[a-zA-Z]/g,function(c){return String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26);}));</script>

Answer 6

One website I maintain uses a somewhat simplistic JavaScript means of (hopefully) keeping spambots out.

Email links call a JS function:

function sendEmail(name, domain) {
    location.href = 'mailto:' + name + '@' + domain;
}

To make sure only users who have JS enabled can see the link, write them out with this:

function writeEmailLink(realName, name, domain) {
    document.write('<a href="javascript:sendEmail(\''
      + name + '\', \'' + domain + '\')">');
    document.write(realName);
    document.write('</a>');
}   

The use of one JS function to write out a link that calls another means that there are two layers of protection.