Как сделать расширенный сниппет: подробное руководство для чайников

Как сделать расширенный сниппет: подробное руководство для чайников

*Обновление статьи


Расширенный поисковый сниппет – это визитная карточка вашего сайта на странице выдачи Google или «Яндекс». Он служит не просто для красоты, а приносит дополнительные переходы пользователей. Если вы еще не используете этот инструмент, потому что боитесь лезть в код сайта или путаетесь в типах разметки – это руководство для вас. Здесь есть все что нужно, даже если вы никогда не имели дела с HTML-кодом.






Что такое расширенные сниппеты и зачем они нужны

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



Сниппеты дополняют заголовки. Они подтверждают или опровергают соответствие страницы информационным потребностям пользователя




Поисковые системы формируют сниппет автоматически. В качестве источника роботы используют контент страницы или мета-тег description. Стандартный сниппет ограничен приблизительно 160 символами с пробелами. Это два или три коротких предложения.

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



Примеры расширенных сниппетов: отображение в выдаче рейтинга «Кинопоиска» и описания фильма в «Википедии»


Зачем нужны расширенные сниппеты

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


Если вы заинтересованы в целевом трафике, немедленно внедряйте расширенные описания и они обязательно дадут новые продажи. А информация, приведенная ниже, поможет сделать это правильно.


Какие существуют словари и типы синтаксиса микроразметки

Чтобы поисковые системы показывали расширенные сниппеты для страниц сайта в выдаче, вам необходимо внедрить семантическую разметку. Вы можете сделать это с помощью разных словарей или языков. Наиболее распространенные словари микроразметки представлены ниже:



  • Schema.org. Этот словарь можно назвать золотым стандартом микроразметки. Его поддерживают крупнейшие поисковые системы, включая «Яндекс», Google и Bing. С помощью Schema.org вы можете описать сотни различных сущностей. Это позволяет поисковикам отображать расширенные сниппеты разных типов.
  • Microformats.org. С помощью языка микроформатов вы можете структурировать информацию о некоторых сущностях: людях, событиях, статьях, отзывах. Крупнейшая в рунете поисковая система «Яндекс» в данный момент поддерживает только два типа такой разметки: hCard – микроформат контактной информации (адресов, телефонов и т. д.) и hRecipe – для описания кулинарных рецептов. Поэтому возможности Microformats.org ограничены по сравнению со Schema.org.
  • Open Graph. Этот язык помогает социальным сетям отображать ссылки на ваш сайт с привлекательными описаниями. Open Graph поддерживают практически все социальные площадки, включая Facebook, «Вконтакте», Twitter и т.п.
С помощью Open Graph можно подсказать социальным сетям, каким должно быть описание ссылки на сайт




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


  • Микроданные. Формат microdata считается основным средством реализации микроразметки Schema.org. Он предполагает использование тегов и атрибутов HTML для структурирования данных. Основным преимуществом микроданных остается простота использования.
  • JSON-LD. Перспективный формат передачи структурированных данных, предложенный W3C. С помощью этого типа синтаксиса вы можете реализовать микроразметку Schema.org.
  • Микроформаты. Этот синтаксис используется для реализации словаря Microformats.org.
  • RDFa. Данный формат используется для реализации языка Open Graph.

Какой язык и синтаксис выбрать

Выбирайте язык и синтаксис в зависимости от цели и задач, которые вы хотите решить. Если вам нужны расширенные сниппеты на страницах поисковой выдачи, оптимальным выбором будет Schema.org. Этот тип микроразметки поддерживают все крупные поисковые системы. Используя его, вы можете описать множество разных сущностей и получить разные типы расширенных сниппетов. Реализовать такую разметку вы можете с помощью синтаксиса microdata или JSON-LD.

Если вам необходимо управлять описаниями ссылок в социальных сетях, внедрите Open Graph. Чтобы реализовать эту разметку, вы будете использовать формат RDFa. Язык Microformats.org также заслуживает внимания благодаря простоте использования.

Как получить расширенные сниппеты с помощью Schema.org

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

Не старайтесь запомнить наизусть порядок указания атрибутов. Вам необходимо понять принцип работы со Schema.org. Для практической повседневной работы лучше пользоваться инструментами, которые перечислены ниже.


H3: Сервис Schema Markup Generator

Веб-сервис Schema Markup Generator – простой и удобный генератор микроразметки, который доступен абсолютно бесплатно на сайте международного агентства Merkle. Чтобы его использовать, не требуется знать веб-программирование. Для работы с сервисом желателен английский (на базовом уровне), но устроит и онлайн-переводчик. Кроме этого, нужно знать, куда и как вставить подготовленный инструментом код.

Предположим, вы хотите с помощью Markup Generator разметить страницу одного из авторов блога. Для этого нужно выбрать тип разметки «Персона» (Person).


