Protecting visible and clickable website email addresses from spam
There are many methods for hiding email addresses from bots, while still making them visible to human site visitors. On a recent project, the client needed to
- display actual email address
- make them clickable with mailto link
- not get spam
I was inspired by two posts by Jeff Star at Perishable Press:
I implemented the “reverse the direction” approach to displaying the address, while implementing the “industrial strength” js approach for making them clickable. The latter script was written to accommodate a single instance on a page, but for my purposes, I needed it to function for 9 addresses on a single page.
The following dependencies were in place – Wordpress, Genesis Framework, Pods Framework – however, the same approach could be modified for use without Genesis or Pods.
There are 3 pieces – js to do the work, a PODS template to store the data, and css to display it properly. There is of course additional css to pretty everything up, this part is key to functionality.
At Little Studio Creative we help Milwaukee-area non-profits, individuals and small, privately held companies in manufacturing, outdoor sports and professional services to reach their potential customers with strategic messaging on any device they use. We design mobile-friendly websites that make you look good and produce human-story videos that will resonate with your audience. We work with clients anywhere, but we eswpcially love to work with our clients here at home in Milwaukee.