retour vers le site AccessiWeb

Guide AccessiWeb


vous êtes ici : Accueil > Fiches AccessiWeb : Eléments graphiques > Fiche 1.9

Fiche 1.9 : Il convient de remplacer un texte sous forme d'image par un texte mis en forme. Cette règle est-elle respectée ?

Carte d'identité

  • Critère AccessiWeb : 1.9
  • Niveau AccessiWeb : argent
  • Point(s) de contrôle WCAG 1.0 correspondants (Priorité 2 de WAI) : 3.1

revenir en haut de la page

Comprendre

Bénéfices pour les utilisateurs

Remarque : Il est très souvent aisé de mettre du texte en forme par l'intermédiaire d'une feuille de style plutôt que de mettre du texte sous forme d'image, tout en gardant le même aspect graphique.
A part le cas de contraintes graphiques strictes où il ne sera pas possible de transformer de façon équivalente le texte mis sous forme d'image, on choisira de préférence l'utilisation de feuilles de style.

Valeur ajoutée pour le site

revenir en haut de la page

Comment évaluer

Par le code source

Ce critère n'est pas évaluable par le code source.

Par l'utilisation d'outils

Pour une liste complète des outils utilisés pour évaluer l'accessibilité des pages web, et un résumé de leurs principales fonctionnalités, reportez-vous à la page Outils d'aide à l'évaluation.

Evaluer avec la barre AccessiWeb (version 1.0) :
  1. Sous Internet Explorer, ouvrir la page à analyser.
  2. Dans le menu "1. Eléments graphiques" de la Barre AccessiWeb, activer le critère 1.9.
  3. Tous les éléments graphiques de la page s'affichent dans une nouvelle fenêtre avec, en dessous, l'extrait de code source correspondant.
  4. Repérer les images contenant du texte avec des polices standards.
  5. Si tel est le cas, ces textes sont sous forme d'images et le critère n'est pas respecté.

Evaluer avec la barre d'accessibilité AIS pour Internet Explorer (version 1.2 en français) :
  1. Cliquer sur le menu "Images", puis l'option "Liste des images [Nouvelle fenêtre]".
  2. Repérer les images contenant du texte avec des polices standards.
  3. Si tel est le cas, ces textes sont sous forme d'images et le critère n'est pas respecté.

Evaluer avec la Barre d'Outils Web Developper pour Firefox (version 1.0.2 en français) :
  1. Dans le menu "Images", activer le sous-menu "Entourer les images" puis l'option "Toutes les images".
  2. Tous les éléments graphiques de la page sont entourés d'un liseret rouge.
  3. Repérer les images contenant du texte avec des polices standards.
  4. Si tel est le cas, ces textes sont sous forme d'images et le critère n'est pas respecté.

Evaluer avec le lecteur d'écran Jaws (version 5 et 6.2 en français) :
Ce critère n'est pas évaluable par le lecteur d'écran Jaws.

revenir en haut de la page

Comment mettre en oeuvre

Qui est concerné ?

Le développeur, en concertation avec le graphiste, doivent veiller au respect de ce critère.

Implémentation

Implémentation pour la fiche 1.9 Lorsqu'un texte est dessiné dans une image, il convient d'abord de se demander si celui-ci ne peut pas être écrit directement dans la page html, puis mis en forme par l'intermédiaire de la feuille de style. C'est notamment le cas lorsque le graphisme du texte est celui d'une police de caractère standard (Arial, Verdana, ou autres polices de la famille sans-serif). Le positionnement, la taille et la couleur du texte, ses attributs comme la mise en gras sont ensuite définis dans la feuille de style. Dans le cas de notations plus spécifiques pour lesquelles il est fréquent de les représenter sous forme d'images, comme les équations mathématiques ou l'écriture musicale, le WAi préconise l'utilisation de langages appropriés comme le mathml ou TEX qui permettent de les restituer sous forme de texte inscrit dans la page et accessible aux utilisateurs qui ne peuvent voir les images.

Exemple de mauvaise pratique

Il n'y a pas d'exemple pour cette rubrique.

Exemple de bonne pratique

Il n'y a pas d'exemple pour cette rubrique.

revenir en haut de la page

Illustrations

Un texte sous forme d'image

Cette capture d'écran présente une page sur laquelle figure un texte sous forme d'image. Le texte est "calendrier des manifestations" et est en vert sur fond jaune.

Un texte mis en forme par feuille de style

Cette capture d'écran présente le même texte que l'image précédente, mais dont la mise en forme a été faite par l'intermédiaire d'une feuille de sytle.

revenir en haut de la page

Références

Autres fiches à consulter

Autres ressources

revenir en haut de la page


Fiche précédente : fiche 1.8 Fiche suivante : fiche 1.10

Guide AccessiWeb (version 2.1, 30 août 2006) | Conditions d'utilisation | Contact