Manuel d'accessibilité du Web : bonnes feuilles Une intégration qui diffère selon les catégories d'image

 Image lien avec texte adjacent

Exemple : un lien comprenant une flèche indiquant le haut de la page, et le texte "Haut de page". Le <ALT> est vide car l'intitulé du lien est explicite.

<a href="#haut"><img src="haut.png" alt="" />Haut de page</a>

 Image avec texte court

A chaque type d'image, sa règle d'intégration

Exemple : Une image donnant un numéro de téléphone de type "numéro vert". Le <ALT> reprend l'information d'un numéro vert, ainsi que le numéro.

<img src="numero_vert.png" alt="Numéro vert : 01 02 03 04 05" />

 Image descriptive avec une information importante

Exemple : une photographie dans laquelle deux personnes importantes se serrent la main. Cette information n'est pas reprise dans le texte de l'article adjacent à la photo, elle l'est donc dans le <ALT>.

<img src="rencontre.jpg" alt="M. X et M. Y se serrent la main amicalement" />

 Image descriptive dont l'information est dans le texte

Exemple : une photographie dans laquelle deux personnes importantes se serrent la main. Cette information est reprise dans le texte de l'article adjacent à la photo, elle ne l'est donc pas dans le <ALT>.

<img src="rencontre.jpg" alt="" /> <p>M. X et M. Y se serrent la main amicalement.</p>

 Image décorative sans information

Exemple : image n'ayant aucun sens particulier, le <ALT> reste vide (cela permet aux navigateurs paramétrés dans ce sens, de ne pas la charger).

<img src="puce.png" alt="" />