web-dev-qa-db-fra.com

Meilleur formatage (alignement) pour une liste de faits

Dans une application (bien que ce qui suit s'applique bien à un rapport), il y aura un panneau qui affiche une liste de diverses statistiques ou faits, de cette forme générale: "Category: data". Ainsi, par exemple:

Date depuis le dernier examen: 15 juin 2009.

Mon problème est que je voudrais afficher environ 10 à 20 de ces statistiques/faits dans le panneau, un fait par ligne/ligne, d'une manière qui semble la meilleure (la plus nette, la plus propre). Mais, comme j'ai commencé à le faire, j'ai réalisé qu'il y avait un certain nombre de choix sur la façon d'aligner les mots:

  • Alignez uniquement le début de chaque catégorie.
  • Alignez chaque deux-points et le début de chaque donnée uniquement.
  • Alignez le début de chaque catégorie et alignez également chaque deux-points et le début de chaque donnée
  • Etc...

Ce qui est important à noter est que la longueur totale de chaque ligne - nom de catégorie + deux points + données - variera, parfois pas mal. Par conséquent, chacun de ces choix d'alignement a un aspect différent, mais aucun d'eux ne fournit une liste de statistiques qui semble particulièrement agréablement équilibrée.

À titre d'exemple, voyez cette image:

enter image description here

Gardez à l'esprit, dans cet exemple, que toutes les catégories sauf la dernière ("Moyenne du tournant du siècle") sont également longues, mais avec ma liste actuelle de catégories, les longueurs varieront partout et produiront un "bord irrégulier" regardez la liste. Pour l'instant, cela n'a pas l'air soigné.

Ma question est: quelle est la "meilleure" façon d'aligner les choses? Existe-t-il une norme? Ou bien, existe-t-il une meilleure façon de présenter ce type de données?

5
Chelonian

S'il s'agit de votre contenu réel, vous devez modifier 2 choses dans la copie:

  1. Annuel au lieu de annuel (sonne juste mieux).
  2. Centenaire au lieu de début du siècle parce que début du siècle ne signifie pas une durée précise mais '00 +/- 5 ans .

Avec ces modifications, la largeur de la colonne de gauche sera plus uniforme.

Maintenant, en termes de règles de mise en page, elles sont les mêmes que pour les formulaires car vous disposez des étiquettes et des champs correspondants:

  • assurez-vous que la distance entre les colonnes est gérable (comme le n ° 1);
  • ne pas aligner à droite le texte de gauche à droite lorsqu'il occupe plusieurs colonnes (comme le n ° 2);
  • n'introduisez pas de lignes vides à cause du texte coupé (comme le n ° 2).

Les versions n ° 3 et 4 sont toutes deux utilisables mais dépendent de l'intention. Extrapoler à partir de analyse des formulaires par LukeW , le n ° 3 est meilleur lorsque les utilisateurs ont besoin de rechercher des valeurs périphériques et le n ° 4 est meilleur pour numériser les étiquettes.

5
dnbrv