Отличия элементов section, div и article в семантической вёрстке заключаются в их назначении и характере содержимого: vk.com vivasart.com
- div — универсальный блочный элемент, у которого нет полноценного самостоятельного значения. vk.com Предназначен для группировки контента, который семантически никак не связан между собой. vk.com Чаще всего используется как контейнер для других элементов. vk.com
- section — более конкретный элемент, который применяется к общим разделам контента, семантически связанного между собой. vk.com vivasart.com Содержимое тега имеет «тему», которую необходимо указать с помощью заголовка. vk.com Например, блок новостей, преимуществ или услуг на сайте. vivasart.com
- article — ещё более уточняющий и конкретный элемент, чем section. vk.com Применяется к семантически связанному блоку контента и должен иметь заголовок. vk.com Содержимое должно быть независимым и самодостаточным — это отдельная статья. vk.com Чаще всего используется для статьи на сайте, отдельной новости, поста блога, сообщения форума или комментариев. vk.com
Таким образом, div используется, когда контент никак не связан между собой, section — когда есть семантическая логика и вложенные элементы, которые можно объединить в рамках единого смыслового блока, а article — когда контент имеет сильную семантическую взаимосвязь и может быть выделен из контекста сайта без ущерба смысловой нагрузки. vivasart.com