Contrastes visuels et sonores

Table des matières

Le problème

Le contraste visuel est un élément très important de la lisibilité, aussi bien pour les couleurs de texte et de fond de la page, que pour celles des images contenant du texte (souvent utilisées pour le système de navigation ou pour de la publicité).

Les personnes malvoyante et la population vieillissante sont particulièrement sensibles au niveau de contraste. Pour les personnes malvoyantes, cela va un peu de soi, mais pour la population vieillissante, il est intéressant de noter que dans le processus normal de vieillissement de l'œil, même d'un œil en bonne santé, une personne de 65 ans a besoin d'un niveau de luminosité 4 fois supérieur à celui nécessaire à une personne de 20 ans. À 80 ans, ce n'est plus 4 fois, mais 10 fois plus de lumière qui est nécessaire.

Il est également important de noter que des caractères gras ou plus gros peuvent compenser pour un contraste plus faible.

D'autre part, dans un clip audio préenregistré, les personnes ayant des limitations auditives peuvent avoir de la difficulté à percevoir la parole lorsqu'un fond sonore trop présent n'offre pas de contraste sonore suffisant avec la parole au premier plan.

Notons également que pour les personnes ayant des limitations visuelles ou cognitives, un fond sonore démarrant automatiquement sur une page Web vient en concurrence avec la synthèse vocale, et nuit à la compréhension de celle-ci. Le problème n'est donc pas de rendre ce son perceptible, mais de s'assurer que la synthèse vocale sera perceptible malgré ce fond sonore.

Retour en haut de page

La solution

Contraste visuel

Contraste sonore

  • Dans un clip audio pré-enregistré, le fond sonore doit être éliminé. On doit donner la possibilité de le désactiver, ou il doit être minimisé en assurant un contraste d'au moins 20 dB, soit un fond sonore 4 fois plus faible que la parole au premier plan.
  • Contrôle du son : Il faut minimiser l'impact d'un fond sonore qui démarre automatiquement, en limitant celui-ci à 3 secondes, ou en permettant à l'utilisateur de l'arrêter facilement (en plaçant un bouton permettant d'arrêter le son au début de la page).
Retour en haut de page

Les règles qui s'appliquent aux contrastes visuels et sonores

SGQRI 008-01
(site Web)
SGQRI 008-02
(doc. téléchargeable)
SGQRI 008-03
(multimédia)
WCAG 2.0
17. Toute page Web doit être présentée en : d) permettant d’arrêter facilement, dès l'entrée dans la page Web, un fond sonore qui dure plus de trois secondes; 12. Tout document téléchargeable doit être présenté en : c) permettant d’arrêter facilement, dès l'entrée dans le document téléchargeable, un fond sonore qui dure plus de trois secondes; 15. Toute animation Web doit être présentée en : d) permettant d'arrêter facilement, dès l’entrée dans l’animation Web, un fond sonore qui dure plus de trois secondes; 1.4.2 Contrôle du son : si du son sur une page Web est audible automatiquement pendant plus de 3 secondes, un mécanisme est disponible pour le mettre en pause, l'arrêter ou pour en contrôler le volume de façon indépendante du niveau de volume du système général. (Niveau A)

Note : puisque tout contenu ne satisfaisant pas à ce critère de succès peut interférer avec la capacité de l'utilisateur à exploiter la page entière, tout le contenu présent dans la page Web (qu'il soit utilisé pour satisfaire à d'autres critères de succès ou non) doit satisfaire à ce critère de succès. Voir l'exigence de conformité 5 : Non-interférence.

17. Toute page Web doit être présentée en : e) comportant, à l’exception d’un texte uniquement décoratif, d’un logo ou d’un nom de marque, un rapport de contraste de luminosité satisfaisant à l’une des exigences suivantes :
i. le rapport de contraste de luminosité entre le texte, présenté ou non dans une image, et son arrière-plan doit être au moins de 4,5 pour 1 ou de 3 pour 1, dans le cas de texte agrandi;
ii. la page Web doit offrir deux feuilles de style de remplacement respectant ces niveaux de contraste de luminosité, l’une en polarité normale et l’autre en polarité inversée, en plus de la feuille de style de base de la page Web;

