De innovaties van de HTML5-specificatie zijn talrijk en veel ervan worden al ondersteund door het grootste deel van het browserlandschap - hieronder wil ik een interessante wijziging van de regels voor het nesten van elementen benadrukken. HTML heeft altijd onderscheid gemaakt tussen blok- en inline-elementen. De documenttypedefinitie van HTML4 noemt bijvoorbeeld h1, p en div als blokelementen en a, span, img als inline-elementen.
Dit concept is nu verlaten (om goede redenen). In sommige gevallen negeerden veel webontwerpers de juistheid van de genoemde nestregel dat er geen blokelementen mogen worden gelokaliseerd binnen inline-elementen of het standaardgedrag met behulp van CSS-regels zoals display: inline; of display: blok; (wat vaak leidde tot ongeldige code) zonder verder oponthoud.
HTML5 verzacht dit onderscheid nu en noemt zelfs 9 verschillende categorieën waartoe een element kan behoren, waarbij een element in meerdere categorieën kan vallen. Het oude onderscheid tussen block- en inline-elementen wordt overboord gegooid en er wordt rekening gehouden met de veelheid aan betekenissen van tags op het web. Dit heeft in het bijzonder tot gevolg dat de volgende constructies geldige code vertegenwoordigen:
<a href="#">
<div>
<h1>Yeah</h1>
<p>
Der ganze Block ist verlinkt.
</p>
</div>
</a>
Een hele container met verdere blokelementen was voorheen alleen mogelijk (met geldige code) met trucs (bijvoorbeeld door absolute positionering van een gekoppelde overlay-laag). U kunt ook de kop en de alinea aan elkaar koppelen - dit leidde op zijn beurt tot overtolligheid en de container is niet klikbaar. Met de welkome aanvulling op HTML5 is dit geen probleem meer.