web-dev-qa-db-fra.com

Pourquoi les valeurs de l'axe X du graphique sont-elles inclinées de bas en haut pour les étiquettes longues?

Tout le monde sait pourquoi, lorsque nous avons besoin de valeurs inclinées sur l'axe des x, par exemple pour un graphique à barres, pourquoi les valeurs inclinées sont toujours de gauche à droite, de bas en haut (comme dans l'image), au lieu d'être affichées de haut en bas?

**enter image description here**

2
sarasampaioproject

Dans l'ouest, les langues sont souvent lues de gauche à droite.

Examinons d'abord l'alternative. Si les étiquettes du graphique étaient de haut en bas et de gauche à droite, vous liriez l'étiquette et la dernière lettre de l'étiquette suspendrait le prochain (mauvais) ensemble de données. Cela n'a pas beaucoup de sens si les gens lisent d'abord les étiquettes et regardent ensuite les données correspondantes.

Lorsque vous utilisez la méthode que vous démontrez (gauche-droite, bas-haut), nous lisons d'abord l'étiquette et nous nous retrouvons avec les données correspondantes après la dernière lettre de l'étiquette.

Cela peut donc dépendre du fait que les gens lisent habituellement l'étiquette en premier ou non, mais c'est une question entièrement différente.

4
RobbyReindeer

TL; DR

Lecture la compréhension n'est probablement pas le facteur clé. Ce qui importe est de savoir si "l'utilisation prévue" du graphique (ou du tableau) va de le label à le graphique/tableau ou vice versa:

  • Si vous passez de l'étiquette au graphique/tableau, vous voulez que le fin du texte à côté de la colonne correspondante dans le graphique/tableau.

  • Si vous passez d'un graphique/tableau à une étiquette, vous voulez que le début du texte à côté de la colonne correspondante dans le graphique/tableau.

Le graphique de l'OP est un exemple de la première option (les étiquettes mènent aux barres correspondantes).

Remarque : ces "règles" signifient que la direction "préférée" de l'inclinaison (pour un cas d'utilisation donné) est inversée si les étiquettes sont ci-dessus les données (généralement, un graphique est étiqueté en bas; un tableau est étiqueté en haut).

Les options

En supposant que vous conservez l'orientation de base du graphique, il existe cinq façons d'organiser les étiquettes:

  1. Incliné, en bas à gauche à en haut à droite (comme dans la question). Vous inclinez la tête vers la gauche pour lire.
  2. Incliné, en haut à gauche à en bas à droite. Vous inclinez la tête vers la droite pour lire.
  3. Vertical, de bas en haut. Version extrême de (1).
  4. Vertical, de haut en bas. Version extrême de (2).
  5. Empilés. Les lettres sont dans leur orientation "normale", mais l'une au-dessus de la suivante (également connue sous le nom Marquee text).

Alors, lequel (le cas échéant) est "le meilleur", et qu'est-ce qui affecte cette décision?

Remarque : bien que la question parle de l'étiquetage d'un graphique à barres, des arguments similaires s'appliqueront à l'étiquetage d'un tableau (par exemple cet exemple ).

Rejeter le texte empilé/de sélection (option 5)

Le plus simple à ignorer est le dernier: texte empilé ou texte de sélection. Toutes les références que j'ai vues disent que c'est le plus difficile à lire. Par exemple, l'étude Reading Vertical Text: Rotated vs. Marquee [pdf] a révélé que le texte du texte de sélection est plus lent à lire que l'orientation verticale (et que les trois sont plus lents à lire que le texte horizontal normal):

Une expérience a été menée pour enquêter et a révélé que le texte de sélection est en effet lu plus lentement que le texte pivoté et que le texte pivoté est lu plus lentement que le texte horizontal standard

Conclusion : le texte empilé doit être conservé pour les "occasions spéciales" telles que enseignes d'hôtel .

Texte vertical: de bas en haut ou de haut en bas (options 3 et 4)

La même étude note que l'orientation du texte vertical n'a fait aucune différence:

Cependant, aucune preuve n'a été trouvée pour une différence entre le texte tourné à gauche et à droite.

Ailleurs sur UX, ne réponse à " Le texte tourné dans le sens horaire ou antihoraire est-il plus facile à lire?" est également d'avis que ni l'un ni l'autre n'est plus facile à lire que l'autre, mais cite un article Wikipedia sur le titrage de la colonne vertébrale indiquant que - au moins en ce qui concerne les livres - l'orientation "conventionnelle" dépend de la géographie:

  • Aux États-Unis, dans le Commonwealth, en Scandinavie et pour les livres en néerlandais, les titres sont généralement écrits de haut en bas sur la colonne vertébrale. Cela signifie que lorsque le livre est placé sur une table avec la couverture avant vers le haut, le titre est orienté de gauche à droite sur la colonne vertébrale. Cette pratique est reflétée dans les normes industrielles ANSI/NISO Z39.41 [39] et ISO 6357.

  • Dans la plupart des pays d'Europe continentale et d'Amérique latine, les titres sont conventionnellement imprimés de bas en haut sur la colonne vertébrale.Ainsi, lorsque les livres sont placés verticalement sur des étagères, le titre peut être lu en inclinant la tête vers la gauche. Cela permet au lecteur de lire les épines des livres classés par ordre alphabétique conformément à la manière habituelle de gauche à droite et de haut en bas.

