retour vers le site AccessiWeb

Guide AccessiWeb


vous êtes ici : Accueil > Fiches AccessiWeb : Tableaux > Fiche 5.2

Fiche 5.2 : Dans un tableau de données, la balise CAPTION est-elle utilisée pour donner un titre au tableau ?

Carte d'identité

  • Critère AccessiWeb : 5.2
  • Niveau AccessiWeb : bronze
  • Point(s) de contrôle WCAG 1.0 correspondants (Priorité 3 de WAI) : 5.5

revenir en haut de la page

Comprendre

Bénéfices pour les utilisateurs

Valeur ajoutée pour le site

revenir en haut de la page

Comment évaluer

Par le code source

  1. Pour chaque tableau de données, vérifier la présence de la balise CAPTION placée après la balise ouvrante de l'élément TABLE.

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 "5. Tableaux" de la Barre AccessiWeb, activer le critère 5.2.
  3. Les informations sur le(s) tableau(x) de données de la page s'affichent dans la page.
  4. Pour chaque tableau de données, vérifier que la balise CAPTION est présente et renseignée avec pertinence.
    Note : Pour enlever les informations sur les tableaux de la page, recharger la page en cliquant sur la touche F5.

Evaluer avec la barre d'accessibilité AIS pour Internet Explorer (version 1.2 en français) :
Méthode 1 :
  1. Repérer les tableaux de données présents sur la page.
  2. A l'aide de la souris, sélectionner le ou les tableaux de données présent(s).
  3. Cliquer sur le menu "Source", puis sur l'option "Voir le code source de la sélection [Nouvelle fenêtre]".
  4. Vérifier la présence des balises CAPTION et /CAPTION, ainsi que la pertinence du texte qu'elles entourent.

Méthode 2 :
  1. Repérer les tableaux de données présents sur la page.
  2. Activer l'option "Tableau de données complexe" du menu "Structure".
  3. Ceci affiche les informations sur le(s) tableau(x) de données.
  4. Vérifier que la balise CAPTION est présente et renseignée avec pertinence.

Evaluer avec la Barre d'Outils Web Developper pour Firefox (version 1.0.2 en français) :
Méthode 1 :
  1. Activer l'option "Afficher le nom de l'élément entouré" du menu "Entourer".
  2. Puis, activer l'option "Entourer un élément personnalisé ..." du menu "Entourer".
  3. Une fenêtre apparaît. Saisir dans le premier champ "Elément 1" le mot caption. Observer la couleur associée à cet élément dans la case de couleur suivant la zone de saisie (par défaut: rouge). Appuyer sur le bouton OK.
  4. Localiser dans la page les tableaux de données, identifier si du texte est entouré d'un liseret rouge (la balise CAPTION est inscrite dans le liseret rouge) et vérifier la pertinence du texte.
    Note: Appuyer sur la touche F5 pour enlever le(s) liseret(s) rouge(s) de la page.

Méthode 2 :
  1. Repérer les tableaux de données présents sur la page.
  2. Activer l'option "Voir Source" du menu "Voir Source".
  3. Une nouvelle fenêtre apparaît et affiche le code source.
  4. Pour les tableaux de données, vérifier la présence des balises CAPTION et /CAPTION, ainsi que la pertinence du texte qu'elles entourent.

Evaluer avec le lecteur d'écran Jaws (version 5 et 6.2 en français) :
  1. Ouvrir la page à analyser contenant au moins un tableau de données sous Internet Explorer.
  2. Selon la version de Jaws, taper la lettre T, E ou Y du clavier pour passer de tableau en tableau.
  3. Lorsque la balise CAPTION est associée à un tableau, et correctement remplie, Jaws prononce "légende", suivi du contenu de la balise.

revenir en haut de la page

Comment mettre en oeuvre

Qui est concerné ?

Le développeur web, l'intégrateur HTML implémentent et évaluent ce critère.

Implémentation

La balise CAPTION doit être insérée après la balise d'ouverture TABLE. Syntaxe générale :

<table summary="résumé du tableau">
<caption>titre du tableau</caption>
[contenu du tableau]
</table>

Exemple de mauvaise pratique

Dans l'exemple qui suit, nous avons une structure de tableau de données. Or celui-ci ne comporte pas de titre. Un tel doit doit être incorporé par les balises CAPTION et /CAPTION.

<table summary="le tableau vous donne les températures moyennes de paris pour les années 2000, 2001, 2002. la première colonne comprend les mois, la seconde l'année 2000, la seconde l'année 2001, la dernière l'année 2002.">
<tr>
<th>titre 1</th <th>Titre 2</th>
</tr>
...
</table>

Exemple de bonne pratique

En corrigeant l'exemple précédant, un titre est associé au tableau et indique clairement les données qu'il représente.

<table summary="le tableau vous donne les températures moyennes de paris pour les années 2000, 2001, 2002. la première colonne comprend les mois, la seconde l'année 2000, la seconde l'année 2001, la dernière l'année 2002.">
<caption>températures moyennes de paris </caption>
<tr>
<th>titre 1</th <th>Titre 2</th>
</tr>
...
</table>

revenir en haut de la page

Illustrations

Un tableau de données avec un titre pertinent

Cette capture d'écran présente la façon dont s'affiche le titre du tableau de données, cité en exemple de code, concernant les températures de la semaine pour les ville de Paris, Strasbourg et Toulouse.

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 5.1 Fiche suivante : fiche 5.3

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