Low-cost, effective, standards-compliant web design, development, online business and marketing consultation

From Elite by Design: a New premium WordPress theme, The Wall. Buy the Single Use Pack Now

Email Obfuscation

When displaying an e-mail address on a website you obviously want to obfuscate it to make it difficult (impossible?) for the email address to be harvested without your permission. The email address however needs to readable & usable by your human visitors - otherwise what's the point?

There are many methods available for email obfuscation. I have chosen one, CSS direction reversal, as my personal favourite. It's lightweight, supported by all modern browsers, easy to implement and deploy and effective.

Simply put, we create a CSS style that reverses the displayed direction of any text to which the style is applied. For an email address we add the REVERSED text to the web page and apply the custom style. When this page is viewed in a browser the visitor will see the email address in the usual, readable direction however any person, or harvester, who copies this email address text will only be able to copy the reversed text as it is coded into the page. Email harvesters do not process CSS rules.

Here's an example - try to copy & paste it:

gro.liamon@0-elpmaxe

One drawback with this method is that the email address cannot be linked using "mailto:". If you want to provide a linked email address you will have to use another method, such as that provided by Heal Your Church Web Site. This tool lets you create an obfuscated, linked email address.

Last Updated: Fri May 2010 11:47

Extra