10 - Fornire informazioni contestuali nelle liste HTML
A cura di Maurizio Vittoria | martedì 26 novembre 2002
Link permanente
Punti di controllo in questa sezione:
- 3.6 Marcare le liste ed elencare i suoi elementi in modo appropriato. [Priorità 2]
- 13.2 Fornire dei metadata per aggiungere informazioni semantiche alle pagine e ai siti. [Priorità 2]
Gli sviluppatori sono incoraggiati a usare UL per gli elenchi non numerati, e OL per gli elenchi numerati (cioè l’uso appropriato del markup) combinato con i CSS per fornire le informazioni contestuali.
Il seguenti CSS2 mostrano come fornire numeri composti per liste annidate create sia con UL, sia con OL. Gli elementi sono numerati come “1″, “1.1″, “1.1.1″, ecc.
Esempio:
<style type="text/css">
ul, ol { counter-reset: item }
li { display: block }
li:before { content: counters(item, “.”);
counter-increment: item }
</style>
Fino a quando i CSS2 non saranno largamente sopportati dai browsers o i browser stessi non permetteranno agli utenti di poter controllare le liste con altri mezzi, gli autori dovrebbero provvedere a fornire indicazione contestuali. nelle liste nidificate.
Il seguente esempio di CSS1 mostra come nascondere la fine di un elenco quando i CSS sono letti, e farla vedere quando i CSS non sono supportati.
Esempio:
<style type="text/css">
.finelista { display: none }
</style>
<ul>
<li>Colori:
<ul>
<li>bianco</li>
<li>rosso</li>
<li>verde
<span class=”finelista”>(Fine dei colori)</span>
</li>
</ul>
</li>
<li>Fiori:
<ul>
<li>Rosa</li>
<li>Tulipano</li>
<li>Margherita
<span class=”finelista”>(Fine dei fiori)</span>
</li>
</ul>
</li>
<li>Computer:
<ul>
<li>Schermo</li>
<li>Tower</li>
<li>Tastiera.
<span class=”finelista”>(Fine del computer)</span>
</li>
</ul>
<span class=”finelista”>(Fine di tutto l’elenco)</span>
</li>
</ul>
Nota: Nel caso di liste molto composte, con qualche sforzo maggiore l’autore potrebbe mettere simile markup alla fine di ogni elemento dell’elenco.
Continua l’argomento con…
- 1 - Ridurre la manutenzione aumentando l’uniformità
- 2 - Possibilità di controllare i CSS
- 3 - Unità di misura
- 4 - Contenuto generato dai CSS
- 5 - Caratteri
- 6 - Effetti di stile del testo
- 7 - Testo al posto delle immagini
- 8 - Formattazione e posizione del testo
- 9 - Colori
- 11 - Layout, posizioni, livelli ed allineamento
- 12 - Righe e bordi
- 13 - Usare i CSS ed il markup di posizione per una trasformazione elegante
- 14 - Creare movimento con i CSS e scripts
- 15 - CSS sonori
- 16 - Accesso alla rappresentazione alternativa del contenuto
- 17 - Tipi di Media
- 18 - Riferimenti
- Abstract
- Lo stato di questo documento
- 19 - Risorse
- 20 - Riconoscimenti
- Indice dei contenuti
