Ocultar la dirección de correo electrónico de los bots - Mantener mailto:

Question 1

tl; dr

Oculte la dirección de correo electrónico de los bots sin utilizar scripts y mantenga la mailto:funcionalidad. El método también debe admitir lectores de pantalla.

Resumen

Ofuscación de correo electrónico sin utilizar scripts o formularios de contacto
La dirección de correo electrónico debe ser completamente visible para los espectadores humanos y mantener la mailto:funcionalidad.
La dirección de correo electrónico no debe tener formato de imagen .
La dirección de correo electrónico debe estar "completamente" oculta a los rastreadores de spam y los robots de spam y cualquier otro tipo de recolector

Efecto deseado:

Sin guiones , por favor. No se utilizan scripts en el proyecto y me gustaría mantenerlo así .
La dirección de correo electrónico se muestra en la página o se puede mostrar fácilmente después de algún tipo de interacción con el usuario, como abrir un modal.
El usuario puede hacer clic en la dirección de correo electrónico que a su vez activaría la mailto:funcionalidad.
Al hacer clic en el correo electrónico, se abrirá la aplicación de correo electrónico del usuario.

En otras palabras, la mailto:funcionalidad debe funcionar.
La dirección de correo electrónico no está visible o no está identificada como una dirección de correo electrónico para los bots (esto incluye la fuente de la página)
No tengo una bandeja de entrada llena de spam

Qué NO funciona

Agregar un formulario de contacto, o algo similar, en lugar de la dirección de correo electrónico

Odio los formularios de contacto . Rara vez completo un formulario de contacto. Si no hay una dirección de correo electrónico, busco un número de teléfono y, si no está, empiezo a buscar un servicio alternativo. Solo llenaría un formulario de contacto si fuera absolutamente necesario.
Reemplazo de la dirección con una imagen de la dirección

Esto crea una ENORME desventaja para alguien que usa un lector de pantalla ( recuerde a las personas con discapacidad visual en sus proyectos futuros )

También elimina la mailto:funcionalidad a menos que haga clic en la imagen y luego agregue la mailto:funcionalidad como hrefpara el enlace, pero eso anula el propósito y ahora el correo electrónico es visible para los bots.

Qué podría funcionar:

Uso inteligente de pseudo-elementsenCSS
Soluciones que utilizan la base64codificación
Romper la dirección de correo electrónico y distribuir las partes por el documento y luego volver a juntarlas en un modal cuando el usuario hace clic en un botón (esto probablemente involucrará varias CSSclases y el uso de anchor tags)
Modificar htmlatributos a través deCSS

@MortezaAsadi mencionó con gracia la posibilidad en los comentarios a continuación. Este es el enlace al completo - El artículo es de 2012:

¿Qué pasaría si pudiéramos utilizar CSS para modificar los atributos HTML?
Otras soluciones creativas que están más allá de mi alcance de conocimiento.

Preguntas / soluciones similares

JavaScript: Proteja su dirección de correo electrónico por Joe Maller

