1. Couleurs

1.1 Dans chaque écran, l'information ne doit pas être transmise uniquement par la couleur.

1.1.1 Pour chaque élément de l'interface dont la mise en couleur est porteuse d'information, l'information ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?

‍

Méthodologie du test 1.1.1

‍

iOS et Android

  1. Repérer dans l'écran les mots ou ensemble de mots, les textes, les éléments graphiques porteurs d'information et les médias temporels dont la mise en couleur est porteuse d'information.
  2. Vérifier qu'il existe un autre moyen visuel de récupérer cette information : présence d'une icône ou d'un effet graphique de forme ou de position, un effet typographique, etc.
  3. Avec le lecteur d'écran, accéder à l'information donnée par la couleur.
  4. Vérifier qu'une information équivalente est restituée par le lecteur d'écran (par exemple, l'état « sélectionné » d'un bouton vert).
  5. Si c'est le cas, le critère est validé.
    ‍

1.1.2 Pour chaque indication de couleur donnée par un texte (écrit ou vocalisé), l'information ne doit pas être donnée uniquement par la couleur. Cette règle est-elle respectée ?

‍

Méthodologie du test 1.1.2

‍

Références

WCAG 2.1

Critère(s) de succès :

‍

RGAA 4.1.2

Critère(s) de référence :

1.2 Dans chaque écran, le contraste entre la couleur du texte et la couleur de son arrière-plan est suffisamment élevé (hors cas particuliers).

1.2.1 Pour chaque texte, le contraste entre la couleur du texte et la couleur de son arrière-plan respecte-t-il une de ces conditions ?

‍

‍

Méthodologie du test 1.2.1

iOS

  1. S'il existe dans l'application, activer le mécanisme de remplacement permettant d'afficher l'application avec un rapport de contraste suffisant.
  2. Repérer dans l'écran les textes, les textes contenus dans des éléments graphiques et les textes incrustés dans les vidéos qui pourraient poser des problèmes de contraste.
  3. Activer le logiciel Colour Contrast Analyser sur l'ordinateur et capturer les couleurs d'avant-plan et d'arrière-plan sur le terminal mobile soit :
    • En diffusant l'écran du terminal mobile sur l'ordinateur ;
    • En réalisant des captures d'écran des éléments à évaluer (et en les important sur l'ordinateur).
  4. Vérifier :
  5. Si c'est le cas, le critère est validé.

‍

Note

Il est possible d'utiliser l'application Xcode Accessibility Inspector disponible sur macOS pour réaliser une évaluation rapide des contrastes des écrans. Le logiciel dispose d'une fonctionnalité « Audit » qui permet de faire des tests automatiques de certains éléments textes et graphiques des écrans. Cette fonctionnalité ne détecte pas l'ensemble des défauts de contraste, des tests complémentaires suivant la méthodologie décrite ci-avant seront nécessaires.

‍

Android

  1. S'il existe dans l'application, activer le mécanisme de remplacement permettant d'afficher l'application avec un rapport de contraste suffisant.
  2. Repérer dans l'écran les textes, les textes contenus dans des éléments graphiques et les textes incrustés dans les vidéos qui pourraient poser des problèmes de contraste.
  3. Activer le logiciel Colour Contrast Analyser sur l'ordinateur et capturer les couleurs d'avant-plan et d'arrière-plan sur le terminal mobile soit :
    • En diffusant l'écran du terminal mobile sur l'ordinateur ;
    • En réalisant des captures d'écran des éléments à évaluer (et en les important sur l'ordinateur).
  4. Vérifier :
  5. Si c'est le cas, le critère est validé.

‍

Note

Il est possible d'utiliser l'application Accessibility Scanner pour réaliser une évaluation rapide des contrastes des écrans. L'application ne détecte pas l'ensemble des défauts de contrastes, des tests complémentaires suivant la méthodologie décrite ci-avant seront nécessaires.

‍

‍

Cas particuliers

Dans ces situations, le critère est non applicable pour ces éléments.

  • Le texte fait partie d'un logo ou d'un nom de marque d'un organisme ou d'une société ;
  • Le texte ou l'image de texte est purement décoratif ;
  • Le texte fait partie d'une image véhiculant une information, mais le texte lui-même n'apporte aucune information essentielle ;
  • Le texte ou l'image de texte fait partie d'un élément d'interface sur lequel aucune action n'est possible (par exemple, un bouton ayant un état désactivé).
    ‍

‍

Références

WCAG 2.1

Critère(s) de succès :

‍

RGAA 4.1.2

Critère(s) de référence :

7.8 Chaque composant d'interface est, si nécessaire, compatible avec le lecteur d'écran.

7.9 L'utilisateur est averti ou a le contrôle des changements de contexte.

7.10 Les messages de statut sont correctement restitués.

7.11 L'application est clairement identifiable depuis l'écran de lancement.

9.8 Les actions déclenchées au moyen d'un dispositif de pointage sur un point unique de l'écran peuvent faire l'objet d'une annulation (hors cas particuliers).

9.9 Les fonctionnalités qui impliquent un mouvement de l'appareil ou vers l'appareil peuvent être satisfaites de manière alternative (hors cas particuliers).