Привет. Сегодня расскажу про семантические теги HTML5. Как и где их использовать, в какой последовательности. Кстати для seo они хорошо заходят, типа если их использовать, то поисковики будут любить ваш сайт лучше. Сам я не проверял, но так говорят! Понятное дело, что можно написать такой «классный» контент, что ни какие теги не помогут.
Семантические элементы для работы со структурой страниц. Секционные элементы
,
Семантические элементы для работы с текстом
,
Элементы для работы с веб-формами и интерактивности
(старый элемент, но со многими новыми подтипами),
Элементы для поддержки аудио, видео и подключаемых модулей
Поддержка холста
Были удалены элементы оформления, такие как,
,,и.
Я раньше то об этих тегах и не слышал, встречал только разве, что и
, но не использовал.
Тег —
Используется для группировки записей – публикаций, статей, записей блога, комментариев. Представляет собой независимый обособленный блок, предназначенный для многократного использования. Как правило, начинается с заголовка. Может дублироваться на других страницах сайта и содержать внутри другие элементы , которые близки по содержанию к внешней статье. Если на странице только одна статья с заголовком и текстовым содержимым, её не нужно обертывать элементом .
Т.е. можно использовать на главной странице, в рубриках этого блока. Каждый блок обернуть в этот тег.
Скриншот главной страницы
Тег —
Представляет собой универсальный раздел документа. Группирует тематическое содержимое и обычно содержит заголовок. Один не используется многократно. Не является блоком-оберткой: для этих целей уместнее использовать элемент
. В качестве содержимого может выступать оглавление, разделы научных публикаций, программа мероприятия. Домашняя страница сайта также может быть поделена на секции – блок вводной информации, новости и контакты.
Представьте себе лендинг, вот там вся страница поделена на блоки. Вместо div можно использовать section.
Также article можно использовать внутри тега section.
Тег —
Группирует содержимое, связанное с окружающим его контентом напрямую, которое можно счесть отдельным (т. е. удаление этого блока не повлияет на понимание основного содержимого). Чаще всего элемент позиционируется как боковая колонка (как в книгах) и включает в себя группу элементов:
Использование элемента
Тег
Представляет собой нижний колонтитул содержащей его секции или корневого элемента. Обычно содержит информацию об авторе статьи, данные о копирайте и т. д. Если используется как колонтитул всей страницы, содержимое дополняется сведениями об авторских правах, ссылками на условия использования, контактную информацию, ссылками на связанное содержимое и т. п.
В одном веб-документе может быть несколько элементов
Т.е. по сути каждый элемент на странице можно поделить на блоки, подблоки и подблоки… Все зависит только от вашей фантазии. Также можно применять в карточке товара. Например, карточка товара:
Section.
Заголовок — h2.
Текст — p.
Footer.
Section.
Тег
Предназначен для хранения контактной информации автора (адрес, телефон, e-mail, ссылка на сайт и др.) и может включать в себя любые элементы HTML вроде ссылок, текста, выделений и т. д. Планируется, что поисковые системы будут анализировать содержимое этого элемента для сбора информации об авторах.
не должен использоваться для разметки почтовых адресов в целом, только для контактной информации.
Используйте
в следующем контексте:
если располагается внутри , то информация внутри относится ко всему документу в целом;
если располагается внутри , то информация внутри относится к автору статьи.
Загрузка...