Cependant, un commentaire sur le Danthonia Designs Blog, " Dans quelle direction le texte vertical devrait-il aller?" indique:

Dans le dessin conventionnel, où les dessins de construction étaient liés sur le dos gauche, le texte vertical était TOUJOURS exécuté "de bas en haut", le lisant de gauche à droite lorsque le dessin était tourné de 90 ° avec le bord lié en haut.

Bien que cela aide expliquer une convention, cela ne suggère pas que l'une ou l'autre direction soit mieux que l'autre (au moins sur un écran d'ordinateur).

Conclusion : Le texte vertical est préférable au texte empilé, mais - en ce qui concerne la facilité de lecture - il n'y a rien (autre que la convention locale) à choisir entre options (3) ou (4). (Mais voir " En bas à gauche à en haut à droite ou en haut à gauche à en bas à droite" ci-dessous pour une facilité d'utilisation globale).

Pourquoi Slanted est le meilleur (options 1 et 2)

Un l'avantage des options (1) et (2) par rapport au reste est que - à cause de l'inclinaison - elles occupent un peu moins d'espace vertical. Pas nécessairement un facteur majeur, mais parfois, cela peut être suffisant pour exclure les trois derniers.

Bien que l'étude mentionnée ci-dessus n'ait pas pris en compte le texte incliné, "l'intuition" suggère que sa vitesse de lecture devrait être comprise entre celle des orientations verticales et normales. Ceci est sauvegardé dans ne réponse à " Utilisabilité du texte vertical" qui cite une étude sur Rotation mentale des objets tridimensionnels . Cette étude soutient que nous "tournons mentalement" les images à un rythme constant, donc - puisque le texte incliné est entre vertical et horizontal en termes de rotation, il devrait être entre ces deux en termes de vitesse de lecture.

Conclusion : Le texte incliné est plus facile à lire que le texte vertical et empilé.

En bas à gauche en haut à droite ou en haut à gauche en bas à droite

En d'autres termes, de cette façon (option 1) ou de cette façon (option 2) ?

Contrairement au texte vertical (options 3 ou 4), trouver une comparaison de laquelle des options 1 ou 2 est plus facile à lire s'avère difficile (comme cela semblait être le cas dans cette discussion , qui demandait essentiellement au même question mais sans conclusion). Sans preuves solides pour continuer, je ne peux que faire des suppositions:

  • Pour isolé texte, si aucune orientation du texte vertical n'est plus facile à lire que l'autre, il serait semble logique à conclure qu'aucune orientation du texte incliné ne serait plus facile à lire que l'autre.

  • Réponse de Rob E Je pense que cela soulève le problème clé: cela dépend de la façon dont vous utilisez (ou attendez de votre utilisateur qu'il utilise) le graphique ou le tableau: c'est-à-dire, si vous passez de label-to -data ou de data-to-label.

Pour les graphiques (ou tout ce dont les étiquettes sont en bas):

  • Si vous commencez avec le label, alors avec l'option 1 (comme dans la question de l'OP) la fin du label est positionnée à côté de la colonne correspondante dans le graphique, faisant la transition du label au graphique Naturel.

  • Si vous commencez avec le graphique, alors avec l'option 2, le début de l'étiquette est positionné à côté de la colonne correspondante dans le graphique, rendant ainsi la transition du graphique au label naturelle.

Si, cependant, les étiquettes sont en haut (comme c'est typique dans les tableaux), alors le contraire s'applique. Les étiquettes de l'option 2 mènent naturellement des étiquettes aux données, et les étiquettes de l'option 1 mènent des données à la table.

4
TripeHound

Si vous donnez la priorité à la lisibilité et à la numérisation du volume, le retournement du graphique vers un graphique à barres horizontales peut faire de la place pour des étiquettes plus longues, améliorant la lisibilité et le tri par ordre de grandeur.

mockup

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

Cela ne répond pas directement à la question, mais vous voudrez peut-être envisager un graphique à barres horizontales dans certaines situations.

narration avec des données a une belle écriture à ce sujet. Ils ajoutent également la possibilité de trier, de sorte que vous pouvez voir les données les plus importantes en haut.

Ordonné les données du plus grand au moins. Cela crée une construction visuelle, facilitant la consommation des données. (Remarque: s'il existe un ordre intrinsèque à vos catégories qui est important, vous pouvez en tirer parti, mais en l'absence de cela, trier par ordre croissant ou décroissant par valeur).

Quand les graphiques à barres horizontales sont meilleurs

Selon votre cas d'utilisation (avec lequel je ne suis pas familier), il y a des moments où une disposition de graphique à barres horizontales est meilleure: lorsque le temps est l'axe des x.

Un aperçu utile vient de lisibilité du graphique à barres

les graphiques à barres horizontales ne sont pas toujours le meilleur choix pour votre présentation de données. Un cas où les graphiques à barres verticales sont les meilleurs est celui de la représentation graphique des données dans le temps. Les dates sont mieux comprises lorsque l'axe des x est traité comme une chronologie, donc tourner ce graphique de son côté serait déroutant. Les séries de données ordinales ou séquentielles constituent un autre cas d'utilisation des graphiques à barres verticales. Pour la même raison qu'une chronologie, si l'on regarde un décompte des salaires ou des âges, les séries de données doivent être ordonnées du plus petit au plus grand sur l'axe des x.

2
Mike M