Pour toute application ou tout site web fonctionnels, les formulaires servent d’outil aux utilisateurs pour atteindre leur objectif d’utilisation de votre plateforme. Le rôle des formulaires dans la conception de sites web est au final de collecter des données auprès des utilisateurs pour mener à bien une tâche ou soumettre une requête. Il est important que les formulaires répondent à certains standards afin de rendre la plateforme aussi facile à utiliser pour l’utilisateur que possible. De tels standards incluent un formulaire visuellement agréable, avec un design propre et simple. En plus d’avoir une bonne apparence, l’aspect le plus important pour le formulaire est de contenir des champs conçus pour obtenir les informations utiles à l’objectif et rien de plus.
QU’EST-CE QUI CARACTÉRISE UN FORMULAIRE ?
De nombreux aspects clés sont impliqués dans la création du formulaire optimal. La plupart des formulaires sont créés en ayant pour but d’apporter aux utilisateurs une interface attrayante, qui leur permet de fournir facilement les informations désirées. La structure est un point extrêmement important à prendre en compte, ainsi que la traduction et la localisation.
TRADUCTION ET LOCALISATION
Si votre entreprise ou institution s’étend à l’international, vous allez alors probablement vous adresser à des consommateurs et clients parlant une variété de langues. Afin de garantir une collecte correcte des données, il est primordial que les formulaires soient traduits. Certains navigateurs internet ont des logiciels inclus qui affirment pourvoir efficacement traduire le contenu en utilisant la traduction automatique. Cependant, il est possible d’ajouter une touche bien plus personnelle au formulaire grâce à des traductions humaines, qui bénéficieront d’un plus fort degré de localisation. Les formulaires sont composés de plusieurs sections clés. La structure d’un formulaire inclut l’apparence et l’ordre des sections présentés. Les champs de saisie sont un aspect clé, utilisé pour recevoir des informations comme le nom, le mot de passe, l’e-mail, etc. Vous trouverez plus bas les éléments clés pour des formulaires réussis et ce qu’ils devraient comporter. Cette présentation a été conçue pour la première fois par le développeur Nick Babich.
STRUCTURE
La structure d’un formulaire peut réellement affecter la façon dont il est perçu par les utilisateurs. Pour faciliter la tâche pour l’utilisateur, il est logique de faire attention à l’ordre dans lequel les questions sont posées. Par exemple, la convention standard est de demander le nom et le titre avant de demander l’adresse et le code postal. Les formulaires ne devraient demander que ce qui est essentiel. Allonger un formulaire au-delà du nécessaire ne fera que réduire le taux de complétion. La structure devrait comporter des groupes d’informations liés et pertinents. Par exemple, les informations personnelles comme le nom et la date de naissance pourraient composer un groupe. Ensuite, viennent les informations sur le compte, comme une adresse e-mail et un mot de passe, qui composent un autre groupe. La disposition des saisies impactera réellement la structure d’un formulaire. Un formulaire dans lequel l’utilisateur doit seulement faire défiler vers le bas est optimal. De multiples colonnes pourraient perturber l’ordre de saisie des données et rajouter une complexité inutile.
CHAMPS DE SAISIE
Les champs de saisie sont les sections où les utilisateurs saisissent les informations qui leur sont demandées. Ces champs peuvent inclure des saisies pour les adresses e-mail, les mots de passe, des dates, des cases à cocher et bien plus. Afin de garder les formulaires efficaces et faciles à utiliser, il est optimal de limiter le nombre de champs au minimum. Ne créez des champs de saisies que pour les informations absolument nécessaires. Environ 5-7 champs suffisent généralement à poser les questions appropriées et à extraire les informations recherchées. Un long formulaire compliqué avec de nombreux champs de saisie pourrait intimider l’utilisateur, en le poussant à abandonner complètement l’idée de remplir le formulaire. Il est préférable d’essayer d’éviter les saisies optionnelles pour réduire l’encombrement. Si vous décidez d’inclure des champs optionnels, n’oubliez pas de les marquer en tant que tels. Faites attention quand vous réglez des options par défaut, car de nombreux utilisateurs pourraient alors les sauter sans saisir les informations correctes. Un exemple serait de régler un pays par défaut, mais ceci peut aussi être déterminé par les données de géolocalisation.
MASQUES DE SAISIE
Les masques de saisies facilitent la saisie des données pour les utilisateurs et leur permet de se rendre compte plus facilement d’une éventuelle erreur. Les masques de saisie peuvent être appliqués à des champs comme les numéros de carte bancaire et de téléphone. Des parenthèses, tirets et espaces peuvent être préréglés afin d’éviter que l’utilisateur n’ajoute trop de caractères. Assurez-vous de rendre les formulaires adaptés aux interfaces spécifiques. Les utilisateurs d’ordinateurs de bureau devraient pouvoir utiliser le clavier et la touche tabulation avec facilité. Les utilisateurs de smartphones devraient se voir présenter le clavier adapté selon les informations qui leur sont demandées. Des fonctions d’auto-complétion sont aussi utiles, comme lorsqu’on saisit une adresse. Ceci rend le processus bien plus efficace pour les utilisateurs.
ÉTIQUETTES
Les étiquettes sont essentielles pour aider les utilisateurs à naviguer dans le formulaire et à comprendre ce qui est demandé dans chaque champ de saisie. Les étiquettes devraient être brèves et pertinentes, en utilisant aussi peu de mots que possible. Utiliser la capitalisation d’une phrase plutôt que d’un titre est plus attractif et pratique. La capitalisation de titre implique des majuscules à chaque mot, alors que celle d’une phrase ne met des majuscules qu’au premier mot de la phrase. Il faut éviter d’écrire tout en majuscules, car ceci rend les formulaires plus difficiles à lire et à scanner. Les étiquettes peuvent être disposées soit sur le côté, soit au-dessus des champs de saisie. Les étiquettes alignées sur le haut sont associées à de meilleurs taux de complétion, mais elles peuvent ne pas être idéales pour de longs formulaires, car elles augmentent leur longueur. Les étiquettes alignées sur la gauche demandent moins d’espace vertical, mais elles sont associées à un plus faible taux de complétion. Les étiquettes alignées sur la droite ont un bon taux de complétion, offrent une meilleure connexion visuelle, mais sont plus difficiles à lire et à scanner.
BOUTONS D’ACTION
Les boutons d’action sont utilisés sur les formulaires pour catalyser une action, comme le fait de soumettre le formulaire. Généralement, un formulaire comportera des boutons d’actions tels que « soumettre » et « annuler ». Il est utile d’employer des distinctions visuelles entre ces deux boutons pour aider les utilisateurs à éviter de cliquer sur le mauvais bouton. Rendez peut-être le bouton « soumettre » plus gros et plus visuellement attractif. Les boutons d’action de ce titre devraient être placés sous le formulaire, à un endroit approprié. Apporter un retour visuel sur un bouton d’action permettra à l’utilisateur de voir clairement qu’il a cliqué dessus. Ce genre de retour peut inclure un changement de couleur ou de profondeur.
VALIDATION
La validation peut souligner des erreurs commises par l’utilisateur et empêchera la soumission du formulaire. Ceci montrera spécifiquement quels champs ont été négligés afin de rendre le processus de correction rapide et facile. Même s’il existe de nombreuses subtilités et considérations à prendre en compte en concevant un formulaire de collecte de données, les éléments cités plus haut devraient vous apporter de bonnes bases pour produire des formulaires avec lesquels vos utilisateurs seront contents d’interagir.
