Семантические элементы в HTML5

Семантический элемент (семантический тег) - тег, который имеет смысловое значение.

Спецификация HTML5 поддерживает ряд новых тегов для разметки статьи. Эти теги улучшают читаемость статьи для разработчика, возможно улучшают индексацию страницы для поисковиков (CEO).

Теги

• <article> - отдельная, независимая по смыслу статья
• <aside> -  блок сбоку от основного контента (как боковой блок страницы, sidebar).
• <details> - дополнительная информация, которую пользователь может открывать или закрывать
• <figcaption> - пояснение для элемента <figure>
• <figure> - используется для иллюстраций, диаграмм, фотографий, листингов кода и т.д.
• <footer> - нижний колонтитул
• <header> - верхний колонтитул, заголовок документа
• <main> - основной контент документа
• <mark> - выделенный (рлдсвеченный) текст
• <nav> - блок навигационных ссылок, меню документа
• <section> - элемент &lt;article&gt; определяет независимый, самодостаточный контент, элемент &lt;section&gt; определяет раздел в документе.
• <summary> -  видимый заголовок элемента <details>
• <time> - дата, время

Примеры макетов HTML документа