Google микроразметка: Микроразметка сайта для Яндекс и Google с примерами / Хабр

Содержание

SEO Новости с тегом «%d0%9c%d0%b8%d0%ba%d1%80%d0%be%d1%80%d0%b0%d0%b7%d0%bc%d0%b5%d1%82%d0%ba%d0%b0»

  • Все вместе
  • Новости
  • Знания
  • Мнения
  • Аналитика

Посты не найдены

Подпишитесь на рассылку

Полезные статьи о SEO и свежие новости раз в неделю

Популярные посты

Прямой эфир

Теги

  • API
  • CMS
  • E-Commerce
  • Email-маркетинг
  • Facebook
  • Google
  • Instagram
  • Line
  • Pinterest
  • SEO
  • SMM
  • Telegram
  • Twitter
  • YouTube
  • Анализ сайта
  • Аналитика
  • ВКонтакте
  • Внешние ссылки
  • Внутренние ссылки
  • Инструменты
  • Исследования
  • Кейсы
  • Контекст
  • Контент
  • Микроразметка
  • Мнения
  • Мобилопригодность
  • Настройка рекламы
  • Нейросети
  • Новости PR-CY
  • Подборка
  • Право
  • Работа сайта
  • Семантика
  • Сервисы PR-CY
  • Спроси PR-CY
  • Ссылочное продвижение
  • Ускорение загрузки
  • Юзабилити
  • Яндекс
  • ​Instagram

Что такое микроразметка на сайте и зачем она нужна

Микроразметка (семантическая разметка) — это разметка информации на сайте с помощью тегов и дополнительных атрибутов, которые добавляют в HTML-код сайта.  

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

Так в выдаче «Яндекса» отображается сайт, который использует семантическую разметку

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

Для чего нужна микроразметка

Микроразметка позволяет поисковым системам точнее анализировать контент на сайте и отображать информацию с веб-страниц в более удобном виде. 

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

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

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

По данным Google, некоторые бренды после добавления микроразметки на страницы сайтов смогли повысить CTR на 25-35%.

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

Что такое словари и синтаксисы

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

Типы словарей и виды синтаксиса в семантической разметке. Источник

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

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

Синтаксис — это набор правил для использования словаря. Синтаксис определяет, как, где и какие теги указывать в HTML-коде сайта. Стандартов синтаксиса, как и словарей, несколько. Наиболее распространенные: JSON-LD, RDFa, микроданные и микроформаты. При этом последние три используются все реже, а JSON-LD — все чаще, так как именно его рекомендует Google.

В рамках словаря можно использовать один или несколько видов синтаксиса, как заявляют представители поисковых систем. Например, для Schema.Org подходят и JSON-LD, и RDF, и микроданные, и микроформаты. Главное — следить, чтобы атрибуты не противоречили друг другу и не создавали путаницу.  

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

Schema.Org

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

В Schema.org описано несколько сотен типов микроразметки, наиболее популярные и полезные для разметки сайта — Article (статья), Recipe (рецепт), VideoObject (видео), HowTo (инструкции), BreadcrumbList (хлебные крошки) , Product (карточка товара), Review (отзыв), ImageObject (изображение). Каждый из этих типов с примерами более подробно описан в последнем разделе статьи. 

Словарь Schema.org рекомендуют использовать крупные поисковые системы, среди которых Google, «Яндекс», Bing. 

OpenGraph

Словарь семантической разметки, который был разработан Facebook*, чтобы решить проблемы с отображением страниц сайта в социальных сетях. Сейчас словарь OpenGraph поддерживают не только соцсети Facebook*, «ВКонтакте», Pinterest, но и популярные блог-платформы и мессенджеры: Telegram, Skype, Viber и другие.

Благодаря микроразметке OpenGraph при расшаривании ссылки в соцсетях подтягивается корректная картинка и текст, а не случайное изображение с сайта

А так в соцсетях расшаривается ссылка с сайта, который не использует разметку

Документация по разметке OpenGraph на русском языке 

Микроформаты

Еще один стандарт, о котором следует сказать отдельно, так как это объединенный стандарт синтаксиса и словаря. Микроформаты были разработаны в 2007 году и сейчас используются намного реже, чем OpenGraph и Schema.Org. Это связано в том числе с ограничениями, которые накладывает стандарт: при внедрении микроформатов нельзя использовать другие словари. Формат считается устаревшим.

