How to protect your email address on your website from spam

As a website operator you’re advised to include your email address on your website so that you can easily be contacted by visitors, but should you put your email address on your website? Sometimes it’s even mandatory if you do business within the EU or UK and this is because of the GDPR and UK GDPR. The problem with including your email address is that you could find yourself inundated with spam. So how do you protect your email address on your website from spam and still fulfill your obligations? We present the most popular methods and explain their advantages and disadvantages.

Email harvesting and how spambots stalk their prey

Email harvesting is the automated acquisition of email addresses for unfair advertising, phishing attacks, or spreading malicious software. Specialised programs (known as ‘email harvesters’) search websites, mailing lists, forums, or social media platforms for email addresses. They recognise email addresses due to their characteristic features such as the @ sign. More refined spambots can even search for alternative spellings website operators try to get away with such as [at], [AT], (at), (AT):

Even more revealing than the @ sign is the HTML email attribute mailto:user@domain.co.uk. This enables website visitors to open their preferred email program with a simple click. Website operators are therefore advised to steer clear of classic patterns when providing their email address.

Classic representation of the email address without being protected

In order to be able to protect an email address as much as possible before it is automatically read out by email harvesters, you have to envision how it is generally integrated into a web page. A simple, easily accessible email address can be inserted into any HTML page using the following code example:

<p>If you have any questions or suggestions, please write an email to: 
<a href="mailto:user@domain.co.uk">user@domain.co.uk</a>.
</p>

From the user’s point of view this is an ideal representation of an online email address. In order to keep the display user-friendly, the most popular method for protecting an email is to make it look unrecognisable in the source text without changing how it looks in the browser. Alternatively, it is possible to separate the email address from the actual website and forward it to the mailto link with a side-server redirect.

Method 1: CAPTCHAs

CAPTCHAs offer the possibility to protect email addresses on websites. In this process, encrypted email addresses are not displayed in plain text until users have proven that they’re human by passing a check. These checks ask the user to do a variety of tasks such as entering a combination of letters or numbers, quick maths problems, or puzzles.

CAPTCHAs offer a comparatively high level of protection against spam because email addresses are not displayed in the source code at all or only in encrypted form. CAPTCHAs can also fit well into your website’s design because there are so many different designs. The website’s user-friendliness is affected due to the user having to put in extra effort to access the email address and also means that the obligation to make important contact information accessible isn’t fulfilled.

Method 2: Replacing the email address

It is possible to remove the entire email address from the source code and replace it with either graphics or a redirect link to the mailto link.

Integrate email address as a graphic

If an email address is implemented as a graphic, it can still be read by the human eye, but texts written as graphics are hard for email harvesters to recognise. Including corresponding contact information as a graphic therefore protects email addresses on websites from spam. The HTML code would look like this:

<img src="Path/graphicfile.png" with="120" height="20" alt= If you have any questions or suggestions, please write an email to: user@domain.co.uk">

This email address is legible for most people. The text can neither be copied nor linked to a mailto link, which many users will find tedious to manually type in themselves. Text information in the form of a graphic is often not available for users with visual impairment. People with visual impairments can only read the address with the help of corresponding information in the alt attribute. These can be read out with the help of screen readers, but the downside is that they are also available to spambots so this method alone is not recommended as a preventative measure against spam.

HTML email link via redirect

You can protect your email address on your website from harvesters by separating it from the website. A script is generally used, which redirects users to the mailto link after the first click. This opens the user’s email program and displays the address. For spambots that scan the source code of a website, this link will look like a file link. This protection mechanism can, for example, be implemented as a link to a PHP file that contains the redirect:

<p>If you have any questions or suggestions, please write us an
<a href="redirect-mailto.php">email</a>.
</p>

The content of the redirect-mailto.php file is a script that redirects to the actual mailto link:

<?php
header("Location: mailto:user@domain.co.uk"); 
?>

The disadvantage of this spam prevention solution is that users need a handler for mailto: to get to the email address. In practice, this is usually an email program such as Outlook or Thunderbird. However, web mailers can also be entered as handlers in new browsers.

Method 3: Masking the email address

If you don’t want to completely replace an email address with a graphic or a mailto link, there are alternative strategies to encrypt an email address on a website.

Masking by character encoding

Common character encoding, used when masking email addresses in the source code, is based on HTML entities or HEX code. This type of encoding is suitable because the respective reference characters are automatically translated in the browser view.

If the characters of the email address user@domain.co.uk are masked using HTML entities, they are first written in the alternative style:

@ = @ . = . (period)

This results in the following source code:

<p>If you have any questions or suggestions, please write an email to: 
<a href="mailto:user&commat;domain&period;com">user&commat;domain&period;com</a>
</p>

If you want to encrypt the whole email address , you can use HEX encoding. The Unicode character number is used and is listed in the following basic schema:

&#characternumber;

Typically, the HEX number of the corresponding character is indicated by a small ‘x’. Thus the letter ‘m’ could be noted down as ‘m’ or decimal ‘m’. The email address user@domain.co.uk including the mailto link would look like this:

<p>If you have any questions or suggestions, please write an 
<a href="&#x6d;&#x61;&#x69;&#x6c;&#x74;&#x6f;&#x3a;&#x62;&#x65;&#x6e
;&#x75;&#x74;&#x7a;&#x65;&#x72;&#x40;&#x64;&#x6f;&#x6d;&#x61;&#x69;
&#x6e;&#x2e;&#x64;&#x65;">email</a>.
</p>

In principle, masking the email address can be done quickly and easily by character encoding. However, the protection offered is comparatively low since most spambots are now programmed to easily decipher this simple form of encryption.

Masking by adding characters

Basically, it is possible to hide email addresses from spambots by inserting additional characters into them. Programs will then hopefully not see the address as a whole and therefore it won’t be able to be read out automatically. HTML comments, for example, provide a simple way to do this.

<!-- Comment -->

If comments like these are added into the email address, spambots (who scan the website) will stumble across the following code:

<p>If you have any questions or suggestions, please write an email to:
u<!-- Comment -->ser@domai<!-- comment -->n.co.uk.
</p>

While a human user will see the correct email address in the web browser, a spambot is expected to read out the blended text in the span element.

A disadvantage of masking the address by adding extra characters is that with this method the email address can’t be linked with an HTML email link. In this case, users must manually copy the address into their email program.

Method 4: Encrypting the email address

A common method for email encryption is ROT13, which can be implemented with just a few lines of JavaScript.

<script type="text/javascript">
function decode(a) {
return a.replace(/[a-zA-Z]/g, function(c){
return String.fromCharCode((c <= "Z" ? 90 : 122) >= (c = c.charCodeAt(0) + 13) ? c : c - 26);
})
}; 
function openMailer(element) {
var y = decode("znvygb:orahgmre@qbznva.qr");
element.setAttribute("href", y);
element.setAttribute("onclick", "");
element.firstChild.nodeValue = "Open email software";
};
</script>
<a id="email" href=" " onclick='openMailer(this);'>Email: please click</a>

In line 9 of the sample code, it shows the encrypted version of the email address user@domain.co.uk including the mailto text string (znvygb:orahgmre@qbznva.qr) as well as how it should be encrypted (in lines 2 to 7). The function in lines 8 to 13 opens the user’s preferred email program and writes the decrypted address into the recipient field.

The script is started by clicking on the link with the anchor text ‘Email: please click’ (lines 15 to 16). After being clicked on, this displays the text ‘Open email software’ (line 12).