L’art du formulaire web efficace

Le 11 juillet 2008   //   par Gaëtan   //   webdesign  //  Pas de Commentaires

L’excellent site www.smashingmagazine.com propose 2 études qui permettent de dégager les règles de construction d’un formulaire web efficace et fonctionnel. Voici résumé, l’essentiel de ce qu’il faut retenir…
Positionnement du lien :

  • Le lien vers le formulaire est placé dans le header dans 59% des cas (plutôt dans le coin supérieur droit pour 76% de ces cas)
  • Sinon il est indiqué de manière proéminente sur la page d’accueil (21 % des sites)

Design / Aspect

  • Les titres des champs sont accentués en gras et de couleur (62 %)
  • Les étiquettes sont alignées à droite de manière à être rapprochées du champ correspondant (41 %)
  • es champs arrangés verticalement sont préférés aux champs arrangés horizontalement (86 % des sites).
  • Les champs sont d’habitude groupés et séparés par un simple espace blanc (69 %)
  • Les informations d’aide apparaissent principalement au-dessous du champ (57 %) ou sur le côté droit du champ (26 %)
  • Le bouton « Soumettre » est majoritairement aligné à gauche (56 %) ou bien centré (26 %),
  • Le bouton « Annulez » n’est pas utilisé (92 % des cas),

Contenu

  • Les formulaires d’inscription ne font qu’une seule page (93 % des cas )
  • Les formulaire ont une disposition simplifiée pour éviter des distractions pour les utilisateurs (61 %)
  • Des informations complémentaires attirent l’attention des visiteurs sur les avantages de l’enregistrement (41 %)
  • Les sites ont tendance à utiliser peu de champs obligatoires, ainsi que peu de champs optionnels.

Aide aux visiteurs

  • 85 % des sites n’utilisent pas de légende
  • 78 % des sites n’utilisent pas d’astérisques pour accentuer les champs obligatoires
  • 84 % des formulaires n’ont pas d’effet Over, Active ou Focus sur les champs
  • 57 % des formes de web fournissent une aide « statique » (des détails, placés à côté du champ expliquent, ce qui est attendu de la contribution de l’utilisateur) et seulement 10% ont des « tooltips » qui apparaissent sur demande
  • La gestion d’erreur apparaît soit par un message au sommet du formulaire (30%) soit par une accentuation du champ correspondant (29%), soit les 2 à la fois (25 %)
  • La confirmation e-mail n’est peu utilisée (18%), contrairement la confirmation de mot de passe (72 %)
  • Le message de remerciement motive les utilisateurs à poursuivre la visite du site (45 % des cas).

Vous pouvez retrouver l’intégralité des articles (en anglais), ici et .

Voilà, vous avez toutes les informations en main pour réaliser le formulaire web idéal, ou plutôt celui qui fonctionnera le mieux auprès de vos visiteurs.

Articles similaires:

Laissez un commentaire