Correct Email Address Text Format For Website

I have to display my email address on my website and I'm using this format email[at]domain.com for anti-spam purposes, but one of my colleague told me to use this format instead em

Solution 1:

The correct way? Make it an URI (using the mailto URI scheme) and link it (using the a HTML element).

<a href="mailto:email@example.com">email@example.com</a>

The best way? Depends on your criteria.

If you want to make the life of your visitors (including humans as well as bots) easier, use a link.
If you want to make the life of your visitors (including humans as well as bots) harder, obfuscate the address.

"Harder" can also mean impossible, depending on the way how you obfuscate. Many blind users will not be able to access your email address if you post it as an image. Some users with intellectual disabilities will not be able to swap [at] with @. Users without copy-paste functionality might not be able to remember your address when switching applications and having to enter it manually. Users without JavaScript might not be able to access some clever widgets. And so on.

Solution 2:

There are several ways to show your email details. For advanced thought you could use QR Code also. In the question that you've asked has relevance that the usage of email in the format like wwxx@example.com is taking a risk like the spam bots catch it from the html DOM.

You could use some scripts like this to protect.

<span id="email">email[at]domain.com</span>
<!-- Please enter a valid email address -->

<SCRIPT TYPE="text/javascript">
    var emailE='emailserver.com'
    var emailE=('yourname' + '@' + emailE)
    var emailAttr = document.getElementById("email");
    document.getElementById("email").innerHTML ='<a href="mailto:' + emailE + '">' + emailE + '</a>';
     //-->
</script>

There are also some encoding techniques you could adapt.