<C²: webløg />

Courriel - email address

Avatar Denis

dimanche 18 juillet 2004
par Denis Boudreau

De l'intérêt du bouton reset

Ce soir, je rembourse une vieille dette. Il y a très très longtemps de cela (mai 2004), katsoura me faisait parvenir un courriel dans lequel il me questionnait sur la pertinence d'un bouton reset dans nos formulaires de commentaires et de contact sur C². Son argument allait sensiblement ainsi : à quoi ça sert, ce n'est rien de plus qu'une source potentielle d'erreurs au moment de la validation, qui pourrait bien vouloir vider un formulaire après l'avoir rempli, etc. Les commentaires sur son billet allaient également en ce sens. La plupart des blogues n'en ont d'ailleurs pas non plus dans leurs formulaires et par défaut, un outil comme Dotclear ne le prend pas en charge non plus. Bref, de manière générale, la majorité d'entre nous semblont faire fi de ce champ de formulaire en remettant en cause sa pertinence.

Pour être complètement honnête, malgré le fait que je m'en serve encore, j'ai tendance à être d'accord avec eux tous. Le bouton reset semble promettre à l'utilisateur plus de frustrations que de bénéfices. Si ce n'est du fait que traditionnellement, un formulaire venait avec un bouton d'effacement et un bouton de soumission, je ne vois plus forcément de raisons valables pour les utiliser sur un carnet Web ou n'importe quel autre site n'impliquant pas un échange de données véritablement sensibles. C'est donc dire que si je prenais le temps de faire une telle mise à jour du code sur C², je considérerais peut-être de l'enlever... j'hésite encore.

Toutefois, il y a des situations dans lesquelles un tel bouton me semble nécessaire. Je pense entre autre à un formulaire de transaction lors d'achats en ligne ou lors de transmission de données personnelles sensibles, comme un numéro de carte de crédit ou un numéro d'assurance sociale. Si un utilisateur en cours de saisie décidait de changer d'idée en cours de route (indépendamment des raisons motivant un tel choix), sa meilleure garantie de ne pas transmettre des informations contre son gré demeurerait le bouton reset. On clique et hop, le formulaire se vide. On a l'esprit tranquille et on poursuit sa vie, bien peinard.

Mais dans de tels cas, le problème de l'erreur potentielle demeure entier... J'imagine la frustration d'un utilisateur qui commettrait l'erreur du mauvais clic après plusieurs minutes passées à remplir un formulaire à cause du bête erreur d'inattention. Pour contribuer à éviter un tel drame, il faudrait simplement inculquer de bonnes pratiques autour de son utilisation :

  • Le placer systématiquement à gauche du bouton de soumission ;
  • Lui donner un aspect visuel différent du bouton de soumission ;

Ainsi, facilement, on diminuerait le risque d'erreurs. Évidemment, c'est loin d'être infaillible, mais ce serait déjà moins risqué si on persistait à l'utiliser. Alors, vous en pensez quoi ? On le vire ou on le conserve ?

Denis Boudreau | 2004.07.18 @ 21:42

Alors, qu'en pensez-vous ?

Voici ce que vous aviez à en dire... vos impressions, recueillies à vif.

2004.07.19 @ 00:50 par ceam

à gauche le bouton reset ?

alors il faut penser à travailler sur le tabindex

je pense à ça par rapport à ce p****n de formulaire de login sourceforge

login -> tab -> password -> tab -> un foutu lien placé avant le bouton submit, que j'oubli une fois sur 2

Haut retour au début de la page

2004.07.19 @ 02:27 par Fred C.

'Lui donner un aspect visuel différent du bouton de soumission'

Nous parlons bien ici de boutons ? Comment faire pour lui donner un aspect visuel différent ? Est-ce que l'intitulé du bouton ne suffit pas ? Deux boutons côte à côte avec deux aspects différents ce n'est pas un peu perturbant ?

Tant qu'à laisser un bouton Reset, je suis plus partisant de ne pas altérer son aspect visuel, depuis le temps que les formulaires sont livrés avec ces deux boutons, les utilisateurs devraient y être habitué, non ?

C'est comme si tu disais 'donner à la pédale de frein un aspect visuel différent de la pédale d'accélerateur'. Je suis un fervent partisant de la conception orientée utilisateurs et de l'ergonomie, mais bon, s'ils ne savent pas conduirent, je ne peux rien pour eux !

Haut retour au début de la page

2004.07.19 @ 02:44 par Sylvain Lelièvre

Et quid d'un petit javascript qui afficherait une boîte de confirmation ?
En codant proprement bien sûr, histoire que si le javascript est désactivé, le bouton se comporte comme par défaut, en vidant simplement le formulaire.

Haut retour au début de la page

2004.07.19 @ 03:04 par Eric Daspet

Je pense que la question est posée parce qu'il y mauvaise compréhension. Ce fameux bouton reset n'est pas là pour vider le formulaire, mais pour le remettre à zéro. La différence est importante pour les formulaire qui ontdes valeurs par défaut. Il ne s'agit pas alors de tout vider comme un utilisateur pourrait le faire mais de remettre les valeurs initiales ... et pour ça l'utilisateur a besoin du bouton s'il ne veut pas recharger la page (ce qui pose d'autres problèmes) ou lire le code source de la page.

Pour les formulaire de commentaires ici ce n'est peut être pas nécessaire. Pour des formulaires complexes c'est indispensable. Imaginer un gros formulaire où on vous demande de faire des modifications, vous venez de toucher par erreur à une case, comment la remettre comme il faut ?
J'ose même avancer qu'en plus du bouton reset il faudrait un menu contextuel sur chaque champ pour permettre de le remettre à zéro.

Haut retour au début de la page

2004.07.19 @ 03:55 par Yann Kerhervé

Je plussois Eric, imaginez que vous gérez vos impôts en ligne, ou bien que vous modifier votre profil sous orkut, ou encore votre CV... Revenir à l'état initial est indispensable - surtout pour les internautes débutants qui n'ont pas conscience de la nature 'stateless' de HTTP et qui imaginent que leur saisie est déjà sur le serveur.

En fait, je me demande dans quelle mesure le bouton reset - ou plus précisement la fonction qu'il remplit ne devrait pas être la tâche du navigateur.

Eric avance l'idée d'un reset sur chaque champ... C'est quand même plus facile d'implémenter ce comportement dans firefox que dans les formulaires du monde entier (à grand coup de javascript), non ?
C'est même plus logique : c'est de la même veine que les enregistrements de formulaire ou les sauvegardes de mots de passe... Par contre ça sert une fois tous les jamais et quand ca pourrait servir, on oublie que c'est là ;)

Haut retour au début de la page

2004.07.19 @ 08:36 par Michael

De mon côté, je doute beaucoup de l'utilité d'une telle fonction; elle peut trop facilement amener des erreurs de l'utilisateur et lui faire perdre toute ses informations entrées à la sueur de son clavier.

Permettez-moi d'être en désaccord avec la comparaison que fait Fred C.. La pédale de frein est nécessaire à la bonne conduite d'une voiture; le bouton Reset n'est pas nécessaire à l'utilisation d'un formulaire. Fin de la parenthèse.

Pour avoir eu la chance d'observer en tant que professionnel des utilisateurs lors de tests, je l'affirme haut et fort: oui, le bouton Reset amène plus de problèmes que de bénéfices.

Dans le pire des cas, je suggère de placer un mécanisme de validation après l'emploi dusdit bouton. Ainsi, un utilisateur distrait (ca existe, je suis certain que ca existe!) pourra reprendre ses esprit avant de vider par inadvertance son long et précieux formulaire. Après tout, bien que l'applicatif soit différent du Web, les confirmations sont monnaie courante lors d'effacement de blocs d'informations importants et sans retour en arrière possible. Pour les utilisations sur un site comprenant des données nominatives importantes, bancaires ou de nature très personnelle, ce type de mécanisme serait en effet utile, avec un garde-fou.

Pour un formulaire relativement court, ne comportant pas de données sensibles, le bouton Reset est définitivement une nuisance.

My two cents... :)

Michael

Haut retour au début de la page

2004.07.19 @ 09:41 par Olivier

Mon opinion : supprimer le bouton 'Effacer', et remplacer les liens 'Abandonner' et 'Soumettre' par des boutons, transformer 'Abandonner' par 'Modifier', et enlever le formulaire de modification de la page de prévisualisation.

Haut retour au début de la page

2004.07.19 @ 10:47 par Eric Daspet

Tiens, on dévie beaucoup mais quand j'y pense : ma pédale de frein a toujours eu un aspect différent de ma pédale d'accélérateur (sisi). Comme quoi ...
Ceci dit je suis d'accord avec Olivier. Ici le bouton reset (effacer) ne sert pas vraiment, un bête lien 'abandonner' serait (ici) plus naturel (même si inutile du point de vue HTTP/applicatif, ça peut aider les gens à ne pas se poser de questions)

Haut retour au début de la page

2004.07.19 @ 11:09 par Olivier

Il paraîtrait que Larry Ellison, le PDG d'Oracle, qui est parfois plus riche que Bill Gates, a des autocallants verts et rouges sur chaque bouton de sa souris Windows lors de ses démos.

Haut retour au début de la page

2004.07.22 @ 02:33 par turnover

Je suis du même avis qu'Eric Daspet sur les gros formulaires.
J'ajouterai en plus que les boutons sont, sur certains navigateurs, toujours identiques et non tranformables par une feuille de style.
Non non, je citerai pas de nom ...

Haut retour au début de la page

2004.07.22 @ 16:06 par ism

C'est vrai qu'il fait peur ce bouton reset.

Et s'il ne pouvait être qu'actif avec l'appuie de la barre d'espace ?
Comme ça, quasiment pas de fautes de clique possible, on peut ainsi aisément 'tomber' sur le milieu du clavier et être réactif.
Je dirais enfin, peut-être en chipotant, quoique, que cela donnera une autre manière de voir la navigation dans une page web pour les développeurs introduisant ainsi une couche d'accessibilité (pour ceux-ci).

Je sais, ça ferait penser à du javascript tout ça...

Haut retour au début de la page

2004.07.22 @ 22:36 par Patrice Levesque

Ne suffirait-il pas de placer le bouton 'Reset' tout au haut du formulaire, en incluant un rappel textuel près du bouton 'Submit'? Activer 'Reset' au début de l'entrée de données n'amène pas de catastrophe; de même, si quelqu'un veut effacer le formulaire pour recommencer, il se trouvera déjà tout près du premier champ à remplir.

Le problème du bouton 'Reset' ne m'apparaît pas idéologique mais spatial - il dérange parce qu'on l'active par inadvertance.

Haut retour au début de la page

2004.07.24 @ 20:34 par katsoura