Виды синтаксиса и их особенности

JSON-LD. один из самых распространенных форматов синтаксиса для разметки контента. Чаще всего применяется для разметки в рамках словаря Schema.org. Главное отличие этого типа синтаксиса от других — элементы помещаются не в код HTML-страницы, а в скриптовый тег — <script>. Данные, размеченные JSON-LD, понимают и используют поисковые системы — Google в основном поиске, «Яндекс» — в «Яндекс Почте» и для вопросов и ответов на мобильной выдаче.

Пример кода с использованием JSON-LD для разметки статьи. Выбран тип разметки NewsArticle, среди указанных свойств — имя автора (author), дата публикации (datePublished)

RDFa — синтаксис, который чаще всего используется в словаре Open Graph для формирования привлекательных сниппетов для социальных сетей.

Микроданные (Microdata) — синтаксис, который изначально применялся со словарем Schema.org. В отличие от JSON-LD, с помощью микроданных нельзя добавить фрагмент кода в раздел <head>. Вместо этого приходится помечать каждый HTML-элемент отдельно. Это неудобно, поэтому сейчас микроданные чаще используют для поисковых систем, которые не полностью поддерживают JSON-LD (например для «Яндекса»).

Пример кода с использованием микроданных для разметки контента о фильме «Аватар». Выбран тип разметки Movie, среди указанных свойств — имя режисера (name), дата его рождения (birthDate), жанр (genre) и ссылка на трейлер (trailer)

Микроформаты — как говорили выше, это объединенный стандарт синтаксиса и словаря. В рамках этого стандарта данные размечают с помощью базовых элементов HTML. Считается устаревшим.

Пример кода с использованием микроформатов: к тегам добавляется атрибут class и элементы (помечены красным), которые указывают, какая информация представлена на странице

Распространенные типы микроразметки по Schema.

org

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

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

Навигационная цепочка «хлебные крошки»

Навигация «хлебные крошки» позволяет понять, в каком разделе сайта находится пользователь. Такая навигация часто встречается на страницах информационных сайтов или в интернет-магазинах. Располагается навигационная цепочка обычно вверху или внизу страницы.

Пример навигационной цепочки на сайте «М.Видео»

Для разметки «хлебных крошек» используется микроразметка типа BreadcrumbList по словарю Schema.Org.

Микроразметка на странице «Контакты»

Для разметки контактной информации — адресов, телефонов и т. д. — используются типы разметки Organization и Place.

Размеченные таким образом данные отображаются в различных сервисах. Например, «Яндекс» показывает извлеченные контактные данные в поиске и на Картах

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

Чтобы в выдаче показывались структурированные данные с ценой и описанием товара, необходимо корректно разметить нужные блоки. Товар размечается с помощью разметки Product и должен содержать свойство Offer (для одного предложения) либо AggregateOffer (для списка предложений).

В сниппете с использованием семантической разметки показывается описание, фото и цена товара

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

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

  • author помогает поисковым роботам найти информацию об авторе материала;
  • datePublished указывает поисковым системам, когда статья была опубликована;
  • headline показывает роботам, что в этом месте кода размещен заголовок статьи;
  • image указывает на изображения, связанные с текстом статьи.

Пример кода страницы со структурированными данными категории Article

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

Отзывы на сайте тоже можно разметить с помощью атрибутов и тегов типа Review. Для этого используют следующие свойства:

  • author — имя автора;
  • reviewRating —  оценка, которая содержится в отзыве;
  • datePublished — дата публикации отзыва;
  • reviewBody — текст отзыва.

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

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

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

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

Необходимые свойства разметки для словаря Schema. Org, без которых ролики не будут проиндексированы, указаны в «Яндекс Справке».

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

Разметка ImageObject помогает поисковым системам находить изображения среди другого контента и улучшает представление сайта в Яндекс Картинках и Google Картинках.

Необходимо задать поля:

  • contentUrl — ссылка на изображение;
  • name — название картинки;
  • description — описание изображения;
  • height и width — высота и ширина картинки.

Правильно размеченные изображения могут появляться в выдаче и в сервисах поисковых систем

Микроразметка для кулинарных сайтов

Для кулинарных сайтов в Schema.Org существует своя микроразметка типа Recipe. С ее помощью можно разметить рецепты, указав название блюда (строка name), ингредиенты и их объем (recipeIngredient), инструкцию по приготовлению (recipeInstructions).

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

