Dix Astuces pour améliorer l’ergonomie de vos Formulaires

Comments :0
Tags: astuces, ergnonomie, ergonomie formulaire, formulaire, vérification formulaire

Certaines société ont augmenté considérablement leur taux de transformation grâce à l’optimisation d’un processus d’achat ou encore une recherche de produit.

L’utilisateur doit pouvoir tout de suite identifier les parties d’un formulaire et être guidé par des incidations claires et précises. Enfin, la saisie des données doit impéravitement être facilitée et la validation intuitive.

C’est donc à ce sujet, que vous trouverez ci-dessous dix astuces pour améliorer et/ou optimiser vos formulaires. Ces conseils peuvent être associés à des grands standards ergonomiques applicables partout et d’autres seront plus spécialisés et devront peut être adapter certaines spécificités technique de leur formulaires.

 

Astuce 1 – Utilité du Formulaire

La première étape avant de commencer à coder votre formulaire est de réfléchir à son utilité. Veillez toujours à prendre en compte les différentes problématiques des utilisateurs : dans quel but ce formulaire doit être utilisé ? Quand sera-t-il utilisé ? Par qui ? Comment ? Etc… En ayant réponse à ces questions vous pourrez ainsi déterminer la structure idéale à mettre en place.

 

Astuce 2 – Adapter les Champs.

Vous avez à votre disposition cinq différents types de champs pour créer votre propre formulaire : la zone de texte (et la zone de texte multiligne), la case à cocher (checkbox), le bouton radio, le menu déroulant et la liste. Veillez à toujours bien adapter votre choix en fonction du type de données demandées. Par exemple, si vous demandez la région dans laquelle l’internaute habite, préférez un menu déroulant à une zone de texte ou encore à une liste.

 

Astuce 3 – Marquer les champs obligatoires

Il est très important d’afficher visuellement les champs qui sont obligatoires. La méthode la plus simple est d’ahouter un astérisque à la suite du libellé. En outre rien ne vous empêche d’être plus explicite en optant pour une dose supplémentaire d’originalité ! Par ailleurs, les règles régissant ces champs devront être expliqués tout en haut de la page et non à la fin du formulaire. La personne aura donc toutes les informations nécessaires pour remplir son formulaire au départ et n’arrivera pas en bas de la page en découvrant des nouveaux éléments.

 

Astuce 4 – Apporter une attention particulière à la lisibilité

La lisibilité est très importante, elle passe au travers d’un certain nombre de points : des libellés et des champs suffisamment contrastés avec le fond de la page, un formulaire divisé en plusieurs parties et un bon espacement entre celles-ci, des champs correctement alignés (libellés soit à gauche ou à droite)… Vous pourrez utiliser des Styles CSS pour aider l’utilisateur à mieux s’y retrouver entre les diverses parties.

 

Astuce 5 – Format des champs

Il est inutile d’utiliser une zone de texte de 300 pixels de large pour obtenir le code postal d’un internante par exemple. Vous pouvez faire varier la taille des champs en fonction des données demandées. Autre point, vous devez impérativement être clair et précis concernant les intitulés de vos champs, par exemple : si vous demandez une date de naissance, n’oubliez pas de bien spécifier le format souhaité (jj/mm/aaaa…).

 

Astuce 6 – Ordre des champs

Veillez à bien garder un ordre logique pour les différentes parties de votre formulaire. Mêmes règles pour les zones de saisie. Si vous demandez une adresse postale par exemple, l’ordre logique est : le numéro, le nom de la rue, le code postal puis la ville et le pays.

 

Astuce 7 – Assister l’utilisateur

Il y a plusieurs méthodes pour aider l’internaute à utiliser un formulaire, vous pouvez soit préremplir certains champs, soit placer en haut de liste certaines options les plus souvent sélectionnées. Vous pourrez par exemple placer : France, Angleterre, Espagne en tête de liste pour une sélection de pays pour un utilisateur dans l’Union Européenne.

 

Astuce 8 – Faciliter la soumission

Le bouton de validation du formulaire doit être aligné à la suite des champs de saisie. Vous devez eviter de l’aligner par exemple en bas à droite de la page. Vous pouvez notamment le personnaliser si vous le souhaitez afin qu’il soit bien mis en valeur pour l’utilisateur. Si vous optez pour cette solution, n’oubliez cependant pas de créer un état « hover », qui augmentera le taux de clics. De plus, vous pouvez bannir les boutons Annuler ou Réinitialiser le formulaire qui pourraient induire en erreur un utilisateur sans apporter de plus-value.

 

Astuce 9 – Mise en place d’un système de vérification

N’oubliez pas la mise en place d’un système de vérification des données saisies qui peut être composé de la manière suivante : en JavaScript, celui-ci contrôlera si un champ est rempli et correctement. Si ce n’est pas le cas, un message indiquera à l’utilisateur l’erreur qu’il a pu commettre en remplissant le champ, un message avertira l’utilisateur. En PHP, celui-ci pourra avertir l’utilisateur si un champ est bien rempli mais irrecevable (par exemple pour un pseudo déjà enregistré).

 

Astuce 10 – Confirmer la réception

Pour confirmer la réception des données, vous avez différents moyens à votre disposition. Vous pouvez par exemple envoyer un email de confirmation qui indiquera à l’utilisateur un récapitulatif des informations qu’il a saisi avec le message d’acceptation. La même chose pourra aussi être faite dans le navigateur avec une page de remerciement / confirmation d’enregistrement qui indiquera un message du type : « Vos informations ont bien été enregistrées, merci de l’intérêt que vous nous portez » ou encore « Nous avons bien pris en compte votre demande et vous contacterons dans les plus brefs délais ».

 

En conclusion, il est bon de rappeler qu’un formulaire en ligne est plus important pour vous qu’il ne l’est pour l’internaute. En effet, remplir un formulaire est une véritable étape pour un internaute, et vous devrez de ce fait, faire tout votre possible pour qu’il le fasse dans les meilleurs conditions possibles, pour augmenter le taux de remplissage et la validation. Soyez donc efficace, suivez bien les différentes règles d’ergonomie générale, ajoutez quelques touches personnelles liées à la thématique de votre site internet et vous obtiendrez un formulaire pratique et ludique pour l’utilisateur.