2.3. Assurer la compréhension de l’information même en l’absence de couleurs

L’information ne doit pas être véhiculée uniquement par la couleur.

Graphique camembert, un pourcentage est associé à chaque portion, la couleur de chaque portion est reprise dans la légende qui indique à quoi correspondent les portions. — Dans ce premier exemple, l’information véhiculée par le camembert n’est plus compréhensible sans couleur.

Même graphique camembert, un pourcentage et une légende sont associés à chaque portion. — Tandis que cette version du camembert reste compréhensible même sans couleur.

Pour chaque entitée EDF, des carrés de couleur font référence à une légende qui indique "Production", "Distribution" et "Service" — Dans ce premier exemple, des carrés de couleurs différentes sont utilisés pour la légende. L’information n’est véhiculée que par ce moyen.

Pour chaque entitée EDF, des icones indiquent si l'entitée effectue de la production, de la distribution et ou du service. Une légende placée après la liste indique le sens de chaque picto. — Tandis que dans cette version, les carrés de couleurs ont été remplacés par des pictogrammes. Ce qui permet de rendre compréhensible l’information même en l’absence de couleurs.

Navigation de 5 liens, la couleur de fond de la rubrique active est différentes des autres rubriques. — Dans ce premier exemple d’un menu de navigation, l’information de la position courante (« Investisseurs ») n’est véhiculée que par le changement de la couleur de fond.

Tandis que dans cette version, l’ajout d’une flèche tournée vers le bas permet de rendre compréhensible l’information même en l’absence de couleurs.

5 puces de navigation dans un carrousel, la puce du milieu a une couleur de fond différente. — Dans ce premier exemple d’un système de navigation dans un carrousel, l’information de la pastille courante n’est véhiculée que par le changement de couleur.

Tandis que dans cette version, le rétrécissement de la pastille courante permet de rendre compréhensible l’information même en l’absence de couleurs.

5 commentaires

Par Raphaëlle, le 26 novembre 2024 à 11h16.

Bonjour,
Je ne comprends pas pourquoi le 1er exemple d’onglets n’est pas accessible. On a une différence extrêmement marquée entre celui qui est sélectionné et les autres puisque les contraste sont inversés et très forts.

La compréhension est qu’on ne doit pas véhiculer une info par la couleur mais qu’il faut distinguer la couleur du contraste. Même si je ne vois pas les couleurs je percevrai une nette différence.

Pourriez vous m’expliquer ? Merci beaucoup

Répondre
- Par Dominique Nicolle (Atalan), le 16 décembre 2024 à 11h27.
  
  Bonjour Raphaëlle,
  
  En s’appuyant sur les tests mentionnés par le RGAA, une différence de couleur, même extrêmement marquée, ne permet pas de valider le critère 3.1 demandant de ne pas véhiculer l’information uniquement par un changement de couleur.
  De plus, lors du passage en mode de contraste élevé de Windows (par exemple) les couleurs sont remplacées, et de ce fait, la différence entre un onglet actif ou non ne sera plus visible sans une indication visuelle (ici flèche vers le bas, cela peut aussi être une bordure d’épaisseur différente par exemple).
  
  Bien à vous,
  Dominique
  
  Répondre
Par jérôme, le 22 décembre 2023 à 14h44.

Dans les graphiques à plusieurs courbes, il faut utiliser des traits différents entre courbes et non pas seulement des couleurs différentes, ou grossir les traits.

Répondre
Par Gaby, le 17 mars 2017 à 12h05.

Ce commentaire a été publié sur une ancienne version des notices AcceDe Web. Il se peut que son contenu ne soit plus d'actualité.

Merci pour ces exemples précis.
Pourquoi avoir supprimé l’astuce du test en niveaux de gris ? Finalement pas une bonne idée ? Merci

Répondre
- Par Sébastien Delorme, le 30 mars 2017 à 15h40.
  
  Ce commentaire a été publié sur une ancienne version des notices AcceDe Web. Il se peut que son contenu ne soit plus d'actualité.
  
  Bonjour Gaby,
  
  En fait, passer en niveaux de gris ne suffit pas pour vérifier que l’information n’est pas véhiculée par la couleur.
  
  Par exemple, imaginons un camembert avec trois portions verte, bleue et rouge. En le passant en gris, on risque d’avoir trois gris différents et donc se dire que tout est ok.
  
  Pourtant, une personne daltonienne ou malvoyante pourrait quand-même ne pas distinguer certaines combinaisons.
  
  Nous avons donc supprimé cette astuce qui pourrait faire valider une mise en page qui n’était pas accessible.
  
  Répondre

Ajouter un commentaire

Haut de page