Jour 21: Ignorer les images d'espacements

De nombreux concepteurs Web utilisent les images d'espacement pour contrôler la mise en page de leur site Web dans des navigateurs visuels. Vous pouvez en utiliser autant que vous voulez, mais vous devez explicitement spécifier un attribut alt vide pour chaque image d'espacement afin que les navigateurs non-visuels sachent comment les ignorer.

Qui en bénéficie ?

  1. Marc en bénéficie. Par défaut, Lynx affiche le nom du fichier de toute image qui ne contient pas d'attribut alt. De nombreux gabarits de logiciels de carnet web connus comprennent des images d'espacements même avant le nom du site. Vous ne les voyez pas dans votre navigateur visuel, bien sur, mais voilà ce que Marc voit. attribute. Many popular weblog templates include several spacer images even before the site name. You don't notice them in your visual browser, of course, but this is what Marc sees:

    [shim.gif] [shim.gif]
[shim.gif]
[shim.gif]
Bienvenue sur mon site Web
[ciblueHeader2.gif]

[ciblueCurve2.gif]

  2. Jackie en bénéficie. Par défaut, JAWS lit le nom du fichier de chaque image qui ne contient pas d'attribut alt. Vous avez pensé que c'était ennuyeux pour Marc, imaginez combien c'est insupportable pour Jackie d'entendre ceci :

    image shim point gif image shim point gif image shim point gif image shim point gif Bienvenue sur mon site web image c i blue header two point gif image c i blue curve two point gif

    Si vous vous présentez ainsi dans la vie réelle, plus personne ne vous parlera.

Comment le réaliser ?

Les utilisateurs Radio peuvent prendre un jour de congé. Tout comme lundi dernier, Radio génère automatiquement des attributs alt vides pour toutes les images d'espacements. (Merci, Jake.) Si vous visualisez le code source de votre page d'acceuil et que vous ne voyez pas alt="" sur toutes les images d'espacement, mettez à jour Radio.root et republiez votre site Web.

Les utilisateurs d'autres outils de publication devraient vérifier dans leur gabarit la présence de balises <img> avec des noms de fichiers tels que "spacer.gif", "shim.gif", "1.gif", ou toute image qui apparaît plusieurs fois à l'intérieur de votre gabarit, probablement avec des valeurs d'attributs width et height différement à chaque fois.

Par exemple, pour toute image d'espacement qui ressemble à ceci :

<img src="spacer.gif" width="1" height="10">

Modifiez là en :

<img src="spacer.gif" alt="" width="1" height="10">

Si vous réutilisez la même image d'espacement plusieurs fois, il est probablement plus facile de faire un chercher remplacer global.

Choses à ne pas faire.

  1. Ne définissez pas alt=" ". L'attribut alt devrait être une chaîne vide et non pas un espace.

  2. Ne spécifiez pas un attribut alt pour votre balise <body>, même si celui ci fait appel à une image de fond. Cette image est toujours ignorée par les navigateurs non visuels. Ca ressemble à ceci :

    <body background="http://url/vers/image.gif">

  3. Ne spécifiez pas un attribut alt sur les balises <td> même si elles comprennent des images de fond. Ces images sont toujours toujours ignorées par les navigateurs non visuels. Ca ressemble à ceci :

    <td background="http://url/vers/image.gif">

Approfondir

 
<< Jour 20 : Fournir un résumé pour les tableaux  Jour 22 : Utilisez de vraies listes (ou imitez les correctement) >>  Sommaire