Микроразметка HowTo и Q&A

Данные типы разметки позволяют поисковым роботам находить блоки с вопросами и ответами на сайте и пошаговые инструкции. Чтобы поисковая система сформировала сниппет для блока Q&A, необходимо использовать на соответствующих страницах типы разметки Question и Answer.

Так выглядит сниппет страницы с разметкой Q&A

Для пошаговых инструкций подойдет разметка HowTo.

Способы проверки правильности микроразметки

Чтобы поисковые системы могли обнаружить и правильно считать разметку, необходимо проверить ее на ошибки. Для этого можно воспользоваться бесплатными валидаторами:

  • Валидатор микроразметки в «Яндекс Вебмастере».
  • Проверка расширенных результатов в Google.
  • Валидатор разметки Schema.org.

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

Главные мысли

Является ли это фактором ранжирования Google?

Разметка схемы — это тип микроданных, которые создают расширенное описание, которое Google может использовать в результатах поиска в виде расширенного фрагмента.

По сути, это общий словарь, который позволяет поисковым системам, включая Google, Bing и Yandex, лучше понимать содержимое любой веб-страницы.

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

Является ли схема фактором ранжирования?

Давайте рассмотрим улики.

Утверждение: схема является фактором ранжирования

В начале 2018 года Роджер Монти писал об обновлении ресурса Google «Введение в структурированные данные»:

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

«Поиск Google усердно работает, чтобы понять содержание страницы. Вы можете помочь нам, предоставив Google явные подсказки о значении страницы, добавив на страницу структурированные данные».

Теперь Google говорит: «Вы можете помочь нам», используя структурированные данные.

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

Тем не менее, приведенное выше редактирование заставило SEO-специалистов в 2017 году задаться вопросом, что же изменилось, что требует обновления текста.

Доказательства того, что схема является фактором ранжирования

Schema.org объясняет, почему схема важна для поисковых систем:

«Ваши веб-страницы имеют скрытое значение, которое люди понимают, когда читают веб-страницы. Но поисковые системы имеют ограниченное представление о том, что обсуждается на этих страницах.

Добавляя дополнительные теги в HTML своих веб-страниц — теги, говорящие: «Эй, поисковая система, эта информация описывает этот конкретный фильм, или место, или человека, или видео», — вы можете помочь поисковым системам и другим приложениям лучше понять вашу контент и отображать его полезным и релевантным способом».

В тематическом исследовании, опубликованном самим Google, рассказывается история успеха Rakuten, который увеличил трафик из поисковых систем в 2,7 раза после «сотрудничества с Google Search в 2017 году, чтобы сделать их структурированные данные еще более полезными».

Google также отмечает, что время на странице увеличилось в 1,5 раза.

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

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

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

В статье Монтти он также отметил несколько вещей, сказанных Гэри Иллисом на Pubcon 2017:

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

И:

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

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

Ранжирование упрощается, когда Google лучше понимает, какие объекты появляются на странице и о чем они.

Джон Мюллер из Google подтвердил, что схема не является фактором ранжирования в опубликованном в Твиттере ответе на вопрос в 2018 году, где SD = структурированные данные:

Скриншот из Twitter, февраль 2022 г. дать вам повышение рейтинга.

Следующий вопрос: делает ли использование схемы ваш сайт более технически обоснованным и помогает ли таким образом ранжированию?

В видео о часах работы Google Webmaster Central за 2019 год Мюллер сказал:

«С одной стороны, мы используем структурированные данные, чтобы лучше понять объекты на странице и выяснить, где эта страница более актуальна. Но это не означает, что только потому, что люди делают что-то технически правильно на веб-сайте, эта страница становится лучше, чем она была бы в противном случае.

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

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

Вот вам и идея.

Мюллер сравнил концепцию схемы как фактора ранжирования с идеей проверенного HTML как фактора ранжирования.

Ни один из этих факторов не говорит Google, что страница имеет большую ценность для пользователя.

Нужно больше доказательств?

В 2020 году Дэнни Салливан, представитель Google по поиску, заявил, что структурированные данные необязательны, добавив, что они «не влияют на рейтинг в веб-поиске».

Схема как фактор ранжирования: наш вердикт

