FICHE 9

PRESENTATION VISUELLE

 

1. Rappel des recommandations 2 et 3 et 6 et 7 des WCAG 1.0 :

Recommandation 2 :
" S'assurer que les textes et graphiques sont compréhensibles quand on les visualise sans couleur. "

Recommandation 3 :
" Baliser les documents avec les éléments structurants appropriés. Contrôler la présentation avec des feuilles de style plutôt qu'avec des éléments et des attributs de présentation. "

Recommandation 6 :
" S'assurer que les pages sont accessibles même lorsque les dernières technologies ne sont pas supportées ou sont désactivées".

Recommandation 7 :
" S'assurer que les fonctions permettant de faire bouger, clignoter, défiler ou mettre à jour automatiquement des objets ou des pages puissent être mises en pause ou stoppées. "

Points de contrôle :2.1 (Priorité 1) ; 2.2 (Priorité 2) ; 6.1 (Priorité 1) ; 7.2 (Priorité 2) ; 3.4 (Priorité 2)

Raisons de cette recommandation

Les personnes souffrant de troubles de perception des couleurs et celles utilisant un écran noir et blanc doivent accéder à toute l'information sur le site Web. Ceci inclut notamment le texte, les images et les outils pour la navigation.

2. Ce qu'il faut faire

La règle générale

Il faut vérifier la présentation du contenu à l'écran c'est-à-dire voir si le contenu est bien lisible sous certaines conditions, si le contenu apparaît en entier sur l'écran, si l'on peut accéder à toute l'information de la page, …

Contrastes

Vérifier que les contrastes sont suffisants entre le premier plan et l'arrière plan.
Les contrastes doivent être bien marqués pour une bonne lisibilité des liens ou de l'information. Trop peu de contraste aboutit rapidement à une fatigue visuelle.

Information transmises

Vérifier que l'information transmise par les couleurs est également accessible sans couleur, et que le site est toujours lisible en noir et blanc.

Ne pas surcharger une page. Trop d'information nuit à l'information.

Taille des images

Vérifier la taille des images car suivant la taille, le poids des images, elles peuvent alourdir le téléchargement.
Eviter de mettre l'information textuelle sous forme d'images dont on ne peut pas régler la taille des caractères.

Points à vérifier

  • Vérifier la présentation en utilisant la plus petite résolution.
  • Veiller à ce que les pages soient lisibles sans les feuilles de style CSS (Avec IE : outils - options internet - accessibilité - cocher les cases " Mise en forme ").
    Certains navigateurs ne peuvent utiliser les feuilles de style (CSS). Les développeurs de contenus doivent donc vérifier les styles des CSS avec un outil tel que le CSS Validator (système de validation des CSS) de W3C et s'assurer que les utilisateurs peuvent avoir accès aux caractéristiques des documents et des présentations lorsque les feuilles de style sont désactivées ou non supportées.
  • Eviter la présence de contenus clignotants.
  • Vérifier que le grossissement des caractères est possible (Avec IE : affichage - taille du texte). De manière générale, il est déconseillé d'utiliser des polices trop petites pour garder une qualité de lissage suffisant.
  • Veiller à l'utilisation de valeurs relatives en pourcentage plutôt que de valeurs absolues en pixels pour dimensionner un élément.
    Lorsqu'un document ou une feuille de style utilise des pourcentages et des tailles de police 'em' pour établir les unités de mesure, les utilisateurs peuvent changer facilement les unités à l'aide de leur navigateur.
  • Vérifier l'homogénéité, la cohérence du site (respect de la charte graphique sur tout le site).
  • Vérifier que les tableaux gardent leurs contours lors de la suppression des couleurs de fond.
  • Eviter de rendre nécessaire l'utilisation d'une barre de défilement horizontal.
    Eviter également les ascenseurs au milieu des pages.
  • Vérifier lesmenus " Javascript " transparents(risque de superposition de texte).

3. Exemples rencontrés sur les sites évalués

  • Sur le site de la Cour d'Appel de Paris (www.ca-paris.justice.fr) à la rubrique actualités, le contraste est insuffisant (texte gris clair, sur fond blanc). Le site de l'Académie de Strasbourg (www.ac-strasbourg.fr) manque également de contrastes
  • Le site de l'Agence pour la Sûreté Nucléaire (www.asn.gouv.fr) utilise un gif animé qui affiche une information difficilement accessible. Cette image est perturbante pour les personnes ayant des difficultés de concentration.

retour aux fiches