Интересующимся новостями вебмастерам уже набили оскомину статьи про семантическую разметку HTML5 — о том, как круто и полезно использовать новые теги при вёрсткие. И названия этих тегов говорят сами за себя, так что любой бот с ними в курсе, где на вашей странице статья, где шапка, а где сайдбар. В идеале выглядит хорошо, а в реале... Правильно ли мы понимаем предписания по использованию новых семантических тегов html5?

Вкратце, суть новых тегов такова — заменить ничего не значащий (нейтральный) тег <div> другим тегом, название которого подсказывает суть его содержимого. Например, меняем <div id="header"> на <header>. Так HTML-текст страницы становится более читабельным, особенно для поисковых роботов. Картина получается вот такая:

И мозг вебмастера сразу понимает это так: header — это шапка сайта, nav — навигация по сайту, aside — сайдбар, footer — подвал, article — статья (основной контент). Немного непонятно про section — но объединю этим тегом какую-либо врезку в статью. Так мы отделим основной оптимизированный контент (по которому хотим ранжироваться в топе) от дизайна, рекламы и триггеров целевых действий, и будем ждать профита в виде раскрутки сайта. Но действительно ли такой смысл вложили в новые теги авторы HTML5?

Возьмём к примеру <header>, описание тега на официальном сайте спецификации W3C:

The <header> element represents a group of introductory or navigational aids.

Что в переводе даёт нам:

Элемент <header> представляет собой группу вводных или навигационных вспомогательных элементов.

А если это перевести ещё и на человеческий язык, получается, что в блоке header ожидается заголовок статьи, введение и навигация по документу, если использовать этот тег по назначению. А мы хотим запихнуть в этот тег шапку сайта, имеющую косвенное отношение к содержанию статьи?

А теперь смотрим там же (на w3c.org — в первоисточнике) описание тега <article> — и ситуация подтверждается. Приведу простой и наглядный пример, демонстрирующий, как предписано использовать тег article в посте блога:

Подчёркиваю ещё раз, что пример взят с официального сайта — из спецификации семантической разметки HTML5. Как видите, теги header и footer являются частью статьи, вложены в тег article. Header содержит группу вводных элементов, а в footer заключены комментарии.

Делаю вывод, что семантическая разметка создана для структурирования контента (основного материала сайта, статьи), а не всей страницы сайта. Обычно шапка сайта, подвал, сайдбары, навигация по сайту не имеют отношения к структуре статьи, размещённой на конкретной странице. Потому новыми тегами HTML5 мы должны при необходимости размечать только статью при её написании, но не тему оформления сайта.

Не знаю, кому как, но мне пока хватает размечать структуру статей заголовками h1-h6. И даже подзаголовками пользуюсь лишь в длинных статьях, и обхожусь 3-мя уровнями заголовков. А книг в одном html-документе я не пишу, потому в более сложном структурировании материала потребности не испытываю. Также смотрю, что в конкурентных топах страницы с разметкой HTML5 редко встречаются. Скорее всего, для SEO она особого значения не имеет, особенно ввиду непредсказуемости её использования вебмастерами.

  • Рубрика: SEO

Запись опубликована 28 апреля 2017 года. Кто-то говорил, что я мало пишу в рубрику «SEO», так читайте же:

Подписка на RSS канал блога RSS подписка (как это?) поможет вам не пропустить ничего интересного на этом блоге.