Formulaires web : le guide des bonnes pratiques
Depuis mes débuts en tant qu’UX designer, j’ai remarqué que les formulaires sont un point d’attention central en matière d’expérience utilisateur : ce sont des points de conversion qui ont souvent une charge cognitive très forte. Aussi, ils sont très révélateurs de la qualité globale d’un produit numérique ; on dit souvent que l’on reconnait la qualité d’un restaurant à son pain ; je peux affirmer que l’on reconnait indéniablement la qualité d’une interface à ses formulaires…
Voici quelques conseils simples pour upgrader la qualité des formulaires de votre site web.
Réduire la charge cognitive
La charge cognitive, c’est la somme de tous les efforts que doit faire le cerveau d’un utilisateur pour appréhender et traiter les informations dans une situation donnée. Plus la charge cognitive est forte, plus le risque d’erreur est important, et comme les erreurs sont souvent synonymes de frsutration et d’abandon, il est indispensable de limiter cette charge au maximum. Voici quelques pistes pour atteindre cet objectif :
Limiter les champs au strict nécessaire
Plus il y a de champs, plus l’information est longue, complexe à traiter et dissuasive. Trop souvent, les annonceurs cherchent à qualifier un nombre trop important de données dont ils n’ont même pas l’utilité, simplement parce que « ce serait intéressant de savoir si… ».
Ma recommandation : limitez la qualification de données à ce qui est strictement nécessaire, cela limitera la charge cognitive de vos utilisateurs, et les rassurera quant à la quantité de données personnelles qu’ils vous livrent. C’est purement et simplement la philosophie RGPD que l’on vous demande d’appliquer.
Regrouper les informations
Pour faciliter le traitement des informations, les regrouper de manière cohérente est une bonne méthode.
Ainsi, et notamment pour les formulaires complexes, si vous avez besoin de recueillir des données sur l’identité de vos utilisateurs, regroupez les informations relatives à cette question (nom / prénom / âge par exemple).
Ma recommandation : prenez le temps d’ordonnancer les champs de manière logique, pourquoi pas même en ajoutant des titres pour mieux guider la lecture, vous utilisateurs vous remercieront.
Découper en plusieurs étapes
Grand classique du e-commerce, pour éviter de perdre les utilisateurs en les confrontant à la trentaine de champs qu’ils doivent remplir pour procéder à un achat, il est maintenant d’usages de découper les formulaires d’achat sous forme de « tunnel d’achat ». Mais cette pratique n’est pas réservée au e-commerce, elle est tout à fait adaptée à d’autres domaines d’application comme des candidatures, ou le remplissage de sa feuille d’imposition.
Ma recommandation : si les informations regroupées peuvent être découpées en plusieurs étapes, ne vous en privez pas, mais faites-vous accompagner pour mettre en place les bonnes pratiques qui rendent ce découpage efficient.
Optimiser la lisibilité
Apportez du confort à vos utilisateurs en appliquant des règles ultra simples à mettre en place :
Eviter les colonnes multiples
De nombreuses études ont démontré que l’orsque l’on met un formulaire sur plusieurs colonnes, les utilisateurs (à part équivalente) ne les lisent pas les informations dans le même sens : certains privilégient la lecture de gauche à droite et d’autres la lecture de bas en haut. Alors il est quasi impossible d’avoir un formulaire dont les informations sont correctement regroupées pour la moitié des utilisateurs.
Ma recommandation : faites simple ; une seule colonne, c’est très efficace, ça ne laisse pas de place au doute, et c’est plus simple en responsive.
Jalonner la lecture graphiquement
Vous pouvez apporter du confort à vos utilisateurs en jouant sur les graisses des typographies, pour leur permettre d’identifier les différentes typologies d’informations qui composent un formulaire : labels, placeholders, obligation de saisie…
Ma recommandation : utilisez du gras sur les labels des champs et placez-les au-dessus de la zone de saisie. Préférez une graisse moindre indiquer si le champ est – obligatoire ou – facultatif, et différenciez les placeholders des informations saisies. Vous l’aurez compris, la typographie et les nuances de couleurs sont des alliés précieux pour aider vos utilisateurs, mais attention à ne pas transformer votre formulaire en sapin de noël.
Faire preuve de clarté
Il n’y a rien de pire qu’un champ de formulaire dont on ne comprend pas ce qui est attendu ! Un formulaire qui manque de clarté, c’est l’assurance d’un taux de transformation dégradé. Voici quelques conseils qui vous aideront à éviter cet écueil :
Banir le jargon
A moins que votre application soit utilisée uniquement par une typologie de personnes très restreinte pour qui il est admis qu’un terme « métier » est limpide, faites le choix d’intitulés clairs.
Ma recommandation : choisissez des mots simples, utilisez des placeholders directs (par exemple : « sélectionner dans la liste »), indiquez les contraintes (par exemple de format). N’hésitez pas à utiliser des info-bulles ou des zones d’explications si la demande nécessite d’être précisée.
Travailler les cas d’erreur
Les messages d’erreur sont très souvent le parent pauvre des formulaires, ils demandent un effort à la fois en terme rédactionnel et de développement, ils sont pourtant indispensables pour permettre la complétion et optimiser le taux de transformation.
Ma recommandation : Mettez les champs en erreur en surbrillance et travaillez les message pour qu’ils soient le plus précis possibles. En 2025, on ne veut plus de « champs invalide » et autres « ce champ est requis » alors qu’une donnée est saisie dedans. N’oubliez pas de rester friendly pour offrir une interface conviviale.
Soigner le call-to-action
Tout comme les labels et les messages d’erreur, le call-to action doit indiquer précisément l’action qui sera effectuée lors du clic sur le bouton, afin que l’information soit sans équivoque pour l’utilisateur.
Ma recommandation : choisir « Envoyer ma demande » ou « Déposer mon dossier de candidature » plutôt qu’un terme générique comme « Valider ». Globalement investir dans une repasse d’UX writing est toujours une bonne idée. Aussi, donner un feedback clair à l’utilisateur sous la forme de message de confirmation est indispensable pour le rassurer.
Pour finir ?
Il y a tellement de do et de don’t sur les formulaires qu’il faudrait faire une série de 10 articles pour les lister (je le ferai peut-être un jour, mais pas maintenant). En attendant, si vous le souhaitez, je peux analyser les formulaires de votre application et vous aider à les optimiser pour que la conversion ne soit plus source de frustration. N’hésitez pas à me contacter pour une analyse approfondie.