17. Toute page Web doit être présentée en : f) permettant de déterminer explicitement les couleurs de texte et d'arrière-plan d’un même élément de texte dans une page Web de façon à satisfaire à l'une des exigences prévues au paragraphe e);

12. Tout document téléchargeable doit être présenté en : d) comportant, à l’exception d’un texte uniquement décoratif, d’un logo ou d’un nom de marque, un rapport de contraste de luminosité entre le texte, présenté ou non dans une image, et son arrière-plan doit être au moins de 4,5 pour 1 ou de 3 pour 1, dans le cas de texte agrandi. 15. Toute animation Web doit être présentée en : e) comportant, à l’exception d’un texte uniquement décoratif, d’un logo ou d’un nom de marque, un rapport de contraste de luminosité entre le texte, présenté ou non dans une image, et son arrière-plan au moins de 4,5 pour 1, ou de 3 pour 1 dans le cas de texte agrandi; 1.4.3 Contraste (minimum) : la présentation visuelle du texte et du texte sous forme d'image a un rapport de contraste d'au moins 4,5:1, sauf dans les cas suivants : (Niveau AA)
  • Texte agrandi : le texte agrandi et le texte agrandi sous forme d'image ont un rapport de contraste d'au moins 3:1;
  • Texte décoratif : aucune exigence de contraste pour le texte ou le texte sous forme d'image qui fait partie d'un composant d'interface utilisateur inactif, qui est purement décoratif, qui est invisible pour tous ou qui est une partie d'une image contenant un autre contenu significatif.
  • Logotypes : aucune exigence de contraste pour le texte faisant partie d'un logo ou d'un nom de marque.
      1.4.6 Contraste (amélioré) : la présentation visuelle du texte et du texte sous forme d'image a un rapport de contraste d'au moins 7:1, sauf dans les cas suivants : (Niveau AAA)
  • Texte agrandi : le texte agrandi et le texte agrandi sous forme d'image ont un rapport de contraste d'au moins 4,5:1;
  • Texte décoratif : aucune exigence de contraste pour le texte ou le texte sous forme d'image qui fait partie d'un composant d'interface utilisateur inactif, qui est purement décoratif, qui est invisible pour tous ou qui est une partie d'une image contenant un autre contenu significatif.
  • Logotypes : aucune exigence de contraste pour le texte faisant partie d'un logo ou d'un nom de marque.
      1.4.7 Arrière-plan sonore de faible volume ou absent : pour un contenu seulement audio pré-enregistré qui (1) contient principalement de la parole au premier plan, (2) n'est pas un CAPTCHA ou un logo sonore et (3) qui n'est pas une vocalisation dont l'intention est principalement d'être musicale comme une chanson ou un rap, au moins l'une des conditions suivantes est vraie : (Niveau AAA)
  • Sans arrière-plan : le contenu audio ne contient pas d'arrière-plan sonore.
  • Désactivation : l'arrière-plan sonore peut être désactivé.
  • 20 dB : l'arrière-plan sonore est au moins 20 décibels plus faible que le contenu parlé au premier plan sauf pour certains effets sonores occasionnels durant seulement une ou deux secondes. Note : par la définition du « décibel », le volume de l'arrière-plan sonore correspondant à cette exigence est approximativement quatre fois plus faible que le contenu parlé au premier plan.
Retour en haut de page

L'éavluation de conformité

SGQRI 008-01
(site Web)
SGQRI 008-02
(doc. téléchargeable)
SGQRI 008-03
(multimédia)
WCAG 2.0
Grille AccessiWeb 2.1 de Braillenet
(suivre ce lien pour voir les tests rattachés à chaque critère)

