retour vers le site AccessiWeb

Guide AccessiWeb

vous êtes ici : Accueil > Fiches AccessiWeb : Tableaux > Critère 5.4

Critère 5.4 : Chaque tableau de données a-t-il une balise caption ?

revenir en haut de la page

Carte d'identité du critère 5.4 [niveau AccessiWeb : Argent]

Test(s) AccessiWeb permettant de vérifier le critère 5.4

Note : le(s) test(s) suivant(s) sont issu(s) de AccessiWeb v1.1 [Déployé].

Autre(s) fiche(s) AccessiWeb à consulter en relation avec cette fiche

Correspondances avec des critères d'autres référentiels sur l'accessibilité du Web

revenir en haut de la page

Comprendre

Comprendre le critère

Tous les tableaux de données doivent avoir une balise caption (titre du tableau).

Bénéfices pour les utilisateurs

Les personnes qui lisent la page de façon linéaire, tels les internautes aveugles, qui se servent d'un lecteur d'écran ou d'un navigateur textuel, les personnes malvoyantes, qui agrandissent les caractères à l'écran, ou les internautes dont les outils de navigation n'affichent qu'une partie de l'écran, sont les premiers bénéficiaires de la balise caption des tableaux.

Valeur ajoutée pour le site

revenir en haut de la page

Comment évaluer

Note : de manière générale, il est conseillé de faire l'évaluation d'un critère via l'analyse de son code source. Ce procédé d'évaluation par le code source est détaillé ci-après quand il est possible : procédé d'évaluation en 3 étapes via le ou les tests associés au critère. Les procédés d'évaluation par différents outils sont donnés en complément de l'évaluation par le code source.

Par le code source

  1. Sélectionner le(s) élément(s) à tester :
    • Identifier dans un navigateur graphique les tableaux de données.
    • Ouvrir le code source de la page Web et sélectionner le code de ces tableaux de données associé à tous les éléments suivants : balise table (par exemple: <table summary="résumé du tableau"> <caption>titre du tableau</caption> [...] </table>).


  2. Appliquer le(s) test(s) suivant(s) :
  3. Valider le critère : le critère est validé si vous répondez oui au test applicable précédent.


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 d'outils Accessibilité du Web pour Internet Explorer (version 2.0 beta en français) :
Pour le test 5.4.a [Argent] :
  1. Sous Internet Explorer, ouvrir la page à analyser.
  2. Repérer les tableaux de données présents sur la page.
  3. Dans le menu "Tableaux" de la Barre d'outils Accessibilité du Web (version 2.0 beta), activer l'option "Mettre en valeur les tableaux de données"
  4. Des informations sur la structure de chaque tableau de données s'affichent
  5. Vérifier que chaque tableau de données a une balise caption.
  6. Si c'est le cas, le test est validé.

Evaluer avec la Barre d'Outils Web Developper pour Firefox (version 1.1.4 en français) :
Pour le test 5.4.a [Argent] :
  1. Sous Internet Explorer, ouvrir la page à analyser.
  2. Repérer les tableaux de données présents sur la page.
  3. Dans le menu "Entourer" de la Barre d'outils Accessibilité du Web (version 2.0 beta), activer l'option "Entourer les tableaux" puis l'onglet "Légendes de tableaux (Caption)".
  4. Le contenu des balises caption est entouré d'un liseret rouge.
  5. Vérifier que chaque tableau de données a une balise caption.
  6. Si c'est le cas, le test est validé.

revenir en haut de la page

Comment mettre en oeuvre

Avertissement : les informations du paragraphe "Comment mettre en oeuvre" sont données à titre indicatif. Les contenus des sous-paragraphes Implémentation et Exemple de bonne pratique ne présentent pas tous les codes d'implémentation.


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 titre 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

Avertissement : le contenu du paragraphe "Illustrations" est donné à titre indicatif. Il ne présente pas tous les cas possibles.


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

revenir en haut de la page

Fiche précédente : fiche du critère 5.3 Fiche suivante : fiche du critère 5.5

Guide AccessiWeb (version 3.1, 2 mars 2009) | Conditions d'utilisation | Contact
Copyright © 2009 Association BrailleNet. Tous droits Réservés.