Page 29 - Guida tascabile HTML5
P. 29
<dd>Frequenza 329,63 Hz</dd>
<dd>Frequenza 659,26 Hz</dd>
</dl>
Ricordate che non è consentito, all’interno di un tag <dl>, utilizzare più tag <dt>
con lo stesso valore: ogni termine deve essere univoco, se necessario seguito da
più descrizioni <dd>, come nell’esempio appena illustrato.
Le tabelle
All’organizzazione dei contenuti in tabelle è dedicato un altro insieme di tag: è
possibile distinguere righe e colonne di intestazione dai dati veri e propri, e
intervenire in modo piuttosto sofisticato su alcune proprietà.
ATTENZIONE Agli albori del Web, quando ancora non era possibile utilizzare fogli di
stile CSS per gestire l’aspetto degli elementi, le tabelle sono state utilizzate dagli
sviluppatori per creare griglie da “vestire” graficamente: questa prassi, oggi del tutto
sorpassata, non teneva minimamente conto del valore semantico di questi elementi.
Oggi, grazie alla maturità del linguaggio e alle possibilità offerte dai tag semantici,
potete utilizzare le tabelle quando appropriato: l’eventuale allineamento o
impaginazione dei contenuti deve sempre essere rimandata a regole CSS adeguate,
associate al documento.
Iniziamo analizzando un semplice esempio di markup con gli elementi
indispensabili per la descrizione di una tabella.
<table border="1">
<tr>
<td>Lunedì</td>
<td>Martedì - Venerdì</td>
<td>Sabato</td>
</tr>
<tr>
<td>15:00</td>
<td>10:00</td>
<td>10:00</td>
</tr>
<tr>
<td>19:00</td>
<td>19:00</td>
<td>20:00</td>
</tr>
</table>
Il tag <table> racchiude la struttura della tabella, con un tag <tr> (table row) per
ogni riga, che a sua volta contiene un tag <td> (table data) per ogni cella.
NOTA L’attributo border="1" del tag <table> permette di visualizzare la struttura delle
celle. Come già sottolineato, è consigliabile evitare di legare il markup HTML alla
presentazione, e gestire l’aspetto degli elementi solo con i fogli di stile CSS. Negli
esempi sarà utilizzato solo per maggiore chiarezza.