Hide Email Address from Bots - Keep mailto:

Question

tl;dr

Hide email address from bots without using scripts and maintain mailto: functionality. Method must also support screen-readers.

---

S

Answer 1

Here is an approach that does make use of JavaScript, but with a rather small foot-print. It's also very "ghetto", and generally I would not recommend an approach with inline JS in the HTML except you have an extreme reluctance to use JS, at all.

  Send an email

data-contact is the base64 encoded email address. And, data-subj is an optional base64 encoded subject.

The main challenge with doing this without JS is that CSS can't alter HTML attributes. (The article you linked is a "pie-in-the-sky" musing and does not have any bearing on what is possible today or in the near future.)

The HTML entities approach you mentioned, or some variation of it, is likely the simplest option that will have some efficacy. Additionally, the iframe approach is clever and the server redirect approach is pretty awesome. But, all three are vulnerable to bots:

• The HTML entities just need to be converted (and detecting that is simple)
• The document referenced by the iframe might simply be followed
• The server redirect might simply be followed, as well

With the approach outlined above, the use of a base64 encoded email address in a data-contact attribute is very "one-off" – as long as the scrapper is not specifically designed for your site, it should work.