Réduire le spam des formulaires sans CAPTCHA

Ajoutez un champ piège à votre formulaire de contact HTML, combinez-le à la validation côté serveur et aux limites de débit, puis testez l’antispam sans bloquer les vrais visiteurs.

Par l’équipe mailcontact

Réduisez le spam sans imposer un CAPTCHA à chaque visiteur. Trois contrôles : champ piège pour certains robots, validation serveur et limites de débit pour freiner les répétitions. Chacun traite un problème différent. Aucun ne distingue avec certitude un client d’un spammeur qui écrit correctement.

Ce guide montre comment ajouter le champ piège HTML, les contrôles derrière le point de réception et les tests. Pour choisir comment recevoir les envois, commencez par le guide formulaires de contact pour sites statiques.

Ce que fait un champ piège

Un champ piège est un champ texte que les visiteurs normaux doivent laisser vide. Il est placé hors du formulaire visible et du parcours clavier habituel. Un robot qui remplit tous les champs peut aussi le remplir ; le serveur utilise alors cette valeur pour ignorer l’envoi.

Le champ caché seul ne fait rien. Le backend doit le reconnaître et le vérifier avant stockage ou notification. Avec mailcontact, le nom pris en charge est company_website. Une valeur non vide après suppression des espaces en début et fin amène le point de réception à renvoyer sa réponse de succès habituelle sans enregistrer de message. Cet envoi ignoré ne consomme pas votre quota mensuel.

Ajoutez un champ piège à votre formulaire de contact HTML

Pour l’intégration recommandée, chargez le script MailContact hébergé: il injecte le contrôle à l’initialisation et gère l’envoi ainsi que la vérification automatique. L’exemple manuel ci-dessous concerne les formulaires natifs et les intégrations directes à l’API.

Collez ceci dans le formulaire contenant déjà l’email et le message. Gardez une classe propre au formulaire pour éviter qu’un style sans rapport révèle accidentellement le champ.

honeypot.html
<!-- Add inside your existing contact form. -->
<div class="contact-meta" aria-hidden="true">
  <label for="contact-website">Website</label>
  <input id="contact-website" type="text" name="company_website"
    tabindex="-1" autocomplete="off" />
</div>

<style>
  .contact-meta {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
  }
</style>

Le CSS place le champ hors de la page visible. tabindex="-1" le retire de la navigation habituelle au clavier, et aria-hidden masque le conteneur aux technologies d’assistance. autocomplete="off" demande au navigateur de ne pas le remplir. Ne marquez pas ce champ comme obligatoire : un envoi légitime doit le laisser vide.

Ces attributs font partie de l’implémentation : testez-les. Remplissage automatique, gestionnaires de mots de passe et CSS peuvent interagir de façon inattendue. Si le piège se remplit lors d’une visite normale, le visiteur voit un succès alors que l’envoi est ignoré. Corrigez ce faux positif avant publication ; ce n’est pas la preuve d’un antispam efficace.

Incluez le champ piège pour les envois JavaScript

new FormData(form) inclut automatiquement le champ nommé. Si vous construisez le JSON à la main, incluez company_website avec les autres champs. Son absence renvoie une FORM_CHECK_MISSING erreur. Le script hébergé ajoute le champ automatiquement ; les formulaires SDK personnalisés peuvent appeler MailContact.prepare(form) une fois avant toute interaction. Notre formulaire de contact complet avec fetch utilise FormData et inclut ce champ.

Un contrôle uniquement dans le JavaScript du navigateur se contourne facilement en envoyant une requête directement au point de réception. La validation doit exister sur le serveur comme dans l’interface ; Guide de validation des formulaires de MDN explique pourquoi la validation du navigateur fournit un retour utile sans pouvoir garantir la sécurité.

Combinez le champ piège à la validation et aux limites de débit

Un champ piège détecte un comportement automatisé. Il ne limite ni la fréquence des appels à votre point de réception ni la quantité de données envoyées. mailcontact applique des contrôles supplémentaires à chaque requête de formulaire :

  • Champs obligatoires : une adresse email au format valide et un message non vide. Un format valide ne prouve pas que l’expéditeur possède cette adresse.
  • Limites des champs : jusqu’à 200 caractères pour le nom, 300 pour l’objet, 320 pour l’email et 5 000 pour le message.
  • Taille des requêtes : les corps de requête de plus de 64 Ko sont refusés.
  • Fréquence des requêtes : 20 requêtes de formulaire par minute et par IP, et une limite de 60 messages acceptés par minute et par boîte.

Les limites de débit sont distinctes des quotas. Free autorise 50 formulaires acceptés par période mensuelle et Pro 1 000 messages entrants sur le compte. Une requête invalide refusée ou un champ piège rempli ignoré ne consomme pas ce quota. Un spam qui passe les contrôles et est accepté compte. Voir la référence antispam pour les règles actuelles.

Testez le parcours visiteur et le champ piège

  1. Envoyez normalement : laissez le piège vide et envoyez un message avec votre vrai formulaire. Vérifiez son arrivée dans la boîte.
  2. Utilisez le clavier : parcourez la page au clavier et vérifiez que le champ caché n’est jamais sélectionné normalement.
  3. Testez le remplissage automatique : laissez le navigateur remplir les champs visibles, puis inspectez le champ piège. Il doit rester vide.
  4. Remplissez volontairement le piège : lors d’un test contrôlé, envoyez un company_website valeur. Le point de réception doit renvoyer un succès sans nouveau message ni notification.
  5. Supprimez le contrôle : l’envoi doit échouer avec FORM_CHECK_MISSING en conservant le brouillon.
  6. Testez une requête refusée : un message vide doit renvoyer une erreur de validation, et votre page doit conserver le texte saisi.

Testez aussi après un changement de générateur, CSS ou script d’envoi. Une refonte peut retirer le champ piège des données transmises alors qu’il existe encore dans la page. Vérifier uniquement l’apparence ne détecte pas cette régression.

Quand les spams passent encore

Un robot peut laisser le champ piège vide, utiliser des champs apparemment valides et envoyer assez lentement pour respecter les limites de débit. Un spammeur humain le peut aussi. MailContact combine également des scores d’analyse avec des contrôles de contenu locaux et une détection de campagnes par projet. Les messages suspects peuvent nécessiter une preuve de travail automatique ; les spams manifestes sont retenus dans les spams pendant 30 jours, sans notification ni consommation du quota. Le script hébergé gère la vérification et conserve les brouillons en échec. La preuve de travail augmente le coût de l’automatisation sans prouver qu’un visiteur est humain. Vérifiez les spams pour repérer les erreurs et restaurer les messages légitimes.

Gardez quelques exemples de messages indésirables et notez le projet qui les reçoit. Nous contacter avec ce contexte si les contrôles ne conviennent pas à votre trafic. Si des robots collectent un email public, c’est un autre sujet : le guide garder votre email personnel hors de votre site présente les moyens de contact disponibles.

Gardez votre formulaire simple pour les vrais visiteurs.

mailcontact réunit une boîte de projet, la validation des formulaires, les limites de débit et les champs pièges. Créez un compte.

Créer mon formulaire

Aucune carte bancaire requise. Free comprend un projet et 50 messages de formulaire par mois.