Un fond sonore qui dure plus de trois secondes peut-il être arrêté facilement, dès l'entrée dans la page (SW-17d) ?

Un fond sonore qui dure plus de trois secondes peut-il être arrêté facilement, dès l'entrée dans le document (DT-12c) ? Un fond sonore qui dure plus de trois secondes peut-il être arrêté facilement, dès l'entrée dans l'animation Web (M 15d) ? Critère 4.18 [Bronze] Chaque son déclenché automatiquement est-il contrôlable par l'utilisateur ?

À l’exception d’un texte uniquement décoratif, d’un logo ou d’un nom de marque, le rapport de contraste de luminosité satisfait-il à l’une des exigences suivantes :
- le rapport de contraste de luminosité entre le texte, présenté ou non dans une image, et son arrière-plan doit être au moins de 4,5 pour 1 ou de 3 pour 1, dans le cas de texte agrandi ;
- la page Web doit offrir deux feuilles de style de remplacement respectant ces niveaux de contraste de luminosité, l’une en polarité normale et l’autre en polarité inversée, en plus de la feuille de style de base de la page Web (SW-17e) ?

Les couleurs de texte et d'arrière-plan d’un même élément de texte peuvent-ils être déterminés explicitement de façon à satisfaire les exigences en matière de contraste de luminosité prévues au paragraphe 17e (SW-17e et SW-17f) ?

  • Web Accessibility toolbar : CSS | Voir les CSS et rechercher color et background-color
  • JAWS ou NVDA : Rechercher color et background-color dans le CSS
  • Web developer toolbar : CSS | Voir les CSS et rechercher color et background-color
À l’exception d’un texte uniquement décoratif, d’un logo ou d’un nom de marque, le rapport de contraste de luminosité entre le texte, présenté ou non dans une image, et son arrière-plan est-il d'au moins de 4,5 pour 1 ou de 3 pour 1, dans le cas de texte agrandi (DT-12d) ? À l’exception d’un texte uniquement décoratif, d’un logo ou d’un nom de marque, le rapport de contraste de luminosité entre le texte, présenté ou non dans une image, et son arrière-plan est-il d'au moins de 4,5 pour 1 ou de 3 pour 1, dans le cas de texte agrandi (M-15e) ?

Critère 3.3 [Argent] 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) ?

Critère 3.4 [Or] Dans chaque page Web, le contraste entre la couleur du texte et la couleur de son arrière-plan est-il amélioré (hors cas particuliers) ?

Critère 10.5 [Argent] Dans chaque page Web, les déclarations CSS de couleurs de fond d'élément et de police sont-elles correctement utilisées?

Critère 4.19 [Or] Pour chaque média temporel seulement audio pré-enregistré, les dialogues sont-ils suffisamment audibles ?

 

Retour en haut de page

La comparaison entre les standards SGQRI et WCAG 2.0

Concernant le contrôle du son, les standards SGQRI ne retiennent qu'une des deux options offertes par le critère de succès 1.4.2, celle consistant à offrir un mécanisme pour arrêter le son s'il dure plus de trois secondes.

Un site Web conforme aux standards SGQRI est donc également conforme au WCAG 2.0 pour les critères de succès de niveau AA. Toutefois, un site Web qui offrirait seulement un mécanisme permettant de contrôler le volume de façon indépendante, ne serait pas conforme aux standards SGQRI.

Voir aussi :

  1. Comprendre la règle 1.4 [Distinguable]
  2. Comprendre le critère de succès 1.4.2 [Contrôle du son]
  3. Comprendre le critère de succès 1.4.3 [Contraste (Minimum)]
  4. Comprendre le critère de succès 1.4.6 [Contraste (amélioré)]
  5. Comprendre le critère de succès 1.4.7 [Arrière-plan sonore de faible volume ou absent]

Retour en haut de page

Répondre à cet article

Restez connecté !

Recevez des nouvelles de l’avancement du projet PCCAW dans votre boîte de courriels.


Liste de diffusion