web-dev-qa-db-fra.com

Tailles de bouton recommandées sur les pages Web

Quelles sont les directives d'utilisation actuelles concernant la taille des boutons (ou quoi que ce soit cliquable) sur les pages Web?

buttonscsshtmlusability
8
Tony the Pony

il n'y a pas de directives "officielles" pour cela, donc je recommanderais simplement de jeter un œil à certains sites célèbres. prenons SO comme exemple - ce ne serait pas si populaire sans:

  • une interface utilisateur bonne, facile à utiliser et facile à comprendre
  • le menu principal ne comprend que quelques points, donc personne ne se confond
  • les boutons sont gros, donc ils sont faciles à cliquer, mais pas trop gros (ils ne vous obligent pas à déplacer votre souris trop loin)
  • la taille de la police est agréable, un peu plus haute que le texte normal pour être apparente et avec un bon contraste avec l'arrière-plan pour une lecture facile sans vous blesser les yeux
  • le site lui-même est clair et lumineux, le texte est noir sur blanc (bon contraste encore une fois, pour beaucoup de texte c'est mieux que sur du noir (à mon avis))

pour plus d'informations, vous pouvez demander à google interface ergonomique et jeter un oeil à this (ce n'est pas spécifique aux sites web/webapps, mais de bons points quand même)

4
oezi

Quelqu'un a posé une question sur la taille des éléments cliquables et personne n'a mentionné la loi de Fitts?

http://en.wikipedia.org/wiki/Fitts_law

http://particletree.com/features/visualizing-fittss-law/

Toutes les autres considérations mises à part, la loi de Fitts dit (approximativement) "Plus c'est gros, mieux c'est, mais vous obtiendrez plus de rendement en passant du petit au moyen qu'au moyen au grand.)

4
edeverett

Aussi grand que possible. Plus un élément cliquable est grand, plus il est facile de cliquer dessus.

Il y a bien sûr d'autres facteurs qui entrent en conflit avec cela, comme le fait que vous voulez avoir de la place pour autre chose que de simples boutons ...

3
Guffa

Une chose à considérer est de savoir si vous viserez à ajouter des capacités tactiles à votre site. Si oui, c'est un facteur à prendre en considération. Sur un appareil tactile, vous voudrez plus d'espace entre les boutons et, idéalement, des boutons plus grands (ou au moins des zones cibles plus grandes)

2
DA01

SI vous souhaitez suivre les directives de Windows UX, il existe en effet des directives pour la taille du bouton. Cela peut être répliqué sur des applications Web. Mais je ne sais pas si vous le feriez pour les pages Web. 23px est ce que disent les directives Windows UX

1
Abhijeet

Je viens de recevoir une version de démonstration dotée d'un bouton de paiement dans un coin arrondi qui s'étend sur toute la largeur de l'écran. Au-delà de dire que cela semble un peu condescendant, je ne peux pas vraiment sauvegarder mon opinion avec des données.

Quelle taille est trop grande pour un bouton de bureau?

J'espère que je serai en mesure de parvenir à un compromis avec le développeur en utilisant la cohérence de la taille des boutons sur le site comme argument. Les doigts croisés, je peux en faire un tiers de la taille, mais en le fixant sur le défilement, il est donc toujours à portée de main.

Difficile de garder le look premium d'une marque digne de confiance avec des boutons qui ressemblent à "un jeu d'enfant"

0
Paul Giles