Инновации в спецификации HTML5 многочисленны, и многие из них уже поддерживаются большинством браузеров - ниже я хочу выделить интересное изменение правил для вложенных элементов. В HTML всегда проводилось различие между блочными и встроенными элементами. Например, определение типа документа HTML4 называет h1, p и div как блочные элементы, а a, span, img как встроенные элементы.
Теперь от этой концепции отказались (по уважительным причинам). В некоторых случаях использования многие веб-дизайнеры игнорировали правильность указанного правила вложения, согласно которому элементы блока не могут быть расположены внутри встроенных элементов, или стандартное поведение с использованием правил CSS, таких как display: inline; или display: block; (что часто приводило к неверному коду) без лишних слов.
HTML5 теперь смягчает это различие и даже называет 9 различных категорий, к которым может принадлежать элемент, при этом элемент может быть в нескольких категориях. Старое различие между блочными и встроенными элементами отбрасывается за борт и учитывается множество значений тегов в сети. В частности, это приводит к тому, что следующие конструкции представляют действительный код.:
<a href="#">
<div>
<h1>Yeah</h1>
<p>
Der ganze Block ist verlinkt.
</p>
</div>
</a>
Ранее связывание целого контейнера, содержащего другие блочные элементы, было возможно (при наличии корректного кода) только с помощью обходных путей (например, путем абсолютного позиционирования связанного слоя наложения). В качестве альтернативы можно было связать заголовок и абзац, что, в свою очередь, приводило к избыточности и делало контейнер некликабельным. Благодаря расширению HTML5 эта проблема больше не актуальна.