Dans chaque page web, le contraste entre la couleur du texte et la couleur de son arrière-plan est-il suffisamment élevé (hors cas particuliers) ?

Comprendre

Le contraste entre le texte et son fond doit atteindre 4,5:1 (3:1 pour le grand texte).

Ce critère s’applique à toutes les pages.

Ce que vérifie Agence RGAA

Notre moteur détecte automatiquement des anomalies, mais une personne doit confirmer la pertinence avant de conclure.

Nous détectons automatiquement :

• contrastes de texte insuffisants

Un résultat automatique n’est jamais un audit : seul un contrôle humain (en interne ou par un auditeur RGAA) permet de conclure.

Exemple de correction

.lien {
  color: #0b3d91;       /* sur fond blanc : très largement au-dessus de 4,5:1 */
  background: #ffffff;
}

.legende {
  color: #9aa5b1;
  background: #ffffff;
}

• Le grand texte (24 px, ou 18,5 px en gras) peut descendre à 3:1.
• Pour du texte posé sur une image, prévoyez un fond uni derrière le texte.
• Vérifiez aussi les états survol, focus et désactivé.

Patron de référence à adapter à votre contexte : il ne vaut pas validation du critère.

Tests officiels

1. Test 3.2.1

   Dans chaque page web, le texte et le texte en image sans effet de graisse d’une taille restituée inférieure à 24px vérifient-ils une de ces conditions (hors cas particuliers) ? Le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins ; Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.

   Méthodologie de test

   1. Retrouver dans le document les textes et les textes en image sans effet de graisse d’une taille restituée inférieure à 24px qui pourraient poser des problèmes de contraste ;
   2. Pour chacun de ces textes, vérifier que :
      • Soit le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins ;
      • Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.
   3. Si c’est le cas pour chaque texte, le test est validé.

2. Test 3.2.2

   Dans chaque page web, le texte et le texte en image en gras d’une taille restituée inférieure à 18,5px vérifient-ils une de ces conditions (hors cas particuliers) ? Le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins ; Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.

   Méthodologie de test

   1. Retrouver dans le document les textes et les textes en image en gras d’une taille restituée inférieure à 18,5px qui pourraient poser des problèmes de contraste ;
   2. Pour chacun de ces textes, vérifier que :
      • Soit le rapport de contraste entre le texte et son arrière-plan est de 4.5:1, au moins ;
      • Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 4.5:1, au moins.
   3. Si c’est le cas pour chaque texte, le test est validé.

3. Test 3.2.3

   Dans chaque page web, le texte et le texte en image sans effet de graisse d’une taille restituée supérieure ou égale à 24px vérifient-ils une de ces conditions (hors cas particuliers) ? Le rapport de contraste entre le texte et son arrière-plan est de 3:1, au moins ; Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 3:1, au moins.

   Méthodologie de test

   1. Retrouver dans le document les textes et les textes en image sans effet de graisse d’une taille restituée supérieure ou égale à 24px qui pourraient poser des problèmes de contraste ;
   2. Pour chacun de ces textes, vérifier que :
      • Soit le rapport de contraste entre le texte et son arrière-plan est de 3:1, au moins ;
      • Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 3:1, au moins.
   3. Si c’est le cas pour chaque texte, le test est validé.

4. Test 3.2.4

   Dans chaque page web, le texte et le texte en image en gras d’une taille restituée supérieure ou égale à 18,5px vérifient-ils une de ces conditions (hors cas particuliers) ? Le rapport de contraste entre le texte et son arrière-plan est de 3:1, au moins ; Un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 3:1, au moins.

   Méthodologie de test

   1. Retrouver dans le document les textes et les textes en image en gras d’une taille restituée supérieure ou égale à 18,5px qui pourraient poser des problèmes de contraste ;
   2. Pour chacun de ces textes, vérifier que :
      • Soit le rapport de contraste entre le texte et son arrière-plan est de 3:1, au moins ;
      • Soit un mécanisme permet à l’utilisateur d’afficher le texte avec un rapport de contraste de 3:1, au moins.
   3. Si c’est le cas pour chaque texte, le test est validé.

5. Test 3.2.5

   Dans le mécanisme qui permet d’afficher un rapport de contraste conforme, le rapport de contraste entre le texte et la couleur d’arrière-plan est-il suffisamment élevé ?

   Méthodologie de test

   1. Retrouver dans le document les mécanismes qui permettent d’afficher un rapport de contraste conforme ;
   2. Pour chacun de ces mécanismes, vérifier que le rapport de contraste entre le texte et la couleur d’arrière-plan est suffisamment élevé ;
   3. Si c’est le cas pour chaque mécanisme, le test est validé.

Texte officiel du référentiel RGAA 4.1.2 publié par la DINUM — voir la source.