Protecting Your Site’s eMail with ReCaptcha

My little e-mail hiding gadget seems to have garnered quite a bit of attention lately, so I figured I should make a post about it. Basically, this widget requires the end user to solve a CAPTCHA code, mainly to thwart spambots. Besides that, reCAPTCHA, is working with Google to help transcribe books! Nifty, isn’t it? Anyway, let’s get started!

First, you’re going to want to go to MailHide:

ReCAPTCHA Mailhide

The Mailhide website.

and enter your email address in the box. It’s going to come up with a bit of HTML code, like this, that you can paste directly into your website.

Hidden Email.

The source code for hiding our email address.

Hidden email address.

Our hidden email address.

Now, since my email address is only four letters, it seems a little problematic to show the first three and leave only the last letter hidden. I prefer to block out the entire first part of the email address, both for readability and security, so the code to actually go on my website would have the “rya” removed, leaving only the “< a href …” at the beginning. (By the way, you can chop off anything after the link, it’s totally fine!) and replaced with something like “Click for the address!” Here’s the result of that code (By the way, I replaced the three periods right before the end of the link with the clickable text):

Our modified email address.

Our modified email address.

And there you have it! Your own protected email address, courtesy of Google and ReCAPTCHA!

— Ryan Craig

~ by ryanwcraig on September 24, 2012.

%d bloggers like this: