Un visiteur arrive sur votre formulaire. Le premier champ demande son e-mail. Mais votre site a déjà son e-mail, grâce à une inscription précédente. Il doit le retaper. Un deuxième visiteur arrive et le formulaire lui demande son pays. Vos statistiques savent déjà où il se trouve. Pourquoi demander ?
Les formulaires préremplis se remplissent plus vite. Les visiteurs n'ont pas à ressaisir des informations que vous avez déjà. Cet article explique comment préremplir des formulaires et quelles sources de données utiliser.
Pourquoi préremplir les formulaires
Chaque champ à remplir fait baisser le taux de complétion. Si vous pouvez remplir 50 % des champs automatiquement, le formulaire paraît plus court. Le visiteur y passe moins de temps. Moins de champs à gérer, c'est moins de risques d'erreurs.
Des études montrent que les formulaires préremplis ont des taux de complétion supérieurs de 20 à 30 % à ceux des formulaires vides. La différence est réelle.
Préremplir depuis les paramètres d'URL
La méthode la plus simple est de passer les données dans l'URL avec wemasy.fr/contact?email=user@example.com&name=John. Au chargement de la page, JavaScript extrait les paramètres et remplit le formulaire avec const params = new URLSearchParams(window.location.search); document.getElementById('email').value = params.get('email'); document.getElementById('name').value = params.get('name');. Cela fonctionne pour renvoyer vers un formulaire depuis une autre page, par exemple quand une campagne e-mail renvoie vers un formulaire de contact avec l'e-mail du destinataire prérempli, ou quand une landing page renvoie vers un formulaire d'inscription avec la campagne d'origine préremplie.
Attention aux données sensibles. Ne passez ni mots de passe ni numéros de carte bancaire dans les URL. Ne passez que des données non sensibles comme l'e-mail et le nom.
Préremplir depuis les sessions utilisateur
Si l'utilisateur est connecté, vous savez qui il est et pouvez préremplir son e-mail, son nom, son adresse et d'autres informations depuis son compte. Côté serveur, avant d'afficher le formulaire, utilisez const user = getUserFromSession(); const form = { email: user.email, name: user.name, address: user.address };. Puis, dans le modèle HTML, définissez <input type="text" name="name" value="<%= form.name %>">. Autre possibilité, en JavaScript après le chargement de la page : _blocked_('/api/user').then(res => res.json()).then(user => { document.getElementById('email').value = user.email; document.getElementById('name').value = user.name; });. Cette approche exige que l'utilisateur soit connecté. Pour les formulaires publics, utilisez plutôt les paramètres d'URL ou des données tierces.
Préremplir depuis les données du navigateur
Le navigateur stocke des données auxquelles vous pouvez accéder de deux façons. D'abord, localStorage permet de stocker des données dans le navigateur et de les récupérer plus tard avec localStorage.setItem('email', 'user@example.com'); const email = localStorage.getItem('email');. Elles persistent d'un chargement de page à l'autre et d'une session à l'autre, ce qui sert à sauvegarder la progression d'un formulaire ou à retenir l'e-mail d'une visite précédente. Ensuite, les navigateurs modernes mémorisent les données saisies auparavant. Définissez des attributs autocomplete et la saisie automatique du navigateur s'active, avec <input type="email" name="email" autocomplete="email"> et <input type="text" name="name" autocomplete="name">. Le navigateur propose des suggestions et remplit le champ sans aucun code, et l'autocomplétion aide surtout sur mobile, où la saisie est lente.
Préremplir depuis la géolocalisation
Vous pouvez détecter la position approximative de l'utilisateur et préremplir le pays ou la région avec _blocked_('https://api.example.com/json/').then(res => res.json()).then(data => { document.getElementById('country').value = data.country; document.getElementById('state').value = data.region; });. Cela utilise son adresse IP pour deviner la position. Ce n'est pas parfaitement précis (surtout avec un VPN) mais suffisant dans la plupart des cas. Laissez toujours à l'utilisateur la possibilité de modifier.
Préremplir depuis des services de données tiers
Des services d'enrichissement de données peuvent retrouver des informations sur une entreprise et une personne à partir d'une adresse e-mail. Quand l'utilisateur saisit son e-mail, JavaScript l'envoie au service d'enrichissement, qui répond avec des informations sur l'entreprise, le poste et la localisation, puis le formulaire se préremplit avec ces données. Cela demande une clé d'API et du code d'intégration, ce qui est plus complexe mais très puissant pour les formulaires B2B.
Préremplir des champs cachés
Les champs cachés transportent des données que l'utilisateur ne voit pas mais dont votre serveur a besoin.
<input type="hidden" name="source" value="email_campaign">
<input type="hidden" name="campaign_id" value="summer_2026">
Ils sont préremplis côté serveur avant l'affichage du formulaire. Utilisez-les pour suivre d'où vient l'envoi du formulaire ou quelle campagne l'a provoqué.
Préremplir des formulaires en plusieurs étapes
Dans un formulaire en plusieurs étapes, préremplissez l'étape 2 avec les données de l'étape 1 pour que l'utilisateur n'ait pas à ressaisir ce qu'il a déjà tapé. Après l'envoi de l'étape 1, stockez les données en session ou dans localStorage. Au chargement de l'étape 2, récupérez-les et préremplissez avec const step1Data = JSON.parse(localStorage.getItem('formStep1')); if (step1Data) { document.getElementById('email').value = step1Data.email; }.
Vie privée et autorisation
Le prérempli est pratique, mais il soulève des questions de vie privée. Afficher l'e-mail de quelqu'un sans son accord paraît intrusif.
Ne préremplissez que des données que vous avez le droit d'utiliser. Si l'utilisateur est connecté, vous avez l'autorisation. Si les données viennent d'une campagne e-mail sur laquelle il a cliqué, vous avez l'autorisation. Si elles viennent d'un service tiers, vérifiez votre politique de confidentialité.
Laissez toujours les utilisateurs modifier les valeurs préremplies. Ne les enfermez pas.
Comment WEMASY préremplit les formulaires
Les formulaires WEMASY permettent le prérempli depuis les paramètres d'URL et les sessions utilisateur. Connectez des outils d'automatisation ou des API pour préremplir depuis des données tierces. Utilisez le prérempli intelligent pour détecter la localisation du visiteur et d'autres attributs.
Découvrez les possibilités de prérempli dans votre offre WEMASY.