1178 sujets

Accessibilité du Web

[Résolu] Tableaux accessibles ou listes ?

Bonjour,

Je voudrais utiliser un tableau pour une page caddie.
Comme ce sont des données tabulaires je me disais que c'était préférable.
Toutefois, je viens de finir le tableau et j'ai besoin d'un conseil. La colonne quantite me pose un problème car d'autres informations que la quantité y figurent. Dois-je faire deux tableau ? Un pour le détail de la commande (liste des produits) et un autre pour le calcul des frais de port, l'affichage du total, etc. ? Ou ce tableau est-il correct ? Ou encore puis-je l'améliorer ?
       <table summary="Contenu du caddie et détail de la commande">
        <caption>
        Contenu de votre caddie 
        </caption>
        <tr> 
          <th id="supprimer">Supprimer</th>
          <th id="produit">Produit</th>
          <th id="puttc"><abbr title="Prix unitaire">P.U</abbr> <abbr title="Toutes taxes comprises">T.T.C</abbr></th>
          <th id="remise">Remise</th>
          <th id="quantite">Quantit&eacute;</th>
          <th id="letotal">Total <abbr title="Toutes taxes comprises">T.T.C</abbr></th>
        </tr>
        <tr> 
          <td headers="supprimer"><a href="#">Supprimer</a></td>
          <td headers="produit"><a href="#">Produit 1</a></td>
          <td headers="puttc">2793,00 &euro;</td>
          <td headers="remise">&nbsp;</td>
          <td headers="quantite"><label for="quantite">Modifier : </label> <input name="textfield" type="text" value="1" size="5" /></td>
          <td headers="letotal">2793,00 &euro; <abbr title="Toutes taxes comprises">T.T.C</abbr></td>
        </tr>
        <tr> 
          <td colspan="4" rowspan="5">&nbsp;</td>
          <td>Sous-total T.T.C :</td>
          <td headers="letotal">2793,00 &euro; <abbr title="Toutes taxes comprises">T.T.C</abbr></td>
        </tr>
        <tr> 
          <td>Frais de port :</td>
          <td headers="letotal">6,28 &euro; <abbr title="Toutes taxes comprises">T.T.C</abbr></td>
        </tr>
        <tr> 
          <td>Total H.T. :</td>
          <td headers="letotal">2 340,54 &euro; <abbr title="Hors taxes">H.T</abbr></td>
        </tr>
        <tr> 
          <td>TVA :</td>
          <td headers="letotal">458,74 &euro;</td>
        </tr>
        <tr> 
          <td>Net &agrave; payer :</td>
          <td headers="letotal"><strong>2799,28 &euro;</strong></td>
        </tr>
      </table>


Merci pour votre aide,
Modifié par jpsartre (16 Jun 2007 - 17:48)
En fait, j'hésite maitenant entre deux possibilités.

Ou bien deux tableaux, un pour la liste des produits et un autre pour le détail du paiement.

Ou bien seulement une suite de listes à puce pour les articles et une pour le détail de la somme à payer.

Y-a-t-il vraiment une différence entre ces deux dernières possibilités ?

Si vous avez un avis sur la question...
Bonsoir,
au niveau de l'organisation des donnée, sans avoir éudier la question de fond en comble, le seul conseil que je pourrais te donner a priori est de ne faire qu'un seul tableau, voire un tableau par produit.
A ce sujet je te conseillerais de lire cet article qui traite en partie de l'organisation des données dans un tableau.

Concernant ton <tr> d'en-tête, si tu conserve un relation uniquement verticale de l'en-tête et des données correspondantes, tu dois ajouter l'attribut scope comme ceci:
<tr> 
          <th scope="col" id="supprimer">Supprimer</th>
          <th scope="col" id="produit">Produit</th>
          <th scope="col" id="puttc"><abbr title="Prix unitaire">P.U</abbr> <abbr title="Toutes taxes comprises">T.T.C</abbr></th>
          <th scope="col" id="remise">Remise</th>
          <th scope="col" id="quantite">Quantit&eacute;</th>
          <th scope="col" id="letotal">Total <abbr title="Toutes taxes comprises">T.T.C</abbr></th>
        </tr>

N'oublies pas d'expliquer le fontionnement du tableau le plus simplement possible dans le summary.
Modifié par Hermann (13 Jun 2007 - 11:07)
Merci pour les informations.

Quand tu dis :
a écrit :
ne faire qu'un seul tableau, voire un tableau par produit


Si je ne fais qu'un tableau, la chose qui me dérange est que les données du bas de la colonne quantité n'on rien à voir avec la colonne quantité (Frais de port, etc.).

Alors peut-être faire un tableau pour les produits avec le scope et une liste à puce pour le détail du paiement.

J'attends encore quelques avis, si avis il y a, et je mets en résolu...


Merci encore
Bonjour,

En l'état, c'est un mélange de tableau de données et de tableau de présentation (mise en forme des sous-éléments "frais de port, total HT etc).

Pour rester dans une organisation rigoureuse de tableau de données, tous ces sous-éléments devraient être autant de colonnes du tableau (un produit = une ligne du tableau). Ce qui pose un problème de rendu, bien évidemment (tableau de largeur excessive)...
Sujet clos
Aller à