Existen robots que rastrean páginas en busca de emails para hacerles spam. Vemos algunas técnicas para evitar que cacen nuestra dirección publicada en la web.
Cuando publicamos una dirección de correo en una página web debemos saber que no tardará mucho en ser rastreada e incorporada a bases de datos de emails para hacer spam. Es una auténtica paliza tener que recibir decenas o cientos de mensajes basura al cabo del día o la semana, así que merece la pena poner en marcha algún mecanismo para evitar que los spambots (robots en busca de direcciones de email) cacen nuestro correo electrónico.
Ahora vamos a mostrar otro mecanismo que hemos encontrado en una página web. En concreto, este artículo es una traducción libre de este otro artículo en inglés: Hiding email address from spambots, escrito por Lim Chee Aun.
En este caso vamos a mostrar un código que serviría para mostrar por CSS la dirección de correo electrónico. El email aparece en la hoja de estilos, nunca en el cuerpo de la página, por lo que el spambot lo va a tener muy difícil para obtener nuestro correo.
Se trata de utilizar unas características avanzadas de las hojas de estilo en cascada, que permiten definir cierto contenido, en este caso una dirección de correo electrónico, para colocar antes o después de un texto.
Concretamente vamos a utilizar CSS2 (hojas de estilo en cascada especificación 2), que incluye la definición de pseudo-elements (pseudo elementos) "before" y "after", que sirven para insertar contenidos antes y después de ciertos elementos.
En este caso, vamos a definir con CSS 2 la inclusión de un contenido después de una etiqueta HTML, en concreto la etiqueta <ADDRESS>, que sirve en principio para escribir una dirección en una página.
El código CSS sería el siguiente:
address:after{
/* \40 es un código para escribir el caracter '@' */
content: " <nombre\40 dominio.com>";
}
Nota: El carácter @ en hojas de estilo en cascada se puede escribir con el código especial \40. Ponemos un espacio después de \40 para que quede claro que el carácter especial llega hasta allí. Podéis probar a quitar el espacio y veréis como en ocasiones la @ se transforma en otro carácter, dependiendo de lo que se haya escrito después. Ese espacio en blanco no afecta al texto, es decir, no se verá en la página.
El código HTML que deberíamos escribir para mostrar la dirección de correo sería el siguiente:
Como se puede ver, en el código HTML no aparece la dirección de correo electrónico en ninguna parte, con lo que el spambot no se enterará de que allí se muestra un correo.
Atención los usuarios de Internet Explorer 6. Este navegador no soporta los pseudo-elementos after o before, con lo que este ejemplo no funcionará.
En nuestro ejemplo hemos incorporado la declaración de estilos en el mismo fichero HTML, pero tal vez sería más efectivo si colocásemos la declaración de estilos en un archivo externo, que luego incluiríamos con la etiqueta
en la cabecera de la página.
Conclusión
Hemos podido ver otra ingeniosa manera de ocultar la dirección de email. Sin embargo, cabe destacar que las características avanzadas de CSS2 no están soportadas por todos los navegadores.
En general, desventaja a destacar es que, con este código, la accesibilidad de la página disminuye considerablemente. Puesto que sólo ciertos navegadores mostrarán las direcciones de correo electrónico. Asimismo, esas direcciones no se podrán pinchar para enviar un correo electrónico directamente, es decir, no se pueden mostrar como enlaces. En Firefox, ni siquiera podemos seleccionar el texto de la dirección de correo, simplemente se nos permite verlo.
No obstante, es una nueva manera de mostrar un correo electrónico no accesible a programas de rastreo de emails. Hoy todavía no es una manera muy adecuada, pero tal vez lo será con el tiempo.
Lista de Códigos CSS 
