Тег
<div> — это самый универсальный и широко используемый HTML-элемент. Сам по себе
<div> не представляет ничего, но он, в то же время, позволяет разработчикам превратить его почти во всё что угодно. Делается это посредством использования CSS (для стилизации), JavaScript (для функционала) и ARIA (для обеспечения доступности контента).
Эта универсальность позволяет использовать теги
<div> для множества самых разных целей, но, к сожалению, такая вседозволенность может легко привести к злоупотреблениям. Когда тегом
<div> пользуются недостаточно осмотрительно, в итоге может получиться
<div>-суп, контент, лишённый семантического значения, интерактивные элементы, не отличающиеся доступностью, или некая комбинация этих нехороших явлений.
Грубые нарушения при использовании
<div> выявить сравнительно просто (подробнее об этом поговорим ниже). Но мы дошли до того, что кто-то может назвать «образцом недоступности контента» полностью правильное использование
<div>, или, как минимум, пример лёгкого отклонения от правильности. В таких ситуациях говорят о том, что «кому-то стоило бы вместо
<div> воспользоваться семантическим HTML-элементом».
Тег <div> приходит на вечеринку, где его встречает команда A11y
Ладно. Притормозим немного. Прежде чем дружно задирать нос перед применением тегов
<div> — давайте вспомним о том, что контекст — это важно.
Конечно, всегда, когда это возможно, нужно использовать семантические элементы. Но предлагаю проявить осторожность, создавая такую атмосферу, когда может показаться, что любой вариант использования
<div> — это плохо… или — что замена некоего
<div> на «более семантический» элемент способна улучшить доступность некоего документа.
Прежде чем об этом поговорить — ненадолго вернёмся в прошлое и заглянем туда, откуда взялся тег
<div>.