Выбираем схему Person


На открывшейся странице укажите данные о человеке: имя и фамилию, ссылку на личную страницу, ссылку на фотографию, социальные сети (нужно выбрать несколько в меню), должность и компанию.

Заполняем все необходимые поля

Чтобы проверить, что получилось, нужно нажать на оранжевую иконку Google в правом верхнем углу и выбрать Structured Data Testing Tool. В новой вкладке откроется инструмент «Проверка структурированных данных» Google Search Console c вашим описанием сущности Schema.org. Это поможет найти ошибки, покажет предупреждения и результат ввода данных для сниппета.


Проверка введенных данных с помощью Google Search Console


Нажатие на голубую кнопку «Копировать» (Copy) помещает код разметки в буфер обмена, чтобы вы могли его вставить на страницу сайта с помощью редактора вашей CMS.

Обратите внимание: если пользуетесь CMS с возможностью редактировать страницу в визуальном формате и формате HTML, обязательно выберите второй вариант. В качестве примера используется набором данных типа «Книга», но для других сущностей Schema.org.


Вставляем сгенерированный код в редакторе HTML, а не в визуальном редакторе

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


Так будет выглядеть страница, если вы вставите код разметки в режиме визуального редактирования


В режиме редактирования HTML вы можете выбирать, в каком месте страницы вставить код. Например, вы можете оформить его в качестве врезки в середине текста или резюме в конце статьи.

Так отображается разметка, если вы вставили ее в режиме редактирования HTML



Если вам по каким-то причинам не подходит этот веб-сервис, воспользуйтесь другими инструментами:


  • Если ваш сайт работает на WordPress, используйте плагин Schema Creator. Прочитайте подробную инструкцию по применению расширений в нашем руководстве по WordPress. Кстати, вы можете использовать и другие плагины для микроразметки. Для этого введите в поисковое поле каталога плагинов WordPress запрос «Schema.org».
  • Для сайтов на Joomla! используйте редактор JCE и расширение J4Schema.org. Обратите внимание, чтобы заставить эту пару инструментов работать, вам придется потрудиться. Подробнее в инструкции.
  • Для сайтов на Drupal воспользуйтесь модулем Schema.org. Начиная с версии 8 он интегрирован в ядро SMS.
  • Существуют плагины и модули микроразметки для других популярных CMS можно найти в их каталогах расширений: Magento, OpenCart, 1С-Битрикс и так далее.
Создание микроразметки с помощью плагина для WordPress Schema Creator by Raven





Вы можете реализовать микроразметку Schema.org с помощью синтаксиса JSON-LD. Для этого воспользуйтесь инструкцией. С помощью JSON-LD вы сможете внедрить на сайт только несколько типов микроразметки: Article, Person, WebSite, searchAction и некоторые другие. Синтаксис JSON-LD имеет важное преимущество перед микроданными: с его помощью можно создавать разметку, которую «видят» только поисковые системы.

Как разметить страницу с помощью маркера Google

Вы можете получить расширенные сниппеты, разметив страницу с помощью «Маркера» из старой версии Search Console, недоступной с сентября 2019 года. В новой версии у него пока нет аналога, но его можно открыть по этой ссылке – для перехода вам потребуется использовать аккаунт Google.




Команда Google обещает вернуть старые инструменты в новую Search Console


На открывшейся странице нажмите кнопку «Начать выделение».


Начинаем выделение


Введите URL страницы, которую планируете разметить. Выберите необходимый тип разметки. Поставьте флажок напротив опции «Отметить только эту страницу», если планируете вставить разметку только на одной странице. Если вы хотите одновременно разметить несколько страниц, оставьте опцию по умолчанию «Отметить эту и похожие страницы».




Вводим URL и выбираем тип разметки





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




Размечаем название





Убедитесь, что значение атрибута отобразилось корректно. Оно должно появиться в блоке «Мои элементы данных».




Проверяем элементы данных





Таким же способом разметьте остальные данные. Если вы размечаете страницу с описанием фильма, укажите режиссера, исполнителей главных ролей, жанр, год выхода и т.п. После выделения нужных данных нажмите кнопку «Опубликовать».




Публикуем размеченные данные





После очередного индексирования сайта Google учтет изменения и отобразит в выдаче расширенный сниппет.

Как получить расширенный сниппет с помощью мастера разметки структурированных данных Google

С помощью мастера разметки вы можете добавить структурированные данные на страницы сайта или в HTML-код электронных писем. Авторизуйтесь в системе и укажите URL страницы, которую планируете разметить. Выберите тип данных и нажмите кнопку «Начать разметку».



Используем мастер разметки





На открывшейся странице выделяйте курсором данные и присваивайте значения атрибутам, как при работе с маркером.




Выделяем данные




