web-dev-qa-db-fra.com

Bouton «Plus d'infos» vs Faire de la ligne entière du tableau un lien

J'ai un grand tableau (14 colonnes) sur mon site. Je veux que chaque ligne renvoie vers une page différente. Quelle est la meilleure façon de faire savoir à un utilisateur que cliquer sur une ligne le mènera à une page liée à cette ligne?

  1. Faire de la ligne entière un lien (javascript/assombrir la ligne au survol) enter image description here
  2. Ajoutez une autre colonne à l'extrême droite avec un bouton 'Plus d'infos' enter image description here J'ai peur qu'avec l'option 1, l'utilisateur ne sache pas que chaque ligne est un lien (s'il ne passe jamais sa souris sur le tableau) et avec l'option 2 le tableau devient trop encombré.
usabilityuser-expectationtableshyperlinks
5
StackOverflower

Utilisez le lien "Plus d'infos"

Je penche davantage vers l'utilisation du lien "Plus d'infos" car l'un des meilleurs chercheurs UX Luke Wroblewski mène une campagne Evident l'emporte toujours . Il fait valoir qu'il est préférable de toujours afficher et de faire des éléments d'interface utilisateur importants et évidents sur la page, plutôt que de les cacher derrière un menu ou autre chose. Je lui fais confiance car il travaille avec d'énormes volumes de données et prend des décisions très éclairées.

Plus d'infos forces/faiblesses du lien:

  • communique explicitement aux utilisateurs que cette option est disponible (c'est évident).

  • les utilisateurs sauront désormais à quoi s'attendre en cliquant sur le lien - "Plus d'infos".

  • il occupe un espace horizontal supplémentaire.

Quand ne pas utiliser le lien "Plus d'infos"

Le seul cas où je vous suggère de supprimer le lien est lorsque vous avez besoin d'espace horizontal dans le tableau pour ajouter plus de colonnes et que vos utilisateurs utilisent fréquemment l'application (quotidiennement ou au moins une fois par semaine). Les utilisateurs fréquents apprendront que cette option existe et sauront à quoi s'attendre après avoir cliqué sur le lien de la ligne.

Cependant, de cette façon, nous réduisons l'apprentissage de votre application . Si la majorité de vos utilisateurs sont des visiteurs récurrents, il peut être judicieux de sacrifier l'apprentissage pour afficher plus d'informations dans le tableau. Ce n'est pas une décision facile.

1
Kristiyan Lukanov

Quelle colonne contient l'identifiant unique le plus susceptible d'être ce que recherche l'utilisateur? Placez-le en premier et créez un hyperlien.

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

1
Eric Stoltz

D'un point de vue d'accessibilité , je recommanderais la deuxième option, c'est-à-dire en utilisant une colonne "plus d'infos". Je pense que cela facilitera la création de la table accessible au clavier (voir WCAG 2.0) .

Notez que les utilisateurs de lecteurs d'écran doivent savoir clairement où le lien dans la colonne les mènera: si vous utilisez une image pour ces liens, ils auront besoin d'une alternative textuelle (par exemple <a href="markotto.html"><img src="x.png" alt="more info on Mark Otto" /></a>). (Voir texte du lien dans les Techniques WCAG 2.0.)

Je sais que le dernier point peut être considéré comme un aspect de mise en œuvre, mais il a un impact sur l'expérience utilisateur des utilisateurs de lecteurs d'écran.

0
Tsundoku