web-dev-qa-db-fra.com

Informer l'utilisateur de son action en cliquant sur une colonne du tableau

Une table a une ligne d'en-tête, qui indique à l'utilisateur la signification de la colonne, comme Google file la table a name, id, mime type, created et modified date.

Mais, en plus de présenter des informations dans le tableau, je voulais que l'utilisateur puisse effectuer certaines actions sur les objets de ligne: ouvrir le fichier par exemple, ou le renommer, ou en faire une copie. Il est très pratique de le faire par simple clic si vous cliquez sur une colonne, vous ouvrez le fichier, si vous cliquez sur la colonne de nom, le nom devient modifiable, par exemple, etc. C'est beaucoup plus pratique que de fournir un bouton de menu pour chaque ligne, qui doit être ouvert avec des clics supplémentaires.

Une autre option serait d'ajouter des colonnes "d'action" supplémentaires à chaque ligne, le menu dans le formulaire prêt à déplier, qui permet les actions en un seul clic mais prend beaucoup d'espace, à défaut de tenir le tableau dans l'écran utilisateur.

C'est pourquoi j'ai tendance à utiliser les colonnes à double usage - il affiche un attribut de la ligne/de l'objet mais fait une action non liée lorsque vous cliquez dessus. Comment dites-vous à l'utilisateur ce qui va se passer quand il clique sur la cellule? Infobulles au survol de la souris?

1
Little Alien

En général, évitez les actions qui sont appelées simplement en cliquant sur une valeur de cellule, car ce sont des actions cachées qui ne seront pas claires.

Pour moi, la seule chose qui serait intuitive est de cliquer sur une cellule pour obtenir plus de détails sur cette cellule, car il s'agit d'un paradigme d'exploration en ligne standard. Tant que la valeur de la cellule est clairement un lien, cela fonctionnera.

Mais il n'est pas évident, par exemple, qu'un tableau sur un site Web soit modifiable en cliquant sur une valeur. Et d'autres actions seront moins évidentes.

Je pense que vous avez quelques options ici.

Affichez des icônes à côté de la valeur de la cellule pour signifier des actions telles que l'édition. Par exemple, une icône de crayon pour l'édition.

mockup

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

Si vous avez plusieurs options associées à une cellule, ou si vous ne voulez tout simplement pas que le tableau soit encombré, vous pouvez faire apparaître ces icônes uniquement lorsque vous passez la souris.

Si l'édition est très courante, vous pouvez rendre les cellules toujours modifiables et communiquer cela en faisant du tableau une grille semblable à une feuille de calcul en apparence, ou en en faisant des éléments.

Cela ne semblera pas aussi agréable à lire, mais si l'édition est la tâche principale, cela facilitera les choses.

0
user31143