HTML and CSS Reference
In-Depth Information
Come possiamo notare, i nuovi tag di HTML5 ci permettono di rappresentare in modo
mirato le diverse parti di cui la pagina si compone, aiutandola a raggiungere il miglior si-
gnificato a livello semantico.
Inoltre essi favoriscono la “lettura” del markup sia da parte dei browser in grado di
supportare la nuova versione del linguaggio, sia da parte di sistemi automatici come, per
esempio, un bot vocale o il crawler di un motore di ricerca. In HTML5, infatti, la struttura
della pagina è meno anonima e il markup diventa più descrittivo, dato che ogni elemento
denota il proprio contenuto in modo chiaro, a tutto vantaggio dei motori di ricerca, in grado
di interpretare e indicizzare al meglio il testo in funzione dei tag presenti nel markup.
L'elemento
section
permette di definire una sezione all'interno di una pagina. Una se-
zione rappresenta di fatto una porzione omogenea di contenuto, generalmente dotata di in-
testazione (
esempio 2.2
). Esempi significativi di una sezione possono essere una parte di
un articolo composta da una serie di paragrafi, la descrizione di un prodotto in un catalogo
oppure l'insieme delle informazioni di contatto.
Esempio 2.2
<section>
<h1>
Capitolo 2
- Nuovi elementi del markup</h1>
<p>Sebbene le sue specifiche non...</p>
</section>
L'elemento
section
non è pensato per essere un generico contenitore di markup come
il tag
div
, perché denota una sezione di contenuto dal punto di vista semantico. Pertanto,
la regola generale prevede che dobbiamo utilizzare questo tag per includere contenuti della
pagina che sono effettivamente visualizzati dal browser. Se la necessità è quella di definire
un blocco unicamente per applicare un particolare stile o per esigenze di scripting, allora
l'elemento
div
rappresenta ancora la scelta corretta.
Internamente a una sezione possiamo opzionalmente definire un'intestazione. Essa può es-
sere composta da uno o più tag
h1
…
h6
, che solitamente permettono di definire titoli e
sottotitoli (più basso è il numero, più grande è la dimensione del testo). In HTML5 questi