En faisant la comparaison avec les pédales de voiture, cela pose toute la question de la limite. A partir de quel moment on estime (nous webmaster) que c'est connu de la plupart des visiteurs ? On est tous d'accord (enfin je l'espère) qu'un mot qui réagit au passage de la souris et qui se transforme en une petite main a de très forte chance pour être considéré comme un lien. Un bouton Reset est-il toujours aussi évident pour tous ? Tout dépend, me direz-vous, du public cible. Mais l'accessibilité ne vise-t-elle pas tout le monde ? Aussi bien une personne qui arrive par hasard sur un site technique que les habitués. Qui peut le plus peut le moins.

Dans son article sur les formulaires plus faciles ( http://www.fredcavazza.ne... ) Fred propose toute une série de petits plus qui améliorent l'utilisation d'un formulaire. Mais certaines observations me semble parfois assez limite. Par exemple le fait d'ajouter une petite main sur le libellé (label) pour indiquer qu'il est possible de positionner le curseur dans le champ qui lui correspond. Bon, ça c'est quand on le sait. Mais je pense que pour un débutant, il aura plutôt tendance à croire qu'il s'agit d'un lien qui va le diriger quelque part. Mais l'info bulle est là pour l'aider pardi! Très juste mais que faut-il mettre alors ? 'Cliquez pour positionner votre curseur dans le champ approprié' ou 'Remplissez le champ de votre nom complet' ?

Je pense qu'on est parfois loin de savoir comment réagit la plupart des visiteurs en partie à cause de notre expérience. La meilleure méthode c'est de les observer surfer et utiliser un formulaire.

Au niveau de la compréhension, la grande majorité aura compris qu'il s'agit d'effacer les données encodées. Mais ne répete-t-on jamais assez que le visiteur est une personne pressée ? Qui dit pressée dit distraite. Et c'est là qu'est le problème. Il se précipite pour remplir les données, alors que la pizza commence à trop cuire, le fiston qui pleurniche, le téléphone sonne ou l'envie d'en finir tout simplement. Et voilà, on clique évidemment sur le mauvais bouton ! La pizza n'attendra pas plus longtemps et on ferme le site frustré et quelque part ennervé que ça ne marche jamais correctement.

L'alternative de la confirmation est une excellente idée. N'est-il pas monnaie courante dans un OS comme Windows de se trouver face à une confirmation quand on delete quelque chose ? Pourquoi ne pas appliquer ce principe de prudence pour les formulaires.

Haut retour au début de la page

2004.07.24 @ 22:47 par Olivier

'Reset: Don't Use' - Jakob Nielsen
http://www.useit.com/aler...

Haut retour au début de la page

2004.07.25 @ 11:05 par Leif Thande

'The extra choice requires extra thinking, and the time saved by using an optimal interaction technique is often smaller than the time wasted on having to think instead of just moving ahead with a single interaction technique that is always used. (A second may not seem like much, but it translates into about $100 million in lost productivity per year world-wide.)'

mdr

Sérieusement, le bouton reset est très rarement utile et il n'est pas rare que l'on clique dessus par erreur ( même moi après plusieurs années de surf intensif ). L'implémentation d'une boite de confirmation me parait une solution dans le cas ou le dit bouton reset est utile.

Pour ce qui est du bouton Effacer de ce formulaire il est très mal situé et même inutile. J'utiliserais une dispostion plus classique avec des boutons 'Envoyer' et 'Prévisualiser'. Le fait de devoir passer par la prévisualisation est un peu déroutant au premier abord. De toute évidence, le bouton Effacer devrait être situé À DROITE.

Leif-

Haut retour au début de la page

2004.07.26 @ 22:40 par Olivier

Leif :

> De toute évidence, le bouton Effacer devrait être situé à DROITE.

C'est délicat. Sur Windows, le Cancel est à gauche, sur Mac il est à droite. Sur Windows 3.1 je crois qu'il était à droite, Microsoft a ensuite changé d'avis, et il y a quand même plus de 2% de la population qui utilisent des Macs, dont Tim Berners-Lee et Jeffrey Zeldman. ;-)

Haut retour au début de la page

2004.08.06 @ 14:24 par Dobermann

Sur Mac, le Cancel est à gauche du bouton OK qui est mis en valeur par un style différent (bleu sur OS X, bordure doublée sur OS <9) ;-)

Haut retour au début de la page

2004.08.06 @ 15:21 par Olivier

Oui, c'est le contraire de ce que j'ai dit : sur Windows, c'est Cancel à droite, sur Mac c'est Cancel à gauche.

http://developer.apple.co...

Je trouve que c'est mieux à gauche, CYBERcodeur a fait le bon choix, ça fait plus penser à 'revenir en arrière', à droite c'est plus pour 'aller de l'avant' (aucune allusion politique).

Après, reste la question de savoir où grouper les boutons : à gauche, au milieu, à droite ?

Haut retour au début de la page

2004.08.06 @ 18:10 par Denis

En fait c'est exactement ce que j'avais en tête en écrivant ce billet et en codant ce formulaire au départ. càCognitivement, le fait de mettre le bouton de soumission à droite évoque la progression dans l'action de commenter tandis que le bouton effacer fait plus référence à retourner vers l'arrière, à reculer.

Haut retour au début de la page

2004.08.25 @ 05:41 par GoldoRaF

Désolé d'être en retard, mais il se trouve que je me pose actuellement la même question dans le développement d'une appli web complexe. Et en fait j'ai eu une idée toute simple : remplacer les tags input de type submit et reset par des tags button. En effet, l'emploi de ce tag permet d'ajouter une image à l'intérieur du bouton en plus de son libellé. Ainsi, le bouton de soumission est agrémenté d'un joli V vert et le bouton effacer d'une jolie croix rouge. Je pense que cette aide visuelle devrait suffire à éviter les erreurs. Suis-je à côté de la plaque ou bien ? Y'a t-il des contre-indications à l'emploi du tag button ?

Haut retour au début de la page

Les commentaires et trackbacks sont désormais fermés. Pour toute remarque, vous pouvez toujours nous contacter.

Pisteur (Trackback)

Carnet: De l'intérêt du bouton reset
Extrait: A lire: discussion intéressante sur CYBERcodeur.net de l'int...
Weblog: fplanque: dev blog
Traqué le: 2004.07.29 @ 13:45