Новый HTML5
РАЗДЕЛ элемент может быть несколько запутанным. Если вы создавали HTML-документы до HTML5, скорее всего, вы уже используете этот элемент для создания структурных подразделений внутри ваших страниц, а затем создавайте страницы с ними. Поэтому может показаться естественным, что вы просто замените существующее
DIV элементы с
РАЗДЕЛ элементы. Но это технически неверно. Поэтому, если вы не просто замените
DIV элементы с
РАЗДЕЛ элементы, как вы используете их правильно?
Элемент СЕКЦИЯ - это семантический элемент
Первое, что нужно понять, это то, что
РАЗДЕЛ элемент - это семантический элемент. Это означает, что он предоставляет смысл как пользовательским агентам, так и людям о том, что вложенный контент - это, в частности, раздел документа.
Это может показаться очень общим семантическим описанием, и это потому, что оно есть. Существуют и другие элементы HTML5, которые предоставляют больше семантических различий вашему контенту, который вы должны использовать, прежде чем использовать
РАЗДЕЛ элемент:
-
СТАТЬЯ
-
В СТОРОНУ
-
СЧА
Когда использовать элемент СЕКЦИЯ
Использовать
СТАТЬЯ когда контент является независимой частью сайта, который может стоять в одиночестве и быть синдицированным как статья или сообщение в блоге. Использовать
В СТОРОНУ когда контент тангенциально связан либо с содержимым страницы, либо с самим сайтом, например с боковыми панелями, аннотациями, сносками или связанной информацией сайта. Использовать
СЧА элемент для контента, который является навигацией.
РАЗДЕЛ element - это общий семантический элемент. Вы используете его, когда ни один из других семантических элементов контейнера не подходит. Вы используете его для объединения частей документа вместе в отдельные единицы, которые вы можете каким-то образом описать. Если вы не можете описать элементы в разделе в одном или двух предложениях, вы, вероятно, не должны использовать этот элемент.
Вместо этого вы должны использовать
DIV элемент.
DIV элемент в HTML5 является не семантическим элементом контейнера. Если контент, который вы пытаетесь объединить, не имеет семантического значения, но вам все равно нужно объединить его для стилизации, тогда
DIV элемент является подходящим элементом для использования.
Как работает элемент СЕКЦИИ
Раздел вашего документа может отображаться как внешний контейнер для статей и
В СТОРОНУ элементы. Он также может содержать контент, который не является частью
СТАТЬЯ или же
В СТОРОНУ,
РАЗДЕЛ элемент также можно найти внутри
СТАТЬЯ,
СЧА, или же
В СТОРОНУ, Вы даже можете встраивать разделы, чтобы указать, что одна группа контента является разделом другой группы контента, которая является разделом статьи или страницы в целом.
РАЗДЕЛ элемент создает элементы внутри контура документа. И как таковой, вы всегда должны иметь элемент заголовка (
H1 через
H6) как часть раздела. Если вы не можете найти заголовок раздела,
DIV элемент, вероятно, более уместен. Помните, что если вы не хотите, чтобы заголовок раздела отображался на странице, вы всегда можете замаскировать его с помощью CSS.
Когда не использовать элемент СЕКЦИЯ
Помимо вышеприведенного совета сначала использовать более конкретные семантические элементы, есть одна определенная область, в которой вы не должны использовать
РАЗДЕЛ элемент: только для стиля.
Другими словами, если единственная причина, по которой вы помещаете элемент в этом месте, - это привязать свойства стиля CSS, вы не должны использовать
РАЗДЕЛ элемент. Найдите семантический элемент или используйте
В конечном счете это не имеет значения
Трудность написания семантического HTML заключается в том, что для меня семантический смысл может быть для вас совершенно бессмысленным. Если вы чувствуете, что можете оправдать использование
РАЗДЕЛ элемент в ваших документах, то вы должны использовать его. Большинство пользовательских агентов не заботятся и будут отображать страницу так, как вы могли бы ожидать,
DIV или
РАЗДЕЛ.
Для дизайнеров, которые любят быть семантически корректными, используя
РАЗДЕЛ элемент семантически допустимым способом. Для дизайнеров, которые просто хотят, чтобы их страницы работали, это не так важно. Мы считаем, что написание семантически допустимого HTML является хорошей практикой и делает страницы более надежными. Но в конце концов это зависит от вас.