После завершения разметки нажмите кнопку «Создать HTML». Скопируйте выделенный фрагмент с кодом разметки и вставьте на страницу сайта.



Копируем код и вставляем на страницу


Как получить расширенные сниппеты с помощью микроформатов

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


Чтобы разметить страницу с контактными данными, укажите необходимую информацию в генераторе кода hCard. В поле preview вы можете предварительно просмотреть карточку с персональной информацией, которая будет отображаться на странице сайта. Если данные указаны корректно, скопируйте код и вставьте его на сайт. Расширенный сниппет появится после очередной индексации ресурса поисковиками.



Генерируем код микроформатов hCard





Как получить расширенные описания в социальных сетях

Универсальный инструмент для решения этой задачи — протокол Open Graph. Его «понимают» наиболее популярные социальные сети, включая «ВКонтакте», «Фейсбук», «Твиттер», Google+ и другие.

Чтобы создать разметку Open Graph, воспользуйтесь автоматическим генератором (например, таким). Заполните необходимые данные. Скопируйте сгенерированный код и вставьте его на страницу между тегами <head> и </head>.




Копируем код и вставляем на страницу





Обратите внимание, в выпадающем меню Type необходимо выбирать подходящий тип контента: статья, видео, книга и так далее.


Обратите внимание на следующие инструменты:



  • Если ваш сайт работает на WordPress, воспользуйтесь одним из плагинов для генерации разметки Open Graph, например, этим.
  • Для сайтов на Joomla подойдет расширение Phoca Open Graph
  • Владельцам сайтов на Drupal стоит обратить внимание на модуль Open Graph meta tags.
  • Для сайтов на 1С-Битрикс можно попробовать платное расширения Social Media Optimizer. Разработчики утверждают, что оно поддерживает разметку Open Graph и Twitter Cards.
  • Если ваш сайт работает на Magento, воспользуйтесь расширением Social Share – Open Graph.
  • Для сайтов на OpenCart также можно выбрать специальное расширение.

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

Какие сниппеты использовать в зависимости от типа сайта

Ответ на этот вопрос зависит от цели и задач, которые вы решаете, а также от типа вашего сайта. Начните с базовых типов разметки. К сожалению, Google больше не поддерживает разметку Authorship, поэтому не тратьте на нее время. Если вы не хотите ограничиваться базовой разметкой, ориентируйтесь на особенности проекта.

Если вы открыли интернет-магазин, то вам будут полезными следующие типы сниппетов:


  • Продукты. Также вы можете получить расширенный сниппет в «Яндексе» с помощью программы «Товары и цены».
  • Отзывы/обзоры.
  • Контактные данные. Вы можете указывать контакты сервисных центров, пунктов выдачи заказов или офлайн-подразделений. Используйте разметку Schema.org или микроформаты.
  • Person. Используйте этот тип разметки для структурирования информации об экспертах, разработчиках продуктов, авторов публикаций.
  • Search Box. Воспользуйтесь плагином для WordPress или скопируйте код здесь и вставьте данные своего сайта.
Search Box сайта в поисковой выдаче




Для контент-проектов можно использовать такие типы разметки:


  • Статья. Воспользуйтесь генератором разметки или скопируйте код здесь и вставьте необходимые данные.
  • События.
  • Person.
  • Контактные данные.
  • Отзывы/обзоры.

Администраторам корпоративных сайтов можно подумать о следующих типах расширенных сниппетов:


  • Контактные данные.
  • Продукты.
  • Отзывы/обзоры.
  • Person.
  • Статья.

Также обратите внимание на типы разметки и сниппетов, подходящие сайтам с узкой тематикой:


  • Рецепты для кулинарных ресурсов.
  • Фильмы для сайтов, посвященных кинематографу.
  • Книги для ресурсов, публикующих отзывы или торгующих книгами.

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

Получить расширенный сниппет просто

Для этого нужно выбрать тип описания, который вы хотите показывать в поисковой выдаче. Затем вам нужно выбрать язык разметки, с помощью которой вы передадите поисковым системам структурированную информацию. Оптимальным вариантом считается словарь Schema.org, который можно реализовать с помощью микроданных или связанных данных JSON-LD.

Не тратьте время на создание кода вручную. Воспользуйтесь автоматическими генераторами разметки, например, Schema Markup Generator. Если вы создаете страницы с разметкой ежедневно, установите на сайт плагин или расширение для создания семантической разметки. Обязательно внедрите Open Graph для получения расширенных описаний в социальных сетях. Помните, поисковики не гарантируют отображения расширенного сниппета, даже если вы корректно разметили страницы сайта.


Красивый сниппет и даже SEO в целом не могут гарантировать маркетингового успеха. Это большая работа, которую нужно вести по разным направлениям комплексного продвижения.

Понравилась статья? Поделиться с друзьями:
Marketing-Land.ru