Critère « 1 »

Nom :
1
Description :
Chaque image est dotée d'une alternative textuelle appropriée.
Cré(é) le :
21 avril 2010
Automatisé(e) :
Semi-automatisé
Objectif(s) :

Permettre aux utilisateurs placés dans des contextes où les images ne sont pas perceptibles (navigateur texte, lecteur d'écran, navigateur avec images désactivées) de comprendre le sens des images qu'ils ne peuvent voir.

Permettre aux robots d'exploiter l'information véhiculée par les images (référencement, indexation, traduction automatique des alternatives d'images-texte).

Permettre l'affichage d'un texte pendant le chargement des images.

Solution(s) technique(s) :

L'attribut alt est présent pour chaque élément img (ou area dans le cas des zones d'images MAP) sous la forme :

  • alt="" (alt vide) pour les images qui ne véhiculent pas d'information nécessaire à la compréhension du texte. Par exemple : <img src="spacer.gif" height="1" width="1" alt="">. Attention : l'omission de l'attribut alt ou un attribut alt contenant simplement un espace ne correspond pas à un attribut vide et ne sera donc pas conforme ;
  • alt="_fonction_" pour les images liens, avec comme contenu la fonction du lien. Par exemple : <img src="…" alt="Accueil"> pour la traditionnelle icône « home » ;
  • alt="_description_" pour les images dont la description est nécessaire à la compréhension du contenu de la page.

Contenu de l'alternative

Le contenu de l'alternative dépend étroitement de la fonction de l'image et du contexte précis dans lequel elle est employée.

Cas fréquents

Les images-liens ne doivent jamais avoir d'alternative vide. Leur alternative indiquera la cible du lien plutôt que la description de l'image proprement dite.

Les images-texte reprendront le plus souvent le texte concerné dans leur alternative, éventuellement résumé pour rendre cette dernière plus concise.

Les images complexes véhiculant une information trop importante pour être fournie par la seule alternative textuelle : l'alternative s'en tiendra à un résumé de l'essentiel, et une description étendue accompagnera l'image, dans la même page que celle-ci ou accessible à partir du contexte de l'image.

Les images nécessitant une mention de copyright : contrairement à une pratique fréquente, l'alternative ne doit en aucun cas servir à faire mention des droits d'auteur ou de propriété intellectuelle.

Longueur de l'alternative

La description de sa fonction ou de l'information véhiculée par l'image doit être concise. Il n'y a pas de limite normée mais on admet généralement 120  caractères comme maximum.

Moyen(s) de contrôle :

Cette vérification s'effectue en large partie via l'inspection du code ou son examen à l'aide d'outils du type Web Developer Toolbar pour Firefox :

  • Tester au préalable la présence des attributs alt en vérifiant la validité du code HTML4.x ou XHTML1.x avec le validateur du W3C (cet attribut étant obligatoire dans ces formats, le validateur HTML signale les images privées d'alternative) ;
  • Vérifier manuellement la pertinence de chaque alternative en l'affichant par exemple à l'aide d'une barre d'outils d'inspection du code comme la Web Developer Toolbar pour Firefox ;
  • Vérifier également la présence et la pertinence des alternatives des images générées via Javascript, et donc absentes du code HTML statique. De même, s'assurer de la pertinence des alternatives d'images dynamiquement modifiées par Javascript (images reflétant l'état d'une interaction AJAX, par exemple).
Dérogations:
(non renseigné)
Remarques:
(non renseigné)
Niveau :
Niveau 1
Thématique :
Alternatives
VPTCS :
Visibilité Technique Contenus
Processus :
Intégration Référencement
Exigences :
Accessibilité
Workshop :
validée