Web Design  »  Guide  »  Guida Accessibilità dei siti Web pratica 

Vediamo ora il codice che definisce un articolo in cssforma.htm:

<div class="articolo">
  Articolo n.1
</div>
<div class="data">
  data e autore
</div>
<div class="testo">
  sommario: testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo
</div>
<div class="leggi">
  <a href="cssforma.htm">leggi il seguito</a>
</div>

Ed ecco il corrispondente codice in struttura.htm:

<h2 class="articolo">
  Articolo n.1
</h2>
<p title="data e autore" class="data">
  data e autore
</p>
<p class="testo">
  sommario: testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo testo
</p>
<p class="leggi">
  <a href="cssforma.htm">leggi il seguito</a>
</p>

Come si vede, al titolo dell'articolo è stato opportunamente attribuito un elemento H, anche qui di secondo livello, come per il menu di navigazione. Le restanti voci sono state invece marcate con altrettanti elementi P. Ai paragrafi che riportano data e autore dell'articolo è stato aggiunto un attributo "title" contenente una breve descrizione, che aggiunge valore semantico (cioè un significato) agli altrimenti neutri elementi P.

Notate che in questo caso ci scontriamo con un limite di HTML e XHTML: lo scarso numero di elementi con cui si possono marcare strutturalmente dei blocchi di testo. Non considerando le tabelle e i vari tipi di elenco, per dare un valore semantico ad un blocco di testo possiamo usare H1...H6 se si tratta di un titolo, BLOCKQUOTE se si tratta di una citazione, P se si tratta di un paragrafo e... basta così!

Talvolta potrebbe essere utile, invece, avere qualche possibilità in più per definire strutturalmente un documento: pensando ad esempio ad un articolo di giornale, si potrebbero immaginare un elemento SOMMARIO, un elemento OCCHIELLO, un elemento AUTORE, e così via. Forse XHTML 2.0, attualmente in fase di sviluppo, risolverà in parte questo problema. Per il momento, accontentiamoci di marcare con dei P tutti i blocchi di testo che non sono titoli, magari specificando per mezzo di un attributo "title" il valore strutturale di alcuni P particolari all'interno del documento e usando i CSS per dare loro il giusto rilievo grafico. Ai fini dell'accessibilità del documento questo è più che sufficiente.

Altri articoli

Altre guide

Altre newsletter