Hide Email Address from Bots - Keep mailto:

Advanced bot evasion methods

CSS pseudo-elements

Use CSS pseudo-elements to provide extra layers of deception against bots. Simple, yet effective:

.email::before {
  content: "user";
}
.email::after {
  content: "example.com";
}


In HTML:

<a href="#" class="email"></a>


JavaScript for mailto:

document.querySelector('.email').addEventListener('click', function() {
  window.location.href = "mailto:" + this::before.content + "@" + this::after.content; // pseudo-elements to the rescue!
});


Bypassing bots with PHP

A server-side script can safely handle email on the server side. Here's a PHP example:

// On user's request
if(isset($_GET['request_email'])) {
  echo "mailto:[email protected]"; // *sly smile* We've got what you asked for!
}


Accessibility meets safe emails

For accessibility, solutions that don’t rely solely on Javascript are essential. Use ARIA labels and ensure that email addresses are interpretative for screen-readers:

<span aria-label="user at example dot com">Contact me</span> 


Defeating spam at the source

Email filters and SpamAssassin on the server help nab spam before it invades your inbox. Combine this with a chat-like email client to further mitigate exposure:

// mailbox =📪, spam = 💣
Before: [📪💣] // Mailbox exposed to spam.
After:  [📪🛡️] // Mailbox defended with filters.

Armor your email address

The "picture" perfect solution

Consider using an email depicted as an image. Although less accessible to screen readers, this can serve as a quick fix:

<img src="email_address.png" alt="email address" />
// Don't worry. It's not a Picasso painting


Create an email labyrinth

Play hide and seek with bots using a dynamic replacement strategy for mailto: links:

var mailtoLink = "mailto:user@@example.com".replace('@@', '@');
// Bots: "@@?? Houston, we have a problem!"


Iframes and redirects: Oldies but goodies

Users where JavaScript is off can still have clickable email links without exposing the address directly:

<a href="/contact.php">Email me</a>
// "The butler will see you now."


Server handles mailto functionality and redirects, concealing the address throughout.