Quels boutons pour un formulaire / assistant : La réponse

Après un précédent billet posté pour m’aider à me décider sur la meilleure façon de mettre en forme les boutons d’un formulaire contenant plusieurs étapes, je vous livre les résultats de ce mini-sondage : une large majorité ont voté pour la solution B (avec deux flèche « < Précédent » et « Suivant >« ). Effectivement, c’est celle qui présente la solution la plus claire et qui laisse le plus de contrôle aux utilisateurs.

Et pourtant, ce n’est pas la solution que je vais retenir. Mon choix va plus s’orienter sur une nouvelle version de la solution A :

Bouton-formulaire

 

Plusieurs explications à cela :

  • Nous sommes dans le cas d’un formulaire guidé et non d’un assistant (pour plus d’explications entre ces 2 notions, voir le très bon article à ce sujet de Bob Baxley : Wizards and Guides, Principles of Task Flow for Web Applications) ;
  • L’objectif premier est de faire progresser les utilisateurs dans les étapes tout en minimisant le nombre d’aller / retour avec le serveur ;
  • Les étapes seront clairement affichées en haut du formulaire ;
  • A chacune des étapes, un contrôle de surface est effectué et les données sont enregistrées ;
  • Une dernière étape de récapitulation demandera aux utilisateurs de vérifier et valider leurs données, sinon de revenir en arrière et de corriger certaines étapes ;
  • Le bouton « Annuler » a été remplacé par 2 liens exprimés sous forme de questions qui permettent d’abandonner le formulaire ou de sauvegarder les données ;

Pour toutes ces raisons, je pense que cette nouvelle solution A est la plus appropriée car elle sera moins source d’erreurs et de fausses manipulations. Attention, cela ne veut absolument pas dire que la solution B n’est pas pertinente, au contraire ! C’est juste qu’elle n’est pas la plus adaptée à ce contexte précis.

Merci encore à tout ceux qui ont pris le temps de donner leur avis, cela m’a permis de pouvoir trancher et d’opter pour une solution qui présente le meilleur compromis incitation / utilisabilité (au passage, je m’étais plus orienté vers la solution D). Au vue de la qualité des commentaires, je pense que je vais vous solliciter plus souvent !

MAJ (18/01/05) : Visiblement je ne suis pas le seul à me poser des questions : Web Application Form Layout.

Un commentaire sur “Quels boutons pour un formulaire / assistant : La réponse

  1. Bonjour, La solution que tu proposes est sans aucun doute intéressante, mais je lui trouve deux petits défauts :
    – La proximité des liens « Abandonner » et « Enregistrer ». Si l’utilisateur veut enregistrer et clique par erreur (précipitation, maladresse… comme ça nous arrive tous de temps en temps) sur « Abandonner », il sera pas mal frustré, surtout si le formulaire est long. Cf. Loi de Fitts
    – Les ? sont ambigus. Les proposés correspondent à une action qui va avoir lieu effectivement, comme un bouton « Envoyer » par exemple. Même si on comprend que le lien sous-entend « Voulez-vous abandonner ? », le ? donne une drôle d’impression et on se demande finallement quel sera le résultat. Sinon, question que je me pose : le lien « Enregistrer » amène-t-il sur un feedback particulier ou juste un refresh de la page ? (il faudrait un feedback je pense). Et aussi expliquer à l’utilisateur qu’il aura l’occasion de modifier les infos saisies à la fin.
    En tout cas c’est intéressant cette conception participative :D

  2. Les 2 liens sont effectivement rapprochés mais ils ne provoquent pas une action. Ils mènent à une page de confirmation où l’on va bien expliquer aux utilisateurs ce qui va leur arriver (dépôt d’un cookie…). L’utilisation du « ? » est donc de rigueur puisque c’est une vraie question et puisque qu’un clic maladroit n’entraîne aucune conséquence.
    /Fred

  3. Il faudrait peut être indiquer que les informations entrées seront modifiable à la fin des étapes après vérification nan ? Parceque je m’imagine bien remplir ce genre de formulaire, passer les étapes, et me rendre compte que je me suis planté à la question 2, ou que j’ai omis une informations, je serais vraiment très frustré de ne pas pouvoir utiliser un bouton précédent, pensant ne pas pouvoir revenir en arrière, je serais tenté de recommencer la manipulation. Ainsi une petite précision sur la possibilité de modifier les informations entrées serait un plus quasi indispensable à mon goût. Sympa cette petite réflexion sur les solutions envisageable pour un tel formulaire et la solution finalement adoptée. @+ / Olivier

  4. Indiquer que les informations entrées seront modifiable à la fin des étapes, hum… très intéressant, je vais y réfléchir… reste à trouver une formulation adéquate.
    /Fred

  5. J’appuie lourdement la remarque d’Olivier ! En voyant ce nouveau formulaire, ma première pensée est qu’on ne me laisse pas de droit à l’erreur… Et qu’on veut un peu trop déterminer mon cheminement, du moins à mon goût. Et puis (mais c’est sans doute tout à fait justifié dans le contexte de ce formulaire), le « enregistrer pour plus tard » me fait toujours pousser un gros soupir de lassitude : encore un identifiant et un mot de passe temporaires dont il faudra que je garde trace…Comme si je n’en avais pas déjà trop, des identifiants et des mots de passe.

  6. Oui oui je sais, cette solution n’est pas encore la solution parfaite. De toute façon, si je connaissais une solution idéale qui corresponde à toutes les solutions, je n’aurais pas sollicité mon lectorat !
    Mais bon, il faut bien faire un choix, et le mien c’est arrêté sur cette solution. concernant le lien « enregistrer pour plus tard », en fait il s’agit d’une sauvegarde par cookie, donc pas de mot de passe. Encore faut-il l’expliquer clairement dans un écran…
    /Fred

  7. evidemment, j’ai eu un doute : Fred Cavazza doit surement contribuer à l’excellent projet Opquast ! C’etait évident, et c’est vérifié… honte a moi d’avoir cliqué si vite… Si tu le souhaites, tu peux modifier ou effacer mon précédent commentaire…

  8. Mais non Stéphane, pas de honte à avoir. En fait ma contribution au projet Opquast est plus que mimine. Mais je ferais mieux la prochaine fois, pour la prochaine version…
    /Fred

Laisser un commentaire