Схема делает именно то, о чем Google заявил в своем объявлении о запуске Schema.org в 2011 году: она улучшает отображение сайтов в основных поисковых системах.

Использование схемы может:

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

Нет никаких доказательств того, что Google использует его для определения поискового рейтинга, но все это хорошо.

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


Избранное изображение: Пауло Бобита/Search Engine Journal

Категория SEO

Google Schema Markup Tool: Начало работы

Что такое схема и как эффективно включить ее в свою стратегию SEO?

Существует так много критически важных компонентов для SEO, что схема часто может потеряться в перетасовке. Но схема — это маленькая вещь, которая может оказать большое влияние, и мы думаем, что она заслуживает немного большей любви! Вот несколько действенных способов начать использовать его в своей собственной стратегии SEO с помощью инструментов разметки схемы Google.

 

Во-первых, что такое схема?

Разметка схемы (schema.org) — это библиотека кода, которую можно добавить на веб-сайты, чтобы улучшить способ отображения поисковыми системами результатов на страницах результатов поисковой системы (SERP).

С точки зрения непрофессионала, разметка схемы предлагает способ помочь вашему веб-сайту выделиться в результатах поиска. Привлекайте больше глаз (и больше кликов!), когда вы делаете свои органические списки ПОПУЛЯРНЫМИ!

Не все результаты равны

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

Чаще всего вы увидите схему, представленную как:

  • Местная бизнес-информация
  • Статьи
  • Рестораны
  • Обзоры
  • Киносеансы
  • События 9011 0
  • Программные приложения
  • Продукты

 

Тем не менее, разметка схемы наверняка не ограничивается этим. Полный список смотрите на schema.org.

 

Применяется ли схема к вашему веб-сайту?

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

 

Начнем!

Самый простой способ начать реализацию схемы — использовать Google Data Highlighter или Google Data Markup Helper. Оба инструмента схемы интуитивно понятны и предназначены для простой пометки страниц на вашем веб-сайте. Отличная отправная точка, если вы только начинаете знакомиться со схемой. Но как выбрать, какой инструмент лучше всего подходит для вас?

 

Google Data Highlighter или Google Structured Data Markup Helper?

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

 

Начало работы с Google Data Highlighter

Готовы начать пометку?

 

1. Сначала просмотрите это краткое руководство по инструменту выделения данных, чтобы увидеть, как этот инструмент работает.

 

2. Введите URL-адрес страницы, которую вы хотите начать помечать, и выберите наиболее подходящую категорию.

 

У вас также есть возможность выбрать все похожие страницы (удобно для статей и продуктов) или выбрать отдельную страницу для уникальной маркировки (удобно для бизнес-информации и списков событий).

 

3. Начать выделение! Выделите данные, которые вы хотите пометить, и появится раскрывающийся список, позволяющий идентифицировать выделенные элементы. Справа от экрана вы увидите информацию, необходимую для выбранной вами категории, а теги будут заполняться по мере выделения.

Интерфейс Google Data Highlighter не лишен своих особенностей, но он интуитивно понятен и предлагает отличную отправную точку для знакомства со схемой.

После того, как вы выделили свои страницы, вы можете просмотреть все свои теги и управлять ими в разделе «Подсветка данных» в Search Console.

 

Краткий обзор средства выделения данных

Профессионалы

  • Быстро и просто, если время и бюджет ограничены.
  • Полезно, если у вас нет доступа к коду веб-сайта или у вас ограниченные знания в области кодирования.
  • Доступно прямо в Search Console (только не забудьте вернуться к исходному интерфейсу!).

 

Минусы

  • Эксклюзивно для Google; не читаются другими поисковыми системами.
  • Ограниченные предложения по категориям и тегам, доступные для выделения.

 

Начало работы с помощником по разметке структурированных данных Google

 

1. Введите URL-адрес страницы, которую вы хотите пометить, и выберите наиболее подходящую категорию.

Если у вас есть только html, вы можете вставить и его.

 

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

3. Когда ваши элементы данных будут завершены, выберите «Создать HTML».

 

4. Внедрите разметку: добавьте каждый элемент кода, выделенный в инструменте, или загрузите сгенерированный HTML-файл и вставьте в свой исходный код.

Краткий обзор инструмента разметки структурированных данных

Плюсы

  • Принимается большинством основных поисковых систем, а не только Google.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *