web-dev-qa-db-fra.com

Preuve d'action de bouton et d'action de lien dans la même portée?

Lorsque j'ai commencé à connaître l'interface graphique au début des années 1990, il y avait toujours le même type de contrôle pour effectuer une action du même type, même si l'action était différente de celle de [OK] [Cancel] et [Yes] [No]. J'ai vu un autre schéma évoluer ici qui, au début, n'a aucun sens - mais plus vous y réfléchissez - plus cela a du sens.

Ici sur UX.SE, il y a la possibilité de modifier les articles, et lorsque vous modifiez et avez terminé, ou décidez de ne pas poursuivre la modification, vous avez deux options. La première action visuellement la plus visible que vous pouvez effectuer est le bouton "Enregistrer les modifications". La deuxième action est le lien "annuler" avec une lettre initiale en minuscule et beaucoup moins visible que le bouton.

enter image description here

Le raisonnement derrière cela pourrait être que l'action la plus probable serait de sauvegarder la modification - ainsi cette action est beaucoup plus importante que l'action d'annulation. Et pour éviter de laisser l'utilisateur annuler involontairement une modification - il y a une boîte de confirmation de suivi demandant à l'utilisateur d'abandonner/annuler la modification.

enter image description here

Mais c'est de la spéculation, et je n'ai aucune preuve tangible que c'est le cas. Cela semble très prometteur et j'aimerais l'utiliser dans les designs à venir - mais je veux avoir une preuve du raisonnement derrière ce nouveau modèle. S'il y a des articles, des résultats de tests ou même des recherches disponibles - je voudrais savoir.

4
Benny Skogberg

Il s'agit d'une tentative de distinction entre les actions primaires et secondaires, le but étant de rendre les actions les plus utilisées et les plus importantes faciles à trouver et à activer et à rendre les actions moins utilisées (et peut-être plus dangereuses) moins distrayantes et plus difficiles à activer par erreur .

Luke Wroblewski a fait quelques recherches sur différents modèles pour distinguer les actions primaires et secondaires . Jetez également un œil à Le poids visuel des boutons d'action primaire et secondaire .

4
Matt Obee

Bien que je sois d'accord avec la réponse de @ MattObee sur la distinction entre l'action primaire souhaitée et l'action secondaire moins accentuée , je pense qu'un point important à noter avec ce modèle ici est l'utilisation de différents éléments d'interface.

Alors que article lié dans la réponse affiche visuel (mettant en évidence l'action principale) et interactif (ne s'estompe que dans l'action secondaire après un action initiale) différenciation entre les deux actions, le sens inhérent véhiculé à l'aide d'un bouton pour le principal et d'un lien pour l'action secondaire est beaucoup plus forte.

Étant donné que save est l'action de publier ou de soumettre des informations à stocker, et l'action cancel est une simple redirection vers une autre page et n'envoie aucune information, il est parfaitement logique de utilisez un bouton pour le premier et un lien pour le second. Les réponses dans cette question sur le sens "bouton vs lien" supporte cette argumentation, ou pour citer la réponse la mieux notée:

Règle générale: un lien vous emmène à un autre endroit, un bouton fait quelque chose.

2
kontur