Navigation

Nicolas Catherin

UX designer senior

Free eBook: accessibility and design for web form

[This content is in french] [Originally published on Clever Age website, in february 2011] [co-writed with Vincent Valentin]

 

Les formulaires web sont encore et souvent négligés, parfois recouverts d’une couche graphique plus néfaste que pratique, et rarement considérés comme un puissant levier de transformation qu’il s’agisse de produit, de service ou d’information. Ce livre blanc a pour ambition de traiter cette problématique de complétion que l’on retrouve associée à chaque formulaire au travers d’une vision croisée entre accessibilité, ergonomie et esthétique.

Télécharger le livre blanc

 

Ils sont partout ! Du moindre champ de recherche au tunnel de commande, les formulaires occupent une majeure partie des interactions que les sites Internet offrent à vos doigts agiles. Mieux encore, ils vous garantissent l’accès à l’information recherchée, et heureusement, vu le temps que vous leur consacrez !

Mais parfois, c’est le drame. D’abord vous vous retrouvez à remplir une interminable série d’ennuyeuses zones blanches qui frôlent régulièrement la curiosité mal placée. On vous impose d’accoler vos yeux à quelques centimètres de l’écran ou de suivre certaines lignes avec les doigts pour être certain de renseigner les bonnes informations au bon endroit. Les requêtes ne sont pas toujours claires : ici, l’on vous demande un département et vous pouvez saisir cinq chiffres : s’agit-il sérieusement du code postal ?

Toutes ces épreuves accomplies, c’est fièrement que vous cherchez le sacro-saint bouton d’envoi… Mais où est-il ? Ah oui, dans le coin inférieur droit de votre écran. Il s’en est fallu de peu que vous ne le ratiez. Vous cliquez, soulagé, vous avez réussi…

Et non : les lignes sont gorgées de rouge, toutes ou presque, les informations semblent obligatoires. Vous ne le saviez pas ? Bon retour à la case départ !

Dans l’idée d’épargner tout ceci à vos utilisateurs, ce livre blanc vous apportera les briques essentielles à la bonne conception de vos formulaires à travers le plan d’étude suivant :

  • Présentation et personnalisation des éléments
    • les éléments natifs pré-HTML5 ;
    • les limites de la personnalisation ;
    • HTML5 : apports et limites.
  • Ergonomie et bonnes pratiques
    • l’objectif est la complétion ;
    • aligner le couple label / champ ;
    • longueur de champ et « affordance » ;
    • hiérarchisation des actions ;
    • indiquer le caractère obligatoire (ou non) des champs ;
    • gérer le feedback utilisateur.

 

 

Télécharger le livre blanc