Best practice to hide/encrypt email adress in webpage

Question

I couldn't find a similar question, that's why here it is:

Whats the best way to hide or encrypt an email link in a website, so that a crawler can't read it, but the user can nevertheless click it?

I don't want to conufse the users by typing the email like this: john (at) mail.com or similar ways. (and i think this kind of links can nevertheless read by crawlers?)

I also tried things like that:

<script>// <![CDATA[eval(unescape('%76%61%72%20%73%3D%27%61%6D%6C%69%6F%74%72%3A%62%61%40%65%64%61%6E%6F%6C%2E%69%27%3B%76%61%72%20%72%3D%27%27%3B%66%6F%72%28%76%61%72%20%69%3D%30%3B%69%3C%73%2E%6C%65%6E%67%74%68%3B%69%2B%2B%2C%69%2B%2B%29%7B%72%3D%72%2B%73%2E%73%75%62%73%74%72%69%6E%67%28%69%2B%31%2C%69%2B%32%29%2B%73%2E%73%75%62%73%74%72%69%6E%67%28%69%2C%69%2B%31%29%7D%64%6F%63%75%6D%65%6E%74%2E%77%72%69%74%65%28%27%3C%61%20%68%72%65%66%3D%22%27%2B%72%2B%27%22%3E%4F%62%65%72%70%61%72%6C%65%69%74%65%72%3C%2F%61%3E%27%29%3B'))]]></script>

but i heard this can also be read by crawler and it isn't really good practices

are ther any common approaches?

Answer 1

You can try reCAPTCHA Mailhide too.

Answer 2

Not sure if it is a best practice, and it can be breaked easily but you can reverse the email address with CSS.

<p id="email">moc.liam@sirob</p>

#email {
    direction: rtl;
    unicode-bidi: bidi-override;"
}

will display: [email protected]