Diodati.org | Accessibilità e traduzioni dal W3C      Leggi Omega Centauri!

Sponsor ufficiale di Diodati.org: Hosting a partire da 3,33 Euro/mese | Domini a partire da 10,79 euro/anno | Server dedicati a partire da 40 euro/mese, VPS Hosting da 30 euro/mese

Una delle più strane leggende metropolitane diffusesi negli ultimi tempi tra la comunità degli sviluppatori di pagine web è che non si possono più usare le tabelle. E' una di quelle convinzioni sbagliate che nascono dal tam-tam incontrollato delle voci e che sono favorite dal fatto che nessuno di quelli che propagano la leggenda si sia mai preoccupato di andare a trovare la fonte normativa, il documento W3C che sarebbe all'origine della proibizione. Ed ecco la corsa affannosa al tentativo di trasformare in una serie sbilenca di DIV l'infernale griglia di tabelle annidate, con cui si era soliti fino a ieri formattare le proprie pagine . Ecco ancora lo sforzo di rendere in altro modo persino il contenuto di normali tabelle di dati.

In realtà questo divieto all'uso delle tabelle non esiste da nessuna parte. Nelle specifiche HTML 4.01 e nelle WCAG 1.0 si raccomanda semplicemente agli sviluppatori di non usare, finché è possibile, le tabelle a scopo di presentazione ("layout tables"), ma di riservarne l'uso alla funzione strutturale per la quale sono state progettate: incasellare dati tabellari. E neppure le tabelle usate a scopo di impaginazione vengono proibite in modo assoluto: si dice di non usarle, a meno che il loro contenuto non conservi significato una volta linearizzato... il che accade per la verità abbastanza di frequente.

Accertato dunque che le tabelle si possono ancora usare, vediamo ora come rendere accessibile una tabella di dati.

La tabella che vogliamo rendere accessibile è la seguente (il suo contenuto è tratto dalla traduzione in italiano del capitolo 11 delle Specifiche HTML 4.01):

Uno sviluppatore "vecchia maniera", non abituato a porsi problemi di accessibilità, scriverebbe con ogni probabilità il codice di questa tabella nel modo seguente (o piuttosto lo farebbe scrivere da un programma del tipo di FrontPage, che gli darebbe la possibilità di occuparsi solo dell'aspetto grafico della tabella, disinteressandosi completamente del codice sottostante):

<table border="1" cellpadding="5" cellspacing="2">
  <tr>
    <td colspan="5"><b>Corsi comunitari -- Bath, Autunno 1997</b></td>
  </tr>
  <tr>
    <td><b>Nome del corso</b></td>
    <td><b>Insegnante</b></td>
    <td><b>Descrizione</b></td>
    <td><b>Codice</b></td>
    <td><b>Tassa</b></td>
  </tr>
  <tr>
    <td>Dopo la Guerra Civile</td>
    <td>Dr. John Wroughton</td>
    <td>
      Il corso esaminerà i turbolenti anni in
      Inghilterra dopo il 1646. <i>6 incontri settimanali, a
      partire da Lunedì 13 Ottobre.</i>
    </td>
    <td>H27</td>
    <td>£32</td>
  </tr>
  <tr>
    <td>Introduzione all'Inghilterra degli Anglo-Sassoni</td>
    <td>Mark Cottle</td>
    <td>Corso di un solo giorno, introduttivo alla
      ricostruzione della società anglo-sassone nel
      Primo Medioevo. <i>Sabato 18 Ottobre.</i></td>
    <td>H28</td>
    <td>£18</td>
  </tr>
  <tr>
    <td>Lo splendore della Grecia Antica</td>
    <td>Valerie Lorenz</td>
    <td>Luogo di nascita della democrazia, della filosofia,
      patria d'elezione del teatro e della disputa logica.
      Ciò che i Romani hanno fatto, i Greci lo avevano
      realizzato per primi. <i>Sabato 25 Ottobre 1997
      (giorno scolastico)</i></td>
    <td>H30</td>
    <td>£18</td>
  </tr>
</table>

Notate che le voci che strutturalmente rappresentano le intestazioni delle colonne (nome del corso, insegnante, descrizione, ecc.) sono state rese in grassetto tramite l'elemento B, il che le evidenzia per la sola presentazione visuale. Nel codice di marcatura della tabella non è presente alcuna informazione contestuale, che possa aiutare un non vedente a comprendere la struttura, cioè le relazioni esistenti tra le varie celle.