Article mis à jour le 21 octobre 2025.
Vous êtes-vous déjà retrouvé, en tant qu'utilisateur, à maudire la personne qui a conçu le processus de remplissage d'un formulaire sur un site web ? Il est fort probable que vous ayez été agacé d'être obligé de fournir trop de données pour vous inscrire ou acheter un produit. La vérité est que j'ai souvent vécu la même chose.
Dans ce blog, nous avons déjà abordé divers aspects de l'UX et de l'ergonomie web, mais nous n'avions pas encore consacré un article à l'examen des particularités des formulaires.
Et, aussi simples qu'ils puissent paraître en tant qu'outils, les formulaires sont un élément extrêmement important dans la durée de vie d'un projet web et avec un impact significatif sur la conversion, s'il s'agit d'une boutique e-commerce.
À cet égard, il existe des aspects de conception et d'expérience utilisateur qu'il convient d'examiner et de tester pour évaluer s'il est nécessaire de modifier complètement vos formulaires.
C'est pourquoi nous vous présentons ci-dessous quelques éléments à prendre en compte pour vous aider à améliorer les conversions et la capture de leads sur votre site web.
Pour cela, utilisez les ressources du design, les couleurs et un emplacement bien visible pour permettre aux utilisateurs de trouver facilement votre formulaire.
En d'autres termes, faites en sorte que cet espace de contact se distingue du reste du site et accompagne l'utilisateur dans les moments les plus pertinents.
Ici s'applique le concept du moins c'est plus, très récurrent lorsqu'on parle de design et d'expérience utilisateur sur le web.
Il convient de noter qu'une étude menée par l'Université de Columbia a montré qu'offrir trop d'options aux gens provoque l'indécision et, finalement, ils n'en choisiront aucune par peur de se tromper [1].
Dans certains cas, de petits changements pour simplifier nos formulaires et processus de paiement peuvent avoir un grand impact sur le taux de conversion.
Le texte accompagnant le formulaire devra être attrayant et sa mission sera de résoudre une question tacite et fondamentale de l'utilisateur : quelle est la récompense pour la fourniture de mes données ?
L'important est d'indiquer l'avantage ou le bénéfice que la personne obtient en s'inscrivant.
Une autre alternative est d'utiliser des impératifs ou des questions dans les titres.
Dans le premier cas, vous donnez un appel à l'action à l'utilisateur et dans le second, vous générerez un doute raisonnable qui l'invitera à lire ce qui se trouve sous ce titre.
Comme pour les contenus en général, lorsqu'on parle d'ergonomie web, dans un formulaire, les textes et les champs associés doivent être alignés de manière à faciliter la lecture.
Un bon alignement des champs et des étiquettes d'un formulaire est déterminant pour la perception de l'ordre, et contribuera à réduire la charge cognitive.
Plus simplement, un formulaire ordonné a plus de chances d'inspirer confiance et d'inciter l'utilisateur à le remplir, contrairement à un formulaire désordonné devant lequel l'utilisateur se sent habituellement perdu et a tendance à abandonner la tâche.
Le formulaire suivant, bien qu'il ne semble pas contenir un grand nombre de champs, ne donne pas une impression d'ordre visuel ; au contraire, l'utilisateur peut se sentir désorienté :
Source du formulaire : falabella.com
Ce sont les champs qui recueillent les données indispensables pour pouvoir effectuer la transaction avec votre formulaire.
Par exemple, le minimum pour une inscription serait l'e-mail et le nom. Mais pour un achat, vous aurez besoin de plus d'informations, comme l'adresse de livraison complète.
Ainsi, les champs obligatoires doivent être clairement identifiés afin que la personne sache à l'avance qu'elle ne pourra pas finaliser le processus si elle ne les remplit pas correctement.
La manière la plus courante est d'avertir au début du formulaire que les champs marqués, par exemple avec un astérisque rouge, sont considérés comme obligatoires. Et, évidemment, chacun de ces champs obligatoires devra porter cette marque de manière très claire.
Source du formulaire : paris.cl
Pour cela, mettez-vous simplement à la place de l'utilisateur/client et posez-vous la question : est-il vraiment essentiel de connaître l'âge ou le numéro de téléphone de cette personne ?
Peut-être n'est-ce pas totalement nécessaire dans la plupart des cas pour finaliser la transaction. C'est une autre décision de conception et d'expérience utilisateur.
Alors, demandez ce type de données comme facultatives ou non obligatoires, et permettez à quiconque de remplir votre formulaire avec seulement son adresse e-mail et son nom.
S'il est vraiment nécessaire de demander un grand nombre de données, il est recommandé de regrouper les champs du formulaire en groupes cohérents, afin de faciliter la lecture.
Il est plus facile pour le cerveau de traiter les informations par blocs que dans une mer de données.
Voici un exemple à cet égard, tiré d'un processus d'inscription :
Source du formulaire : easy.cl
C'est un aspect très important pour prendre soin de l'expérience utilisateur en général lorsque nous évaluons l'ergonomie sur le web.
Par conséquent, dans le cas d'un formulaire, assurez-vous qu'il est clair pourquoi il ne peut pas être envoyé lorsque la personne n'a pas fait quelque chose correctement.
Par exemple, un champ obligatoire n'a-t-il pas été rempli ? Une information n'a-t-elle pas le bon format ?
Communiquez-le de manière claire et explicite à travers les messages de validation et d'erreur.
Cela permettra à la personne de comprendre le problème et de corriger les informations nécessaires, au lieu de se sentir frustrée et d'abandonner votre formulaire… et, par la même occasion, de quitter votre site web.
D'autre part, assurez-vous que les messages ne rendent pas le formulaire peu convivial :
Source du formulaire : falabella.com
Une façon d'éviter les erreurs lors du remplissage des champs est d'indiquer avec des exemples comment les informations doivent être saisies.
S'il s'agit d'un numéro de téléphone, mettez un numéro fictif dans le champ ou juste au-dessus pour montrer le format (+88 998989898). S'il s'agit du numéro de pièce d'identité, faites de même (9.999.999-9).
Un principe fondamental en matière d'ergonomie et d'expérience utilisateur est que les boutons doivent être facilement distinguables de l'ensemble du contenu.
C'est-à-dire, avoir une forme reconnaissable et une couleur contrastante qui attire l'attention.
À cela s'ajoute le détail que sa couleur doit être cohérente avec l'action qu'il propose. Par exemple, un bouton ENVOYER devrait être vert ou bleu, mais jamais rouge car cette couleur indique d'arrêter, d'annuler ou de ne pas faire quelque chose.
De même, l'appel (le texte) doit être pertinent et cohérent avec l'action qu'il représente. Il est recommandé d'utiliser des verbes d'action : ENVOYER, ACHETER MAINTENANT, M'ABONNER AUJOURD'HUI.
L'emplacement des boutons est également important. Par exemple, le bouton devrait être à la fin du formulaire et centré.
Et, aussi étrange que cela puisse paraître, évitez de placer un bouton d'annulation de l'action près du bouton CONTINUER ou ENVOYER.
Assurez-vous simplement que l'utilisateur effectue l'action sans distractions et aidez-le à trouver rapidement le bouton ENVOYER.
L'idée est que les formulaires soient faciles et rapides à remplir. Pour cela, ils doivent permettre de passer d'un champ à l'autre en appuyant sur la touche TAB.
L'objectif est d'éviter que l'utilisateur n'ait à utiliser la souris pour passer au champ suivant, éloignant ainsi sa main droite du clavier. Vous améliorerez ainsi l'ergonomie et l'expérience utilisateur de votre formulaire.
Que pensez-vous de ces conseils ? Vérifiez les formulaires de votre site web et voyez s'ils respectent ces principes de conception et d'expérience utilisateur.
Référence :
[1] Ressources et études de l'Université de Columbia.
À lire :
TV Gets Social: Evaluating Social Media Data To Explain Variability Among Nielsen TV Ratings.
À voir :
Luke Wroblewski, l'un des grands noms du monde de la conception d'interfaces utilisateur et de l'ergonomie, vous donne des conseils sur la façon d'optimiser correctement vos formulaires : How to Increase Form Conversion | Intel Software.
Par 
