Выпуск №105. Микроразметка

Как улучшить позиции сайта в поисковой выдаче? Упорядочить контент на сайте с помощью микроразметки, то есть добавить в HTML-код страницы специальные теги и атрибуты, которые помогают роботам точнее распознавать и структурировать информацию.

О том, что такое микроразметка и как ее применить для своего сайта, пойдет речь в сегодняшнем выпуске.

Польза от применения

• Пользователь получает корректный ответ на свой запрос в виде привлекательного сниппета и с большей вероятностью посетит сайт, что ведет к увеличению трафика из поиска.
• Машина с помощью семантической разметки страниц без проблем извлекает данные, может их помещать в базу и как угодно обрабатывать.
• Поисковая система формулирует для пользователя «человекочитаемый» понятный ответ.
• Стандарты, классы и свойства прописаны и определены настолько скрупулезно, что поисковик выдает исключительно релевантный ответ на запрос. Ошибки быть не может.
• Несмотря на очевидную выгоду от применения, реально используют семантическую разметку буквально единицы сайтов. Именно поэтому перед вами возможность применить непопулярную методику и значительно улучшить позиции сайта в поисковой выдаче.

Из чего состоит?

• Словарь. Помогает определить суть того, что есть на странице. Это классы и их свойства, набор обозначений. Для понимания его можно сравнить с языком. Например, он напрямую влияет на выбор термина, которым будет указываться название — «name», «title» или «n».
• Синтаксис. Это применение словаря. Он обозначает, какие теги будут указаны, а также сущность и ее свойства.

Развитие такой семантической разметки осуществлялось в несколько этапов. Концепцию пытались разработать несколько инициативных групп. Таким образом появилось множество синтаксисов и словарей. Для понимания структуры приведем такую схему:

Сниппеты для страницы сайта в поисковой выдаче с использованием разметки и без нее заметно отличаются. Пример сайта, который не применяет семантическую разметку:

А теперь обратите внимание на отображение сайта с применением семантической разметки:

Словарь

Schema.org является крупнейшим словарем для внедрения микроразметки. Его взялись разрабатывать самые крупные поисковые системы. Такое решение было принято в целях удобства, чтобы веб-мастера для каждого поисковика не размечали отдельно. С помощью этой разметки можно получать специальные сниппеты в выдаче поиска. Его поддерживают «Яндекс», Google, Yahoo! и Bing. В этом словаре несколько сотен сущностей объединены в классы и их свойства представлены в виде иерархии. Он постоянно дополняется и совершенствуется. Пример разметки для описания личности:

Как внедряется разметка?

Сначала определенное описание оборачивается в контейнер со схемой разметки:

Затем производится разметка отдельных свойств и указываются конкретные свойства схемы:

Можно ли разобраться самому?

«Яндекс» предлагает подробную инструкцию о том, как внедрить самостоятельно микроразметку Schema.org. Для этого вам понадобятся:

• Валидатор микроразметки. Он поможет вам проверить, правильно ли выполнена семантическая разметка и будут ли ее корректно распознавать роботы поисковых систем.
• Плагины. В случае если используется одна из популярных систем управления сайтом.
• Schema.org creator. Удобный инструмент для генерации кода разметки на основе словаря.

Что можно размечать?

С помощью Schema.org можно размечать данные об организациях, словарных статьях, изображениях, видео, фильмах, рецептах, аккордах, творческих работах, авто и тест-драйвах, а также целевой аудитории. Пример использования разметки для указания данных об организации Setup.ru:

Как было отмечено выше, существуют и другие словари, которые используются для разметки. Их принцип такой же, как и у Schema.org. Приведем некоторые из них:

• Open Graph. Этот словарь считается простейшим, его распознают также «ВКонтакте», Twitter, Google+, LinkedIn, Pinterest и др. Чтобы начать пользоваться этим словарем, достаточно всего 4-х свойств объекта: og:title (название объекта), og:type (тип; например, «video.movie» — кино), og:image (URL изображения, которое его описывает), og:url (постоянный ID объекта, канонический URL).
• Микроформаты. Авторами являются энтузиасты, W3C. Изначально цель была в том, чтобы создать свой стандарт на базе основных элементов HTML. Отличие этого словаря микроразметки от других в том, что он объединил стандарты и синтаксиса, и словаря. Тем не менее, его популярность значительно ниже, чем у Schema.org и OG. Подавляющее большинство спецификаций находится в стадии черновика и вряд ли будет закончено. Сейчас поисковые системы поддерживают микроформаты: hCard (разметка контактной информации), hRecipe (описание кулинарных рецептов), hReview (разметка отзывов), hProduct (разметка товаров). С их помощью в выдаче тоже показываются специальные сниппеты.

Указанные словари являются самыми распространенными. Есть также менее популярные их виды: Dublin Core, FOAF, Data Vocabulary, Good Relations и другие.

Синтаксис

Свод атрибутов микроразметки и правил по их применению называется синтаксис. В нем можно совмещать разные словари (исключение — микроформаты). Каждый из таких стандартов обладает определенной спецификой. Рассмотрим его на примере синтаксиса Microdata со словарем Schema.org.

Атрибуты:

• itemscope призван указать парсеру на то, что в HTML-блоке <div> ... </div> есть данные об объекте;
• itemtype указывает ссылку schema.org/Person, уточняя конкретный тип объекта;
• itemprop указывает на свойства объекта.

На одной странице вы можете разметить сразу несколько сущностей, если они имеют одинаковый itemtype. А каждая сущность может иметь внутри себя несколько itemprop.

Выводы

Сначала может показаться, что микроразметка — это сложно. Но от этого ее польза не становится меньше. Семантическая разметка должна стать обязательным этапом в продвижении и привлечении трафика на сайт из поиска. Лучше всего применять ее для реального контента на странице, который виден посетителю сайта. Попытка разметить какие-либо скрытые или несуществующие элементы будет расценена как поисковый спам, а к сайту будут применены санкции.