web-dev-qa-db-fra.com

Amélioration de la lisibilité en alignant les éléments en rangées

Quelle est la meilleure façon d'améliorer la lisibilité, lorsque vous avez des éléments qui changent de longueur comme un nom qui déplace d'autres éléments, créant un désalignement enter image description here

3
ghislaineguerin

Le fait de disposer les données en colonnes (dans une grille) les rend plus lisibles.

  1. L'utilisateur peut parcourir les colonnes à la recherche des données souhaitées sans avoir à rechercher les informations sur chaque ligne.

  2. Si vous utilisez un contrôle de grille, vous pouvez introduire le tri et le filtrage des données, permettant à l'utilisateur beaucoup plus de contrôle sur les informations affichées et leur mode d'affichage - vous pourriez même être en mesure de permettre de modifier l'ordre d'affichage et la visibilité des colonnes.

Il y a une limite à la quantité de données tabulaires auxquelles les gens peuvent faire face, mais vous pouvez contourner cela en autorisant la pagination de vos données afin de ne présenter que 10, 25, 50 (ou quoi que ce soit) lignes de données à la fois.

5
ChrisF

Il y a des avantages et des inconvénients qui peuvent dépendre des circonstances ...

  • L'alignement des données crée des colonnes, les colonnes peuvent avoir des titres et avoir des séparateurs entre elles.

    • Cela permet un balayage visuel rapide pour une valeur d'une certaine colonne

    • Vous pouvez permettre aux utilisateurs de masquer les colonnes, de trier les lignes par valeurs de colonne et de filtrer les lignes par valeurs de colonne

    • Cela convient lorsque la différence maximale de longueur des données dans chaque colonne n'est pas très longue, sinon:

      • Vous vous retrouverez avec beaucoup d'espace blanc et aurez besoin d'alterner les styles de lignes ou les séparateurs horizontaux pour faciliter le suivi d'une ligne de bout en bout.

      • Vous pouvez vous retrouver avec une table extrêmement large (en raison de l'espace blanc ajouté)
        Cela peut être résolu en créant des lignes à plusieurs lignes où les différentes colonnes sont divisées en lignes (comme la vue compacte d'Outlook)

    • La division en colonnes ne convient que si les types de valeurs et leur ordre sont constants le long des lignes.

1
Danny Varod