Software, your way.
burger menu icon
WillMaster

WillMaster > LibraryWebsite Email

FREE! Coding tips, tricks, and treasures.

Possibilities weekly ezine

Get the weekly email website developers read:

 

Your email address

name@example.com
YES! Send Possibilities every week!

Hide Email Address From Bots

Not much needs to be said about why it is a good idea to hide email addresses from spammer's harvesting robots.

The bots harvest to spam. Most people don't care for spam.

This article describes one way to hide email addresses from bots and still make them available on web pages — even as clickable links.

There is no need for me to ramble on. Let's get to it.

Overview

The idea is two-fold:

  1. Chop up and scramble the email address to make it unrecognizable as an address — so it won't be found by a bot scanning the source code.

  2. Require JavaScript to launch and run before the email address can be reconstructed — so it can be available to browsers but not to bots.

The Process

The JavaScript that does the work can be generated online or it can be created manually. Both methods are made available in this article.

When the JavaScript that does the work is in the web page source code, it can be called from anyplace on the web page where an address, plain or linked, needs to be published.

Use the WriteAddy() function to publish the email address on a web page. And use WriteLink() to publish the email address as a link.

Publishing an Email Address

To publish an email address so it's printed on the web page, use the WriteAddy() function. Example:

<p>
You can write to me 
at <script type="text/javascript">WriteAddy()</script> whenever 
you feel like it.
</p>

There are two ways to link an email address. When tapped, the link launches the user's integrated email software. Both ways use the WriteLink() function. Example:

<p>
Write me 
at <script type="text/javascript">WriteLink()</script> whenever 
you feel like it.
</p>

The above method publishes the email address and creates a link out of it. In other words, the email address itself is linked.

To link different text, specify the text as a parameter to the WriteLink() function. For example, WriteLink("Email Me!") links the words, "Email Me!":

<p>
<script type="text/javascript">WriteLink("Email Me!")</script>
</p>

Now, put the JavaScript that does the work of hiding your email address into your web page source code. Then you'll be good to go.

That's all it takes to use it.

Constructing the Code for Address Hiding

You may construct the email address hiding code manually or you can use the generator. Both methods are provided here, the generator first.

The JavaScript Code Generator

This generator can be used for quickly obtaining the email address hiding code. It can also be used to check your work after following the manual instructions.

Provide the generator with the email address to hide and then tap the button. The generated code will appear below the button.

Email Hiding JavaScript Generator

Put the generated JavaScript in your web page source code somewhere above where WriteAddy() or WriteLink() are first used. In the source code head area is fine.

Manually Creating the JavaScript Code

Here are the steps for creating the JavaScript manually. It's rather involved, but each step is easy. If you follow it all the way through, you'll have a better understanding of how the obfuscation works.

