Comment protéger les adresses e-mail du spam sur un site Web ?

Réponses rédigées par Antoine
Dernière mise à jour : 2017-10-31 16:31:31
Thèmes : webmaster - spam - css - javascript - mail
Question

En tant que Webmaster, quelles solutions je dois adopter pour cache, crypter, et dissimuler une adresse mail et ainsi éviter le spam ?

Réponse

Lorsque une adresse mail est affichée "en clair" sur un site Web, il y a de grande chance que les robots spammeurs la détectent et l'enregistrent pour l'utiliser ultérieurement comme cible de spam.

Il existe plusieurs méthodes pour dissimuler et cacher l'adresse aux robots spammeurs, on parle d'obfuscation d'adresse e-mail.

Voici ce qui semble être les meilleures méthodes pour masquer les adresses e-mail affichées publiquement sur les pages Web.

Inverser la direction du texte

L'une des meilleures méthodes pour cacher votre adresse e-mail des spammeurs est de l'écrire à l'envers et ensuite inverser la direction du texte avec un peu de supercherie CSS. Disons que nous voulons afficher et obscurcir l'adresse email suivante:

Les e-mails ne sont pas autorisés

La supercherie consiste à écrire l'adresse e-mail à l'envers, et à l'entourer d'une balise avec un bel attribut de classe:

<span class="obfusc">moc.niamod@ybob</span> 

Ensuite, pour l'afficher correctement aux visiteurs, on applique la feuille de style CSS suivante:

.obfusc { unicode-bidi: bidi-override; direction: rtl; }

Cette méthode fonctionne avec quelques inconvénients:

  • L'utilisateur doit taper manuellement l'adresse (c'est-à-dire qu'un lien mailto: ne fonctionnera pas)
  • L'adresse e-mail s'affichera à l'envers si le CSS n'est pas disponible.
  • Des bots pourraient probablement "déchiffrer" ces chaînes facilement si ils sont programmés pour.

Malgré ces problèmes, la méthode du texte inversé s’avère très efficace.

Ajouter du texte "nul"

Un autre moyen efficace pour dissimuler et cacher une adresse mail consiste à insérer un texte fictif dans l'adresse e-mail elle-même. Par exemple, en utilisant notre adresse " Les e-mails ne sont pas autorisés" :

<span class="obfusc">boby@<span>null</span>domain.com</span> 

... ou même encore plus complexe :

<span class="obfusc"> boby<span>null</span>@<span>null</span>domain<span>null</span>.com </span> 

Avec ces chaînes de caractères injectées, le balisage ne ressemble en rien à une adresse e-mail réelle. Mais nous n'en avons pas encore fini : nous devons toujours nous assurer que nos utilisateurs humains sont capables de lire les informations correctement. Cela implique de cacher la supercherie avec un peu de CSS :

 .obfusc span { display: none; } 

Cette méthode fonctionne très bien parce que les utilisateurs ne verront que l'adresse e-mail et non le texte "nul". Cette méthode est efficace pour cacher votre adresse email des spammeurs, mais il y a aussi quelques inconvénients :

  • L'utilisateur doit taper manuellement l'adresse (c'est-à-dire qu'un lien mailto: ne fonctionnera pas)
  • L'adresse email affichera le texte "null" si CSS n'est pas disponible.
  • Lorsque l'utilisateur fait un copier / coller de l'adresse e-mail, il va inclure le texte "null".
  • Il y a peut-être un bot qui pourrait déchiffrer ces adresses e-mail alambiquées.

Encoder / Décoder avec ROT13 / JavaScript

L'algorithme ROT13 est une méthode de codage dans laquelle tous les caractères alphabétiques sont pivotés de 13. De même, ROT5 est utilisé pour chiffrer les chiffres, chaque chiffre étant incrémenté ou décrémenté de 5.

En utilisant ROT13, nous pouvons utiliser un outil en ligne (ou directement via PHP ) pour encoder une adresse e-mail, puis utiliser JavaScript pour la décoder sur la page Web. Encoder notre exemple d'adresse e-mail, on obtient ceci:

Les e-mails ne sont pas autorisés

On inclus ensuite cette adresse codée ROT13 dans la page Web en utilisant ce JavaScript :

<script type="text/javascript">
document.write("<n uers=\"znvygb:*Les e-mails ne sont pas autorisés*\" ery=\"absbyybj\">Raiblre ha zrffntr</n>".replace(/[a-zA-Z]/g, function(c){return String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26);})); 
</script> 

Cet extrait affichera ensuite le balisage suivant:

<a href="mailto:*Les e-mails ne sont pas autorisés*" rel="nofollow">Envoyer un message</a>

Le seul inconvénient de cette méthode est que JavaScript est nécessaire pour que cela fonctionne.

Autres méthodes pour cacher une adresse mail

  • Remplacer " @ " par " AT " et " . " Avec " DOT " dans les adresses e-mail en texte brut est très efficace (mais pas 100%).
  • Construire / insérer l'adresse e-mail entièrement avec JavaScript était il y a quelques années la meilleure méthode, mais certains robots ont désormais appris JavaScript !
  • Encodage " @ " et " . " Avec des caractères spéciaux.
  • Scinder l'adresse e-mail avec des commentaires HTML reste assez efficace.
  • Encoder l'adresse email avec urlencode était aussi très efficace mais désormais plus du tout. Les bots de collecte d'email ont apparemment compris et compromis urlencode.

Vous pouvez également utiliser une image pour afficher votre adresse e-mail, mais l'accessibilité et la facilité d'utilisation sont plutôt mauvaises, et il existe des robots qui peuvent détecter le texte basé sur l'image.

Utiliser un formulaire de contact

Quand il s'agit de fournir un moyen simple et sans spam pour les gens de vous contacter, rien ne vaut la commodité d'un simple formulaire électronique en PHP avec AJAX.

Bien sûr, le formulaire électronique a aussi ses inconvénients. Il faut plus de temps pour mettre en place et tester un formulaire en ligne que pour copier une ligne ou deux de code (comme dans nos exemples précédents).

Utilisez ce qui fonctionne

Si vous avez le temps, l'utilisation d'un formulaire de contact est probablement la meilleure solution pour les pages de contact, mais si vous avez simplement besoin d'une adresse e-mail, l'une de ces trois premières méthodes préalablement explicitées est votre meilleure alternative.

Réponse

Une autre solution avec JavaScript pour crypter une adresse mail:

La fonction qui effectue le job:

<script type="text/javascript">
function cryptm(m, o, n) {
   if (!document.write) return false;
   if (document.write) {
      var m; var o; var n;
      document.write('<p>Contact: <a href="' + 'mailto:' + m + '@' + o + '.' + n + '">' + m + '@' + o + '.' + n + '<\/a><\/p>');
   }
}
</script>

Le code JS à placer là où vous voulez afficher le lien de contact :

<script type="text/javascript">
cryptm("test", "doamin", "fr");
</script>