Is it possible to prevent spambots from crawling all over my email address if I set it display: none? I had an idea for a little minigame if you will, where the user clicks the link for the email and it then displays one or two "are you sure you're not a bot" sort of questions. Once these have been answered, it then displayed the real link.
The issue is I'm assuming that bots can see the link because it's obviously there in the HTML even if it's not visible. Is there a way around this?
Also, I would want these questions to fade in, but as I understand it the CSS3 transitions don't support the display or visibility properties. Would I have to resort to jQuery? If so, could anyone direct me to alternative to fading in elements when switching from display: none to display: block?
No, display: none would not work.
The only real way around this is to not have it in your HTML whatsoever. Make it an image for example, or use JavaScript to descramble it into individual elements that can be placed absolutely (and individually) for a browser's human viewer to see correctly.
Note that if you go the image route, spambots can of course read images, so perhaps you should obfuscate it a little bit with some random images like the good old captchas.
With regards to CSS3 not supporting visibility/display, you'd be right, but you can use the opacity property to fade in the content of however you decide to display your email address. opacity is fully supported by CSS3 transitions.
Most crawlers analyse the markup of a page, not the visual rendered version. Using display: none will have very little effect.
Also, you don't need to use jQuery for fading effects. Setting the opacity and then using the following will work nicely:
-webkit-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
Instead of showing the e-mail address, you may want to implement a contact form. You can protect that form with a captcha or some honeypot approach. Also, you may render the form using Javascript, since many bots won't run Javascript (I hope).