(Esta es una gran solución sugerida por Joe Maller, funciona bien pero se basa en un script . Así es como se ve;

<SCRIPT TYPE="text/javascript">

  emailE = 'emailserver.com'

  emailE = ('yourname' + '@' + emailE)

  document.write('<A href="mailto:' + emailE + '">' + emailE + '</a>')

</script>



<NOSCRIPT>

  Email address protected by JavaScript

</NOSCRIPT>

Expandir fragmento

Buscando una función de ofuscador de direcciones de correo electrónico solo en php

(Una solución inteligente que usa ambos PHPy CSSprimero revertir el correo electrónico usando PHP y luego revertirlo con CSS) ¡Una solución muy prometedora que funciona muy bien! Pero es demasiado fácil de resolver .
¿Vale la pena ocultar las direcciones de correo electrónico en la web en estos días?

(Corrección de Javascript)
¿La mejor forma de ocultar una dirección de correo electrónico en un sitio web?

La respuesta seleccionada funciona . De hecho, funciona muy bien. Implica codificar el correo electrónico como html entities. ¿Se puede mejorar?

Así es como se ve;
```
<A HREF="mailto:

&#121;&#111;&#117;&#114;&#110;&#097;&#109;&#101;&#064;&#100;&#111;&#109;&#097;&#105;&#110;&#046;&#099;&#111;&#109;">

&#121;&#111;&#117;&#114;&#110;&#097;&#109;&#101;&#064;&#100;&#111;&#109;&#097;&#105;&#110;&#046;&#099;&#111;&#109;

</A>
```
Expandir fragmento
¿Funciona realmente la ofuscación de la dirección de correo electrónico?

(La respuesta seleccionada a esta pregunta de superusuario es excelente y presenta un estudio de la cantidad de spam recibido mediante el uso de diferentes métodos de ofuscación.

Parece que manipular la dirección de correo electrónico CSSpara que rtlfuncione. Este es el mismo método utilizado en la primera pregunta a la que me vinculé en esta sección.

No estoy seguro de qué efectos mailto:tendría en los resultados agregar funcionalidad a la solución.
También hay muchas otras preguntas sobre SO que tienen respuestas similares. No he encontrado nada que se ajuste al efecto deseado.

La pregunta:

¿Sería posible aumentar la eficiencia (es decir, la menor cantidad de spam posible) de los métodos de ofuscación de correo electrónico anteriores combinando dos o más de las correcciones (o incluso agregando nuevas correcciones) mientras:

A- Mantener la mailto:funcionalidad; y

B- Lectores de pantalla compatibles

Editar:

Muchas de las respuestas y comentarios a continuación plantean una muy buena pregunta al tiempo que indican la imposibilidad de hacer esto sin algún tipo dejs

La pregunta que se hace / implícita es:

¿Por qué no usar js?

La respuesta es que soy alérgico a js

Sin embargo, bromeando a un lado,

Las tres razones principales por las que hice esta pregunta son:

Los formularios de contacto se aceptan cada vez más como un reemplazo para proporcionar una dirección de correo electrónico, lo que no debería.
Si se puede hacer sin secuencias de comandos, entonces debe hacerse sin secuencias de comandos.
Curiosidad: (ya que de hecho estoy usando una de las jscorrecciones actualmente) quería ver si discutir el asunto conduciría a una mejor manera de hacerlo.

Question 2

El problema con su solicitud es específicamente los "lectores de pantalla compatibles", ya que, por definición, los lectores de pantalla son un "bot" de algún tipo. Si un lector de pantalla necesita poder interpretar la dirección de correo electrónico, un rastreador de páginas también podría interpretarla.

Además, el objetivo del mailtoatributo es ser el estándar de cómo crear direcciones de correo electrónico en la web. Preguntar si hay una segunda forma de hacerlo es como preguntarse si existe un segundo estándar.

Hacerlo a través de scripts seguirá teniendo el mismo problema, ya que una vez que se cargó la página, el script se habría ejecutado y la dirección de correo electrónico se habría presentado en el DOM (a menos que complete la dirección de correo electrónico on clicko algo así). De cualquier manera, los lectores de pantalla seguirán teniendo problemas con esto, ya que aún no está cargado.

Honestamente, solo obtenga un servicio de correo electrónico con un filtro de spam medio decente y especifique una línea de asunto predeterminada que le sea fácil de ordenar en su bandeja de entrada.

<a href="mailto:no-one@no-where.com?subject=Something to filter on">Email me</a>

Lo que está preguntando es si el estándar tiene dos formas de hacer algo, una para bots y otra para no bots. La respuesta es que no, y tienes que luchar contra los bots lo mejor que puedas.

Question 3

Derrotar a los bots de correo electrónico es difícil. Es posible que desee consultar la sección de contramedidas de recolección de direcciones de correo electrónico en Wikipedia.

Mi historia de fondo es que escribí un robot de búsqueda. Rastreó más de 105,000 URL durante su ejecución inicial hace muchos años. De lo que he aprendido al hacer eso, los robots de rastreo web literalmente ven TODO lo que es texto, que aparece en una página web. Los bots leen todo menos imágenes.

El spam no se puede detener fácilmente mediante un código por estas razones:

CSS y JS son irrelevantes cuando se usa la etiqueta mailto:. Los bots buscan específicamente en las páginas HTML esa palabra clave "mailto:". Todo, desde los dos puntos hasta la siguiente comilla simple o doble (lo que ocurra primero) se considera una dirección de correo electrónico. Las direcciones de correo electrónico de entidades HTML, como el ejemplo anterior, se pueden traducir rápidamente utilizando un método / función ASCII inverso. Al ejecutar el fragmento de código JavaScript anterior, rápidamente convierte la cadena que comienza con: & # 121; & # 111; & # 117; & # 114; ... en ... "tudominio@dominio.com". (Mi robot de búsqueda descartó hrefs con mailto: direcciones de correo electrónico, ya que quería URL para páginas web y no direcciones de correo electrónico).
Si una página bloquea un bot, el autor del bot ajustará el bot para solucionar el bloqueo con esa página en mente, de modo que el bot no vuelva a bloquearse en esa página en el futuro. Haciendo así su bot más inteligente.
Los autores de bots pueden escribir bots, que generan todas las variaciones conocidas de direcciones de correo electrónico ... sin rastrear páginas y nunca usar direcciones de correo electrónico iniciales. Si bien puede que no sea factible hacer eso, no es inconcebible con las CPU de alto número de núcleos de hoy en día (que son hiperprocesadas y se ejecutan a más de 4 GHz), además de la disponibilidad de usar computación distribuida basada en la nube e incluso supercomputadoras. Es concebible que ahora alguien pueda crear una granja de robots para enviar spam a todos, sin conocer la dirección de correo electrónico de nadie. Hace 20 años, eso hubiera sido incomprensible.
Los proveedores de correo electrónico gratuito han tenido un historial de vender sus cuentas de usuario gratuitas a sus anunciantes. En el pasado, simplemente registrarse para obtener una cuenta de correo electrónico gratuita les garantizaba automáticamente la luz verde para comenzar a enviar spam a esa dirección de correo electrónico ... sin tener que usar esa dirección de correo electrónico en línea. Lo he visto suceder varias veces, con nombres de empresas famosas. (No mencionaré ningún nombre).
La palabra clave mailto: es parte de este RFC de IETF , donde los navegadores están construidos para iniciar automáticamente los clientes de correo electrónico predeterminados, a partir de enlaces con esa palabra clave en ellos. JavaScript debe utilizarse para interrumpir el proceso de inicio de la aplicación, cuando suceda.

No creo que sea posible detener el 100% del spam mientras se usan servidores de correo electrónico tradicionales, sin usar filtros en el servidor de correo electrónico y posiblemente usar imágenes.

Hay una alternativa ... También puede crear un cliente de correo electrónico similar al chat, que se ejecuta internamente en un sitio web. Sería como el cliente de chat de Facebook. Es "como un correo electrónico", pero no es un correo electrónico. Es simplemente mensajería instantánea 1 a 1 con una función de archivo ... que se carga automáticamente al iniciar sesión. Dado que tiene funciones de enlace de documento + adjunto, funciona como un correo electrónico ... pero sin el spam. Siempre que no cree una API de acceso externo, entonces es un sistema cerrado donde la gente no puede enviar spam.

Si planea seguir con el correo electrónico estrictamente tradicional, entonces su mejor opción puede ser ejecutar algo como SpamAssassin de Apache en el servidor de correo electrónico de una empresa.

También puede intentar combinar varias estrategias como las enumeró anteriormente, para que sea más difícil para los recolectores de correo electrónico obtener direcciones de correo electrónico de sus páginas web. No detendrán el 100% del spam, el 100% del tiempo ... y al mismo tiempo permitirán que el 100% de los lectores de pantalla trabajen para visitantes ciegos.

¡Ha creado una visión inicial realmente buena de lo que está mal con el correo electrónico tradicional! ¡Felicitaciones por eso!

Un buen lector de pantalla es JAWS de Freedom Scientific . Lo he usado antes para escuchar cómo los usuarios ciegos leen mis páginas web. (Si escuchas una voz masculina leyendo tanto acciones [como hacer clic en un enlace] como texto, prueba a cambiar 1 voz a femenina para que 1 voz lea acciones y otra lea texto. Eso hace que sea más fácil escuchar cómo se lee la página web los invidentes.)

¡Buena suerte con sus esfuerzos de contramedidas de recolección de direcciones de correo electrónico !

Question 4

Aquí hay un enfoque que hace uso de JavaScript, pero con una huella bastante pequeña. También es muy "ghetto", y generalmente no recomendaría un enfoque con JS en línea en el HTML, excepto que tenga una extrema renuencia a usar JS, en absoluto.

<a
  href="#"
  data-contact="bGUtZW1haWxAdGhlLWRvbWFpbi5jb20="
  data-subj="QW4gQW1hemluZyBTdWJqZWN0"
  onfocus="this.href = 'mailto:' + atob(this.dataset.contact) + '?subject=' + atob(this.dataset.subj || '')"
  >
  Send an email
</a>

Expandir fragmento

data-contactes la dirección de correo electrónico codificada en base64. Y data-subjes un sujeto codificado en base64 opcional.

El principal desafío de hacer esto sin JS es que CSS no puede alterar los atributos HTML. (El artículo que vinculó es una reflexión de "pastel en el cielo" y no tiene nada que ver con lo que es posible hoy o en el futuro cercano).

El enfoque de entidades HTML que mencionaste, o alguna variación del mismo, es probablemente la opción más simple que tendrá cierta eficacia. Además, el iframeenfoque es inteligente y el enfoque de redireccionamiento del servidor es bastante impresionante. Pero los tres son vulnerables a los bots:

Las entidades HTML solo necesitan ser convertidas (y detectar eso es simple)
El documento al que hace referencia el iframe simplemente podría seguirse
La redirección del servidor también se puede seguir simplemente

Con el enfoque descrito anteriormente, el uso de una dirección de correo electrónico codificada en base64 en un data-contactatributo es muy "único": siempre que el scrapper no esté diseñado específicamente para su sitio, debería funcionar.

Question 5

Simple + Mucho @ + Editable sin herramientas

<a href="mailto:user@domain@@com"
   onmouseover="this.href=this.href.replace('@@','.')">
   Send email
</a>

Expandir fragmento

Question 6

¿Ha considerado utilizar recaptcha mailhide de Google? https://www.google.com/recaptcha/admin#mailhide

La idea es que cuando un usuario hace clic en la casilla de verificación ( ver nocaptcha a continuación ), se muestra la dirección de correo electrónico completa.

Si bien recaptcha es tradicionalmente no solo difícil para los lectores de pantalla, sino también para los humanos, con el rol de nocaptcha recaptcha de Google, sobre el cual puede leer aquí en relación con las pruebas de accesibilidad. Parece ser prometedor con respecto a los lectores de pantalla, ya que se muestra como una casilla de verificación tradicional desde su vista.

Ejemplo n. ° 1: no es seguro, pero sirve para ilustrar fácilmente la idea

Aquí hay un código como ejemplo sin usar mailhide pero implementando algo usando recaptcha usted mismo: https://jsfiddle.net/43fad8pf/36/

<div class="container">
    <div id="recaptcha"></div>
</div>
<div id="email">
    Verify captcha to get e-mail
</div>

function createRecaptcha() {
    grecaptcha.render("recaptcha", {sitekey: "6LcgSAMTAAAAACc2C7rc6HB9ZmEX4SyB0bbAJvTG", theme: "light", callback: showEmail});
}
 createRecaptcha();

function showEmail() {
    // ideally you would do server side verification of the captcha and then the server would return the e-mail
  document.getElementById("email").innerHTML = "email@something.com";
}

Nota: En mi ejemplo, tengo el correo electrónico en una función de JavaScript. Idealmente, tendría el recaptcha validado en el servidor y devolvería el correo electrónico, de lo contrario, el bot simplemente puede obtenerlo en el código.

Ejemplo n. ° 2: validación del lado del servidor y devolución de correo electrónico

Si usamos un ejemplo más como este, obtenemos seguridad adicional: https://designracy.com/recaptcha-using-ajax-php-and-jquery/

function showEmail() {
    /* Check if the captcha is complete */
    if ($("#g-recaptcha-response").val()) {
        $.ajax({
            type: ‘POST’,
            url: "verify.php", // The file we’re making the request to
            dataType: ‘html’,
            async: true,
            data: {
                captchaResponse: $("#g-recaptcha-response").val() // The generated response from the widget sent as a POST parameter
        },
        success: function (data) {
            alert("everything looks ok. Here is where we would take 'data' which contains the e-mail and put it somewhere in the document");
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("You’re a bot");
        }
    });
} else {
    alert("Please fill the captcha!");
}
});

Donde verify.php es:

$captcha = filter_input(INPUT_POST, ‘captchaResponse’); // get the captchaResponse parameter sent from our ajax

/* Check if captcha is filled */
if (!$captcha) {
    http_response_code(401); // Return error code if there is no captcha
}
$response =     file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=YOUR-SECRET-KEY-HERE&amp;amp;response=" . $captcha);
if ($response . success == false) {
echo ‘SPAM’;
http_response_code(401); // It’s SPAM! RETURN SOME KIND OF ERROR
} else {
// Everything is ok, should output this in json or something better, but this is an example
    echo 'email@something.com'; 
}

Question 7

Las personas que escriben scrapers quieren que sus scrapers sean lo más eficientes posible. Por lo tanto, no descargarán estilos, scripts ni otros recursos externos. No hay ningún método que yo conozca para establecer un mailtoenlace usando CSS. Además, dijiste específicamente que no querías establecer el enlace usando Javascript.

Si piensa en qué otros tipos de recursos existen, también hay documentos externos (es decir, documentos HTML que utilizan iframes). Casi ningún raspador se molestaría en descargar el contenido de iframes. Por lo tanto, simplemente puede hacer:

index.html:

<iframe src="frame.html" style="height: 1em; width: 100%; border: 0;"></iframe>

frame.html:

My email is <a href="mailto:me@example.com" target="_top">me@example.com</a>

Para los usuarios humanos, el iframe se ve como un texto normal. Los iframes están en línea y son transparentes de forma predeterminada, por lo que solo necesitamos establecer su borde y dimensiones. No puede hacer que el tamaño del iframe coincida con el tamaño de su contenido sin utilizar Javascript, por lo que lo mejor que podemos hacer es darle dimensiones predefinidas.

Question 8

Primero, no creo que hacer nada con CSS funcione. Todos los bots (excepto el rastreador de Google) simplemente ignoran todos los estilos de los sitios web. Cualquier solución tiene que funcionar con JS o del lado del servidor.

Una solución del lado del servidor podría crear un <a>enlace a una nueva pestaña, que simplemente redirige a la deseadamailto :

Esas son todas mis ideas por ahora. Espero eso ayude.

Question 9

La respuesta corta para cumplir con todos sus requisitos es que es imposible

Algunas de las opciones basadas en secuencias de comandos que se responden aquí pueden funcionar para ciertos bots, pero usted no quería una secuencia de comandos, así que no puede.

Question 10

Solución PHP

function printEmail($email){
    $email = '<a href="mailto:'.$email.'">'.$email.'</a>';
    $a = str_split($email);
    return "<script>document.write('".implode("'+'",$a)."');</script>";
}

Utilizar

echo printEmail('test@gmail.com');

Resultado

<script>document.write('<'+'a'+' '+'h'+'r'+'e'+'f'+'='+'"'+'m'+'a'+'i'+'l'+'t'+'o'+':'+'t'+'e'+'s'+'t'+'@'+'g'+'m'+'a'+'i'+'l'+'.'+'c'+'o'+'m'+'"'+'>'+'t'+'e'+'s'+'t'+'@'+'g'+'m'+'a'+'i'+'l'+'.'+'c'+'o'+'m'+'<'+'/'+'a'+'>');</script>

Requisito de PS: el usuario debe tener habilitado JavaScript

Question 11

El único método que encontré efectivo es usarlo con css como se muestra a continuación:

<a href="mailto:myemail@ignore-domain.com">myemail@<span style="display:none;">ignore-</span>domain.com

y luego escriba un javascript para eliminar la ignoreme-palabra del href="mailto:..."atributo con regex. Esto ocultará el correo electrónico del bot, ya que agregará la ignore-palabra antes del dominio real y esto funcionará en el lector de pantalla y cuando el usuario haga clic en el enlace, la función js personalizada eliminará la ignore-palabra del hrefatributo para que se abra el correo electrónico real.

Este método me ha funcionado de manera muy eficaz hasta la fecha. puede leer más sobre esto: http://techblog.tilllate.com/2008/07/20/ten-methods-to-obfuscate-e-mail-addresses-compared/