Le innovazioni della specifica HTML5 sono numerose e molte di esse sono già supportate dalla maggior parte del panorama dei browser - di seguito voglio evidenziare un interessante cambiamento alle regole per la nidificazione degli elementi. L'HTML ha sempre distinto tra elementi di blocco e inline. La definizione del tipo di documento di HTML4, ad esempio, nomina h1, p e div come elementi di blocco e a, span, img come elementi inline.
Questo concetto è stato ora abbandonato (per buone ragioni). In alcuni casi, molti web designer hanno ignorato la correttezza di detta regola di annidamento secondo cui nessun elemento di blocco può essere posizionato all'interno di elementi inline, o il comportamento standard che utilizza regole CSS come display: inline; oppure visualizzare: blocco; (che spesso portava a codice non valido) senza ulteriori indugi.
HTML5 sta ora ammorbidendo questa distinzione e nomina anche 9 diverse categorie a cui può appartenere un elemento, per cui un elemento può essere in diverse categorie. La vecchia distinzione tra elementi block e inline viene gettata a mare e vengono presi in considerazione i molteplici significati dei tag sul web. In particolare, ciò ha come conseguenza che i seguenti costrutti rappresentano un codice valido:
<a href="#">
<div>
<h1>Yeah</h1>
<p>
Der ganze Block ist verlinkt.
</p>
</div>
</a>
Un intero contenitore che conteneva ulteriori elementi di blocco in precedenza era possibile solo (con codice valido) utilizzando trucchi (ad esempio mediante il posizionamento assoluto di uno strato di sovrapposizione collegato). In alternativa, hai collegato l'intestazione e il paragrafo: questo a sua volta ha portato alla ridondanza e il contenitore non è selezionabile. Con la gradita aggiunta a HTML5, questo non è più un problema.