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.
Navigation de 5 liens, la couleur de fond et la forme de la rubrique active est différentes des autres rubriques.
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.
5 puces de navigation dans un carrousel, la puce du milieu a une couleur de fond et une taille différente.
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.

3 commentaires

  • 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

  • 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

Ajouter un commentaire

Tous les champs sont obligatoires.

Haut de page