Микроразметка

В статье будет кратко рассказано о наиболее важных теоретических и практических моментах микроразметки сайта.

Предназначение микроразметки

Микроразметка (или семантическая разметка) страницы проявляется в использовании вспомогательных тегов для смысловой дифференциации элементов сайта, учитываемой поисковыми машинами при ранжировании.

Другое преимущество микроразметки — отображение сниппетов, которые намекают на релевантность содержащейся на ресурсе информации и заставляют интернет-пользователей перейти по ссылке.

Основные типы микроразметки

Если под типом семантической разметки понимать словарь тегов, то наиболее распространёнными в наши дни видами микроразметки являются:

• schema.org — используется такими поисковиками, как Google, Yandex, Yahoo;
• Open Graph — применяется для разметки соцсетей (Facebook, Twitter, VK);
• микроформаты семейства h+ — относительно старый словарь, от которого современные сайты отказываются в пользу двух вышеперечисленных типов.

Также существует Data Vocabulary от Google, дополняющий schema.org.

Предпочтительный формат

Поисковые системы отдают предпочтение schema.org, поэтому для семантической разметки рекомендуется использоваться именно данный словарь. Стоит сказать, что результаты ранжирования не зависят от возможного использования нескольких типов разметки.

Проверка разметки в заготовке сайта

Большинство используемых для создания сайтов шаблонов содержат в себе тот или иной тип микроразметки — практика показывает, что наиболее часто в англоязычных заготовках встречаются микроформаты.

Проверить словарь можно с помощью валидаторов от Yandex («Вебмастер») и Google («Проверка структурированных данных»). Интерфейс российской разработки наиболее лаконичен и понятен.

Удаление сторонней разметки

Для удаления обнаруженных валидатором микроформатов потребуется:

• открыть код корректируемой веб-страницы в редакторе;
• с помощью инструмента «Заменить на» найти тег микроформата (например, hCard);
• переименовать все найденные атрибуты в любой несуществующий «атрибут»;
• выполнить аналогичные действия с файлом стиля.

Необходимо заметить, что удаление тега приведёт к нарушению структуры семантической разметки — в данном случае изменение имени атрибута является единственным решением.

Внедрение schema.org

Внедрение schema.org подразумевает «ручное» добавление к каждому элементу сайта соответствующий смысловой атрибут. Примеры представлены далее.

Для статьи

Алгоритм добавления семантической разметки поста выглядит следующим образом:

1. Поиск тега статьи single.php.
2. Добавление внутрь найденного атрибута смысловой тег “main_content_post”.
3. Написание внутренних тегов, несущих в себе дополнительную информацию о публикации.
4. Выполнение аналогичной замены атрибутов с оставшимися страницами документа.

Использование дополнительных атрибутов не является обязательным, но способно повысить доверие поисковиков к ресурсу.

Для главной страницы

Процесс микроразметки главной страницы практически идентичен описанному выше алгоритму: разница заключается в применение тега blogposting вместо main_content_post. Добавление дополнительных атрибутов к анонсам статей положительно отразится на результатах ранжирования.

Для комментариев

Добавление schema.org в блок комментариев является наиболее сложной операцией. Алгоритм представлен ниже:

• Добавление schema_comment перед тегом <?php в файле functions.php.
• Проверка работоспособности получившегося кода — при ошибке потребуется разместить смысловой атрибут между тегами открытия и закрытия <?php.
• Замена wp_list_comments на schema_comment в файле comments.php с сохранением имеющихся свойств (использовать символ “&”).
• Размещение itemprop=»commentCount внутри открывающегося тега <?php для обозначения количества комментариев.

Важно отметить, что семантическая разметка количества комментариев подразумевает использование лишь атрибута и цифр.

Для хедера сайта

Разметка шапки выглядит как:

1. Поиск открывающегося тега.
2. Добавление в header “itemtype=»schema.org/WPHeader”.
3. Обозначение H1 как itemprop=»headline», H2 — itemprop=»description».

Хотя H1 и H2 — наиболее часто встречающиеся обозначения заголовка и описания публикации, в некоторых шаблонах данные атрибуты могут иметь другое наименование.

Для сайдбара

Для семантической разметки боковой панели потребуется:

• Открыть sidebar.php.
• Обозначение свойств панели с помощью описания подключённых виджетов — использовать тег span и itemprop=»…» в блоке register_sidebar.
• Выполнение аналогичной операции в остальных частях кода.

При наличии в шаблоне div применять span необязательно.

Для подвала

Разметка футера предполагает:

1. Открытие php.
2. Добавление в открывающийся тег itemscope itemtype=»schema.org/WPFooter».
3. Вставку itemprop=»copyrightYear» в свойства даты.

Дата должна указываться только цифрами.

Для главного навигационного меню

Для добавления schema.org в меню навигации следует:

• В файле header.php найти строку wp_nav_menu.
• Вставить внутрь тега с указанным ранее свойством itemscope itemtype=»schema.org/SiteNavigationElement»
• Обозначить каждую ссылку как itemprop=»url».

Данный метод несовместим с шаблонами, имеющими нестандартную структуру отображения меню.

Для контактных данных

Разметка контактных данных заключается лишь в добавление тега <div itemscope itemtype=»http://schema.org/PostalAddress»> на нужную страницу веб-сайта. Личные данные вносятся в блок с помощью открывающегося тега span.

После добавления микроразметки в тот или иной раздел сайта необходимо проверить результат при помощи валидатора, после чего загрузить успешно обновлённые файлы на сервер.