Email addresses in postings

Mon, 2014-05-19 09:10 by admin · Forum/category:

Never put real email addresses in web sites. The reason is that web email address harvesters will find them and use them to send spam to the address.

Here are two Javascript-based ways to obfuscate email addresses such that they remain clickable. In the Content Management System (CMS) Drupal, i.e. on this web site here, you have to change the input format to "Partly HTML" for any of the following methods to work. Only editors can do this. Non-editors have to resort to one of the simpler, but less elegant methods. Other CMS work differently, but the idea is the same.

The idea is that the actual email address does not appear anywhere until a user actually clicks on the similar-looking, but intentionally distorted address.

The distorted address should look sufficiently similar to the real address that even users who have Javascript disabled in their web browser can still manually reconstruct the correct address.

Of course you have to replace name and domain.com in the following examples with the actual email address. Please see the notes below for more details.

Method 1: Use a character other than @

Example using the copyright © character:

name©domain.com

Code to achieve this:

<a href="mailto:name©domain.com" onclick="var obfuscated = this.getAttribute('href'); if (obfuscated.indexOf('©') > 0) { this.href = obfuscated.split('©')[0] + '@' + obfuscated.split('©')[1]; }">name©domain.com</a>

Method 2: Insert an uncommon obfuscation string

Example using xxxremovexxx. Don't use RemoveThis or DeleteThis or upper case markers, as these may be recognized by address harvesters:

email

Code to achieve this:

<a href="mailto:namexxxremovexxx@domain.com" onclick="var obfuscated = this.getAttribute('href'); var obfuscatorString = 'xxxremovexxx'; if (obfuscated.indexOf(obfuscatorString) > 0) { this.href = obfuscated.split(obfuscatorString)[0] + obfuscated.split(obfuscatorString)[1]; }">email</a>

Notes:

  1. Of course you have to replace name and domain.com with your desired email address.
  2. The procedure requires Input format Partly HTML or Completely HTML. It does not work with Filtered HTML, because that filters out Javascript attributes.
  3. The entire <a …> tag must not contain any line break.
  4. After copying the example replace the email address with the real one and obfuscate it, i.e. replace the @ sign or insert the obfuscator string. The obfuscator string can be put anywhere in the email address on either side of the @ sign.
  5. In method 1, instead of the replacement character © you can use any other similar-looking character, such as: ® Ø ø ¤, or you can even use multi-character combinations, such as () or (a). Don't use anything with "at", because that is already too widely used and may be recognized automatically.
  6. The content of the <a ...> tag, i.e. the text before </a>, can be a readable, but obfuscated email address or simply any other text, like, "email". This is what the reader sees as the email link.
  7. After the reader clicked the link once, it will appear de-obfuscated during the rest of the user's session, i.e. the proper email address will appear.
  8. The few readers without functioning Javascript will get the obfuscated email address and will have to correct it by hand.

Technical background:

When the user clicks on the link, Javascript is activated through the onclick attribute. The little Javascript program takes the href attribute and removes or replaces the obfuscation. The important point is that the final, correct email address doesn't appear anywhere in the original page, not even in the Javascript code, because otherwise it could be found through email address harvesting.