Attention, cette version d'AcceDe Web est obsolète,
pour consulter la dernière version, se rendre sur www.accede-web.com/notices/ !

3.1.1. Assurer un contraste suffisant entre les contenus et l'arrière-plan ou proposer une alternative contrastée

Le contraste entre les textes et l’arrière-plan doit être suffisant.

Cela concerne l’ensemble des textes (« pur », en image, dans des animations, etc.).

Remarque
Il est également important d’assurer un contraste suffisant entre les pictogrammes informatifs ou interactifs seuls (non accompagnés de texte) et leur arrière-plan.

Rapports de contraste pour une conformité au niveau AA

Le rapport de contraste minimum à atteindre pour une conformité au niveau AA dépend de la taille et de la graisse des textes.

Concrètement :

  • Un texte non gras inférieur à 18pt doit au minimum atteindre un rapport de 4,5.
  • Un texte non gras supérieur ou égal à 18pt doit au minimum atteindre un rapport de 3.
  • Un texte en gras inférieur à 14pt doit au minimum atteindre un rapport de 4,5.
  • Un texte en gras supérieur ou égal à 14pt doit au minimum atteindre un rapport de 3.

Remarque
La police de caractères utilisée n’a pas d’impact sur les rapports à atteindre.

Colour Contrast Analyser

Afin de tester les contrastes, utiliser par exemple l’outil Contrast Analyser, disponible en libre téléchargement pour Windows et Mac OS.

D’après cet outil, un rapport de contraste est considéré comme suffisant dès lors qu’il est conforme AA.

Attention
Utiliser avec vigilance les dégradés ou les motifs en arrière-plan des contenus.

Charte graphique alternative

S’il n’est pas envisageable d’optimiser les contrastes par défaut, alors une charte graphique alternative suffisamment contrastée peut être réalisée.

Une charte graphique alternative n’est pas nécessairement une charte où les contrastes sont poussés à l’extrême (du type noir sur blanc ou blanc sur noir), mais une charte où les associations de couleurs sont suffisamment optimisées.


Dans cet exemple (Institut Supérieur de l'Aéronautique et de l'Espace), une charte graphique alternative suffisamment contrastée est activable depuis un bouton “Modifier le contraste de la page”.

Quelques outils pratiques

Recommandations associées

notices/graphique-ergonomique/assurer-un-contraste-suffisant-entre-les-contenus-et-l-arriere-plan-ou-proposer-une-alternative-contrastee.txt · Dernière modification: Le 07/08/2015 à 12:34 par Sébastien Delorme (Atalan)
 

Projet coordonné par Atalan.

En partenariat avec :

Et le soutien de :