Champ e-mail
Collectez les adresses e-mail en toute confiance. Des formulaires de contact aux inscriptions avec confirmation en deux étapes, en passant par les restrictions de domaine et la saisie automatique du navigateur, le champ E-mail garantit une collecte précise grâce à une validation intégrée et une protection contre les fautes de frappe.
Collecte d'emails professionnelle avec validation intelligente
Parfait pour:
Des fonctionnalités puissantes pour chaque cas d'utilisation
✅ Champ de confirmation d'e-mail
Prévention des erreurs de saisie en double :
Ajoutez un second champ « Confirmer l’adresse e-mail » où les utilisateurs devront saisir à nouveau leur adresse e-mail. Cela évite les erreurs de frappe et garantit une collecte d’adresses e-mail précise.
Comment ça fonctionne
- Le champ d'adresse e-mail principale apparaît en premier.
- Le champ « Confirmer l’adresse e-mail » apparaît ci-dessous
- Le système valide que les deux entrées correspondent.
- Le retour visuel indique l'état de la correspondance (vert = correspondance, rouge = non-correspondance).
- Le formulaire ne sera pas soumis tant que les adresses e-mail ne correspondront pas.
Pourquoi utiliser la confirmation :
- Évite les fautes de frappe coûteuses ([email protected] vs gmail.com)
- Garantit la délivrabilité des courriels importants
- Réduit les taux de rebond
- Meilleures pratiques professionnelles pour les formulaires critiques
- Les utilisateurs repèrent leurs propres erreurs
Idéal pour :
- Inscription du compte (e-mails de réinitialisation du mot de passe)
- Confirmation de commande (reçu de livraison)
- Inscription à l'événement (courriels de confirmation de billetterie)
- Notifications de paiement
- Toute forme où l'exactitude des adresses électroniques est essentielle
Expérience utilisateur:
Validation en temps réel avec retour d'information par code couleur. Les utilisateurs voient immédiatement si les adresses e-mail correspondent, sans attendre la soumission du formulaire.
🏢 Restriction de domaine
Liste blanche des domaines de messagerie spécifiques :
Activez l’option « Restreindre les domaines de messagerie autorisés » pour n’accepter que les e-mails provenant de domaines spécifiques. Idéal pour les formulaires réservés aux entreprises, les inscriptions privées ou l’accès contrôlé.
Comment ça fonctionne
- Saisissez les domaines autorisés (un par ligne)
- Le système valide le domaine de l'adresse e-mail lors de sa soumission.
- Seuls les domaines correspondants sont acceptés.
- Messages d'erreur clairs pour les domaines rejetés
Cas d'utilisation courants :
Adresse électronique professionnelle uniquement :
N’autorisez que les adresses e-mail `@votreentreprise.com` pour les formulaires internes, les enquêtes auprès des employés ou les inscriptions du personnel.
Établissement d'enseignement :
Limiter l'accès à `@university.edu` aux formulaires réservés aux étudiants, aux enquêtes sur le campus ou aux inscriptions universitaires.
Partenaires multiples :
Autoriser plusieurs domaines comme `company1.com`, `company2.com`, `partner3.com` pour les portails partenaires ou les formulaires B2B.
Organisations vérifiées :
Autoriser certaines organisations à accéder à du contenu réservé aux membres, à des offres exclusives ou à un accès vérifié.
Exemples :
- Commentaires des employés : uniquement sur `votreentreprise.com`
- Portail étudiant : `school.edu`, `university.edu`
- Inscription des partenaires : `partner1.com, partner2.com, partner3.com`
- Accès des membres : `org1.org, org2.org, nonprofit.org`
Avantages:
- Garantit la légitimité des soumissions
- Empêche tout accès non autorisé
- Valide l'affiliation organisationnelle
- Réduit le spam provenant des courriels publics
- Contrôle l'accès aux formulaires restreints
🔄 Saisie semi-automatique du navigateur
Saisie plus rapide des e-mails :
Activez l’option « Autoriser les suggestions du navigateur » pour permettre aux navigateurs de suggérer des adresses e-mail précédemment utilisées. Les utilisateurs pourront ainsi sélectionner une adresse e-mail enregistrée en un seul clic.
Comment ça fonctionne
Le navigateur reconnaît le champ e-mail
Suggère des adresses e-mail enregistrées
L'utilisateur clique sur la suggestion pour le remplissage automatique.
Remplissage instantané du formulaire
Avantages :
Remplissage de formulaire plus rapide (1 clic au lieu de la saisie)
Réduit les fautes de frappe (pas de saisie manuelle)
Améliore l'expérience utilisateur
Des taux d'achèvement plus élevés
Particulièrement utile sur mobile
Respectueux de la vie privée :
Les utilisateurs contrôlent les données enregistrées par leur navigateur. La saisie automatique respecte les paramètres de confidentialité du navigateur et les préférences de l'utilisateur.
Quand activer :
Formulaires de contact (visiteurs réguliers)
Inscriptions à la newsletter (utilisateurs réguliers)
Formulaires de demande rapide
Formulaires publics à usage répété
Quand désactiver :
Enregistrements sensibles
Scénarios d'ordinateurs partagés
Formulaires de haute sécurité
Lorsque l'adresse e-mail doit être saisie manuellement
✉️ Validation d'e-mail intégrée
Vérification automatique du format :
Les champs d'adresse e-mail intègrent une validation HTML5. Les navigateurs vérifient automatiquement le format de l'adresse e-mail avant l'envoi.
Règles de validation :
Doit contenir le symbole `@`
Doit contenir du texte avant `@` (nom d'utilisateur)
Le domaine doit suivre le `@`
Doit posséder une extension de domaine valide (.com, .org, etc.).
Pas d'espaces ni de caractères invalides
Rétroaction en temps réel :
Les navigateurs affichent des messages de validation tels que « Veuillez inclure '@' dans l'adresse e-mail » ou « Veuillez saisir l'adresse e-mail après '@' ».
Erreurs courantes détectées :
`@` manquant : `useremailcom` ✗
Domaine manquant : `user@` ✗
Extension manquante : `user@domain` ✗
Espaces : `[email protected]` ✗
Caractères invalides : `user@@email.com` ✗
Format d'adresse e-mail valide :
`[email protected]', '[email protected]', '[email protected]` ✓
📝 Valeur de l'e-mail par défaut
Pré-remplissage des adresses e-mail :
Définissez une adresse e-mail par défaut qui s'affichera au chargement du formulaire. Utile pour les e-mails d'assistance, les contacts par défaut ou les formulaires de démonstration.
Cas d'utilisation:
- Pré-remplissage de l'adresse e-mail du service d'assistance pour les demandes de rappel
- Afficher un exemple de format d'e-mail ([email protected])
- Définir l'adresse e-mail de l'utilisateur connu à partir de la base de données
- Contact par défaut pour l'organisation
Modifiable :
Les utilisateurs peuvent facilement modifier ou remplacer la valeur par défaut. Il s'agit d'un point de départ, non d'une valeur figée.
🎯 Expérience utilisateur améliorée
Fonctionnalités intelligentes intégrées :
- Clavier optimisé pour la messagerie électronique – Les appareils mobiles affichent un clavier optimisé avec les touches @ et .
- Attribut Autocomplete – Autocomplétion HTML5 correcte pour les champs d'adresse e-mail
- Suppression automatique des espaces accidentels
- Conversion en minuscules – Conversion facultative en minuscules pour plus de cohérence
- Validation visuelle – Retour d'information par code couleur pour la confirmation de la correspondance
- Messages d'erreur clairs – Retour d'information spécifique à la validation
- Validation requise – Rendre la saisie de l'adresse e-mail obligatoire
- Assistance textuelle – Ajouter des conseils de format d'e-mail
- Classes CSS personnalisées – Appliquer un style personnalisé
- Assistance à l'accessibilité – Étiquettes ARIA, compatible avec les lecteurs d'écran
- Texte d'espace réservé – Afficher les suggestions de format d'e-mail
- Compatible avec le copier-coller – Les adresses e-mail complètes se collent correctement
🔀 Logique conditionnelle
Visibilité dynamique des champs d'e-mail :
Afficher ou masquer les champs d'adresse e-mail en fonction des autres valeurs du formulaire. Afficher la collecte d'adresses e-mail uniquement lorsque cela est pertinent.
Règles de logique avancée :
- Logique ET – Toutes les conditions doivent être remplies
- Logique OU – Toute condition peut déclencher l'action
- 8 opérateurs : égal, différent de, supérieur à, inférieur à, contient, est vide, et plus encore.
Cas d'utilisation:
- Afficher « Adresse e-mail professionnelle » uniquement lorsque le type de client est égal à « Professionnel ».
- Afficher « Adresse e-mail alternative » lorsque l’utilisateur coche « Ajouter un contact secondaire ».
- Afficher « Adresse e-mail de l’entreprise » lorsque le type d’enregistrement est « Entreprise ».
- Masquer « Courriel personnel » lorsque la préférence de contact est « Téléphone uniquement »
Installation simple en 3 étapes
Préparez votre champ Email en quelques minutes
Ajouter un champ de courrier électronique
Faites glisser le champ Adresse électronique depuis la section Champs de base vers votre formulaire.
Activer la confirmation (facultatif)
Cochez la case « Ajouter un champ de confirmation » pour exiger une double validation et éviter les erreurs de frappe sur les formulaires importants.
Configurer les restrictions (facultatif)
Activez la restriction de domaine pour les courriels réservés à l'entreprise, activez la saisie semi-automatique du navigateur pour plus de commodité et définissez une valeur par défaut si nécessaire.
🎉 Et voilà ! Votre champ email est prêt avec une validation intelligente et une correction des fautes de frappe.
Applications du monde réel
Formulaires de contact
* Courriels de demande de renseignements généraux
* Contacts pour les demandes d'assistance
* Collecte des coordonnées
* Courriels de demande de rappel
INSCRIVEZ-VOUS
* E-mails de création de compte
* E-mails d'identification de connexion
* Courriels de réinitialisation de mot de passe
* Adresses e-mail de vérification
Newsletter et marketing
* E-mails d'abonnement à la newsletter
Collecte des consentements marketing
* Inscriptions aux campagnes par courriel
* Collecte d'emails promotionnels
E-Commerce
* Courriels de confirmation de commande
* Courriels de confirmation de livraison
* Courriels de notification d'expédition
* E-mails du compte client
applications commerciales
* Courriels de demande de devis
* Courriels de notification de proposition
* Courriels de communication de projet
* Collecte des coordonnées des clients
Éducation et événements
* Courriels d'inscription à l'événement
* Courriels d'inscription aux cours
* Courriels de notification de webinaire
* Courriels de livraison des certificats
Options complètes pour le terrain
Configuration de base
- Libellé du champ – Le titre affiché au-dessus du champ e-mail
- Description/Texte d'aide – Conseils supplémentaires pour les utilisateurs
- Champ obligatoire – Rendre la saisie de l'adresse e-mail obligatoire
- Texte d'espace réservé – Indication affichée avant que les utilisateurs ne saisissent du texte (par exemple, «[email protected]»)
Valeur par défaut
Valeur par défaut – Adresse e-mail préremplie au chargement du formulaire
confirmation de l'émail
- Ajouter un champ de confirmation – Ajoute un deuxième champ où les utilisateurs doivent saisir à nouveau leur adresse e-mail afin d'éviter les fautes de frappe.
- Valide automatiquement la correspondance des deux entrées
- Affiche un retour d'information en temps réel avec un code couleur
- Empêche la soumission du formulaire tant que les adresses e-mail ne correspondent pas.
Intégration du navigateur
Autoriser les suggestions du navigateur – Permettre aux navigateurs de suggérer les adresses e-mail précédemment utilisées pour une saisie plus rapide
Restrictions de domaine
Restreindre les domaines de messagerie autorisés – N’accepter que les adresses e-mail provenant de domaines spécifiques (par exemple, uniquement les adresses e-mail professionnelles).
- Domaines de messagerie autorisés – Veuillez saisir chaque domaine autorisé sur une nouvelle ligne (sans le symbole @).
- Exemple : `gmail.com`, `outlook.com`, `votreentreprise.com`
- Un domaine par ligne
- Le système valide le domaine lors de la soumission.
logique conditionnelle
- Activer la logique conditionnelle – Afficher/masquer selon les conditions
- Type de logique
- Toutes les conditions doivent être remplies (ET)
- Toute condition peut être remplie (OU)
- Règles de condition
- Afficher/Masquer – Action à entreprendre
- Champ – Quel champ vérifier
- Opérateur – Égal à, Différent de, Contient, Supérieur à, Inférieur à, Est vide, N'est pas vide
- Valeur – Valeur comparative
- Conditions multiples – Ajoutez un nombre illimité de règles
options avancées
- Champ caché – Rendre le champ invisible mais inclure l'adresse e-mail dans les soumissions
- Classes CSS personnalisées – Appliquer un style personnalisé
- Attributs d'accessibilité – Étiquettes ARIA pour les lecteurs d'écran
- Transformation de texte – Conversion optionnelle en minuscules
- Suppression automatique des espaces blancs
Pourquoi choisir notre champ e-mail ?
✅ Prévention des fautes de frappe -
Le champ de confirmation garantit une collecte précise des adresses e-mail
✅ Restriction de domaine -
Autoriser des domaines spécifiques pour un accès contrôlé
✅ Saisie semi-automatique du navigateur -
Accès plus rapide grâce aux suggestions d'emails enregistrés
✅ Validation intégrée – Vérification automatique du format HTML5 des e-mails
✅ Mobile optimisé – Claviers spécifiques à la messagerie électronique sur les appareils mobiles
✅ Commentaires visuels – Validation des correspondances en temps réel pour confirmation
✅ Réduction du spam – Les restrictions de domaine empêchent les faux courriels
✅ Convivial – Messages de validation et indications clairs
✅ Entièrement synchronisé – Fonctionne parfaitement avec toutes les fonctionnalités du formulaire
Questions fréquemment posées
Q : À quoi sert le champ de confirmation d'e-mail ?
Il ajoute un deuxième champ « Confirmer l’adresse e-mail » où les utilisateurs doivent saisir à nouveau leur adresse e-mail. Cela évite les fautes de frappe comme… [email protected] au lieu de gmail.com. Les deux champs doivent correspondre pour soumettre l'envoi.
Q : Comment fonctionne la restriction de domaine ?
Activez cette option et saisissez les domaines autorisés (un par ligne), par exemple votreentreprise.com. Seuls les courriels se terminant par ces domaines seront acceptés.
Q : Puis-je autoriser plusieurs domaines ?
Oui. Saisissez plusieurs domaines, un par ligne, par exemple : company1.com, company2.com, partner.com. Tous seront acceptés.
Q : Dois-je utiliser la confirmation par courriel pour tous les formulaires ?
Utilisez-le pour les formulaires importants comme les inscriptions, les commandes ou les billets d'événements. Évitez de l'utiliser pour les simples demandes de renseignements afin de garantir une expérience utilisateur rapide.
Q : À quoi sert l’option « Autoriser les suggestions du navigateur » ?
Il active la saisie automatique dans le navigateur afin que les utilisateurs puissent choisir parmi leurs adresses électroniques enregistrées au lieu de les saisir manuellement.
Q : Les utilisateurs peuvent-ils contourner la validation de l'adresse électronique ?
Non. Les navigateurs appliquent automatiquement les règles de formatage des adresses e-mail et bloquent les formats incorrects tels que utilisateur@ ou @domaine.com.
Q : Comment puis-je limiter la réception aux seuls courriels de l'entreprise ?
Activez l'option « Restreindre les domaines de messagerie autorisés » et saisissez le domaine de votre entreprise. Seuls les courriels utilisant ce domaine seront acceptés.
Q : Le champ de confirmation apparaît-il sur la même ligne ?
Non. Il apparaît juste en dessous du champ principal de l'e-mail, avec l'intitulé « Confirmer l'e-mail ».
Q : Quel clavier apparaît sur mobile ?
Les appareils mobiles affichent un clavier adapté à la messagerie électronique, avec les symboles @, point et les raccourcis de domaine courants.
Q : Puis-je utiliser des champs d'e-mail avec une logique conditionnelle ?
Oui. Vous pouvez afficher ou masquer les champs d'adresse e-mail en fonction des sélections de l'utilisateur à l'aide de conditions telles que « Est vide », « N'est pas vide » ou « Égal à ».
Q : Que se passe-t-il si les domaines ne correspondent pas ?
L'utilisateur reçoit un message du type : « Domaine de messagerie non autorisé. Veuillez utiliser un domaine approuvé. »
Q : Dois-je activer la saisie automatique pour des raisons de sécurité ?
Cela dépend. Activez cette option pour plus de commodité sur les formulaires publics. Désactivez-la sur les systèmes partagés ou sensibles lorsqu'une saisie manuelle est préférable.