In these manual instructions, we'll use the fictitious my.name@the-isp.com email address as the example.

  1. Divide the email address into three parts.

    1. The first part is the characters up to the "@" character.

    2. The second part is composed of the characters following the "@" character up to the last "." character of the address.

    3. The third part is the characters following the last "." character of the address.

    Dividing the example my.name@the-isp.com email address, you'll end up with these three parts:

    my.name
    the-isp

    com

  2. Obfuscate each part.

    Now that the email address has been divided into three parts, we'll do an obfuscation on each part. The reason is so bots won't recognize them as parts of an email address or, if recognized, the part will be invalid.

    1. The first part, using my.name as an example:

      First, insert any three characters to the front of the first part of the email address. Example:

      ABCmy.name

      Then, divide it into two pieces. (It doesn't matter where this first part is divided, just so you end up with two pieces.) Example:

      ABCm
      y.name

    2. The second part, using the-isp as an example:

      First, separate the last two characters from the second part, ending up with two pieces. Example:

      the-i
      sp

      Then, reverse the characters of the second piece. Example:

      the-i
      ps

    3. The third part, using com as an example:

      Reverse the characters of the third piece. Example:

      moc

    When those steps are done to obfuscate each part of the example email address, you'll end up with

    ABCm
    y.name

    the-i
    ps

    moc

  3. Create the JavaScript:

    There are three lines of custom JavaScript. When those are constructed, use them to customize the JavaScript that does the work.

    1. Here is the first line.

      var front = "oneF" + "twoF";
      

      Replace oneF with the first piece of the first part of the email address (ABCm in the above example).

      Replace twoF with the second piece of the first part of the email address (y.name in the above example).

      With the example email address, you'll end up with:

      var front = "ABCm" + "y.name";
      
    2. Here is the second line:

      var middle = "oneM" + "twoM".split("").reverse().join("");
      

      Replace oneM with the first piece of the second part of the email address (the-i in the above example).

      Replace twoM with the second piece of the second part of the email address (ps in the above example).

      With the example email address, you'll end up with:

      var middle = "the-i" + "ps".split("").reverse().join("");
      
    3. Here is the third line:

      var end = "oneE".split("").reverse().join("");
      

      Replace oneE with the third part of the email address (moc in the above example).

      With the example email address, you'll end up with:

      var end = "moc".split("").reverse().join("");
      

    With the example email address, the three lines of custom JavaScript become:

    var front = "ABCm" + "y.name";
    var middle = "the-i" + "ps".split("").reverse().join("");
    var end = "moc".split("").reverse().join("");
    

    Those three custom lines of JavaScript are inserted into the JavaScript code that does the work. Here is the code, with the insertion point marked:

    <script type="text/javascript">
    function MakeAddy()
    {
       /* INSERT THE 3 CUSTOM LINES HERE */
       return(("me"+front+"@"+middle+"."+end).substr(5));
    }
    function WriteAddy() { document.write(MakeAddy()); }
    function WriteLink()
    {
       var addy = MakeAddy();
       var text = arguments.length ? arguments[0] : addy;
       document.write("<a href="+"otliam".split("").reverse().join("")+":"+addy+">"+text+"</a>");
    }
    </script>
    

    With the three custom lines you created above with the example email address, you end up with:

    <script type="text/javascript">
    function MakeAddy()
    {
       var front = "ABCm" + "y.name";
       var middle = "the-i" + "ps".split("").reverse().join("");
       var end = "moc".split("").reverse().join("");
       return(("me"+front+"@"+middle+"."+end).substr(5));
    }
    function WriteAddy() { document.write(MakeAddy()); }
    function WriteLink()
    {
       var addy = MakeAddy();
       var text = arguments.length ? arguments[0] : addy;
       document.write("<a href="+"otliam".split("").reverse().join("")+":"+addy+">"+text+"</a>");
    }
    </script>
    

Put the JavaScript in your web page somewhere above where WriteAddy() or WriteLink() are first used. In the source code head area is a good place.

Implementation Overview

Create the JavaScript, either manually or with the generator.

Use it as described in the The Process section.

You are now good to go.

It is highly unlikely that a spammers' email harvesting robot will recognize your code as an email address. And even if it does, it would still need to launch and run JavaScript to reconstruct the address.

(This article first appeared with an issue of the Possibilities newsletter.)

Will Bontrager

Was this article helpful to you?
(anonymous form)

Support This Website

Some of our support is from people like you who see the value of all that's offered for FREE at this website.

"Yes, let me contribute."

Amount (USD):

Tap to Choose
Contribution
Method

All information in WillMaster Library articles is presented AS-IS.

We only suggest and recommend what we believe is of value. As remuneration for the time and research involved to provide quality links, we generally use affiliate links when we can. Whenever we link to something not our own, you should assume they are affiliate links or that we benefit in some way.

How Can We Help You? balloons
How Can We Help You?
bullet Custom Programming
bullet Ready-Made Software
bullet Technical Support
bullet Possibilities Newsletter
bullet Website "How-To" Info
bullet Useful Information List

© 1998-2001 William and Mari Bontrager
© 2001-2011 Bontrager Connection, LLC
© 2011-2024 Will Bontrager Software LLC