Лого SiteHere.ru

Микроразметка Schema.org — как угодить Google и Yandex одновременно?

Микроразметка Schema.org

Любая страница сайта состоит из HTML тегов. Как правило, HTML теги сообщают браузеру как отобразить информацию, которая находится внутри тега. Таким же образом микроразметка Schema.org сообщает поисковым системам где находится та или иная важная информация на странице.

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

Содержание

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

Чтобы быть в курсе последних лайфхаков по SEO и знать, как продвигать сайты в 2020 году — подпишитесь на личный Telegram канал.

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

В данной статье я хочу показать о том, как на практике сделать микроразметку на своем сайте, чтобы ее хорошо восприняли и Google и Yandex одновременно. Потому что многие сталкиваются с проблемами: для Yandex микроразметка нормально проходит валидацию (об этом читайте ниже), а вот для Google появляются ошибки, и наоборот. Да, это действительно так. Но всегда можно найти компромисс!

С помощью правильной микроразметки Schema.org Вы сможете передавать самые важные данные. То есть поисковому роботу информация подается сразу "на блюдечке". Для этого и была создана микроразметка поисковыми системами.

Основы микроразметки Schema.org

  • Что такое микроразметка сайта?

    Микроразметка сайта — это способ показать поисковым системам важные элементы на вашем сайте. Также это способ создать расширенные сниппеты на поиске и получить больше кликов, увеличить CTR на поиске и, соответственно, улучшить позиции на поисковой выдаче.

  • Что такое Schema.org?

    Schema.org — это словарь, с помощью которого можно размечать страницы, чтобы они были понятны поисковым системам Google, Яндекс, Mail.ru, DuckDuckGo, Bing, Rambler.

  • Есть ли Schema.org на русском?

    Да, есть. Находится перевод проекта по адресу ruschema.org.

  • Как сделать разметку страницы или сайта?

    Об этом читайте в разделе статьи — что необходимо разметить на странице.

  • Как проверить микроразметку на сайте?

    Для этого существуют валидаторы микроразметки.

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

    Достаточно ввести URL сайта в один из валидаторов микроразметки и вы увидите есть ли на сайте микроразметка.

  • Рекомендации Google по применению микроразметки

    Большое количество рекомендаций по работе со структурированными данными от Google вы можете найти здесь с примерами.

  • Какую микроразметку использовать для своего сайта?

    Изучите статью о том, какие бывают виды микроразметок. Так вам будет проще какой вид микроразметки использовать на сайте.

  • Генератор микроразметки Google

  • Как влияет разметка Schema на индексацию Google?

    Никак не влияет на индексацию.

Не растут позиции сайта?

Закажите разбор сайта по SEO с консультацией

Сделайте аудит сайта самостоятельно с помощью сервиса

Как проверить "правильность" микроразметки Schema.org?

Как проверить правильность микроразметки Schema.org

Для проверки валидации ("правильности") микроразметки предназначены специальные сервисы, которые были разработаны поисковыми системами. Мы будем в данной статье проверять микроразметку для поисковой системы Yandex и Google.

Вот ссылки на два сервиса проверки валидации микроразметки Schema.org:

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

Как пользоваться валидаторами микроразметки?

Как пользоваться валидаторами микроразметки

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

Итак, начнем с валидатора от Google. Страница выглядит следующим образом:

Валидатор микроразметки Google

Есть два варианта проверки валидации страницы:

  1. С помощью прямой вставки HTML кода
  2. С помощью вставки URL адреса страницы, которую необходимо проверить

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

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

После проверки в валидаторе Google появится слева код Вашей HTML страницы, а справа — какая микроразметка там присутствует и есть ли там ошибки:

Валидная микроразметка Schema.org

С валидатором Google я думаю все понятно. Перейдем к валидатору от Yandex.

Когда Вы зайдете на сайт с валидатором микроразметки от Yandex, Вы увидите несколько иную картину, но смысл там остается тот же:

Валидатор микроразметки Yandex

Здесь интерфейс немного проще и опять же есть два варианта проверки Вашего HTML кода: с помощью вставки исходного кода страницы, либо с помощью вставки лишь URL необходимой страницы.

После того как Вы проверили свою страницу на валидность микроразметки, Yandex покажет свои ошибки немного в другом формате, прямо рядом с микроразметкой:

Правильная Schema.org

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

Где проверять свою микроразметку Вы сейчас знаете. Поэтому немедленно перейдите на свой сайт, скопируйте URL ссылку первой же статьи и проверьте ее на валидацию.

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

Шаг 1. Что необходимо разметить на странице?

Что нужно разметить микроразметкой Schema.org

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

Поэтому первым шагом необходимо определиться с основным шаблоном и правильно его подготовить. А у же потом переносит на реальный сайт.

В данной статье я покажу как сделать пример для сайта, под управлением CMS WordPress. А на данной CMS чаще всего создают блоги. Поэтому будем писать разметку для такого типа страниц, как "Статья".

Далее нам необходимо определить, какую сущность из словаря мы будем использовать. На официальном ресурсе Schema.org есть следующая структура: Article. Но внутри нее есть подструктуры, которые мы можем использовать. Спускаясь все глубже по подструктурам я нашел следующий тип: BlogPosting. Он является частным вариантом сущности Article. И он отлично подходит для разметки записей на блогах.

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

Свойства сущности Schema.org

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

Наглядный пример микроразметки Schema.org

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

Шаг 2. Формируем шаблон микроразметки

Формируем шаблон микроразметки

Что именно будем размечать стало понятно. Осталось собрать правильную структуру.

Основная суть микроразметки (технически): добавить к необходимым тегам дополнительные атрибуты. Иногда добавить дополнительные теги для структуры.

ВАЖНО: Google постоянно вносит изменения и оставил «звездочки» только для страниц с продуктами. Есть сайты, которые это обходят, но все же желательно размечать так, как этого требует Schema.org. Поэтому сейчас код был изменен и «звездочки» на поиске можно сделать только в сущности Product. Это больше относится к таким услугам и товарам, но не к обычным статьям.

Без прелюдий перейдем сразу к делу. После многочисленных попыток сделать микроразметку Schema.org валидной для Google и Яндекса получилась следующая структура:

HTML КОД

Лого sitehere.ru

Заголовок

Описание картинки

Основной текст статьи.

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

  • Строка 1: объявляем тип контента, который будет размечен.
  • Строка 5: здесь указываем URL адрес страницы, на которой сейчас находится пользователь, то есть адрес текущей статьи.
  • Строка с 8 по 18: небольшая подструктура, в которой необходимо указать более подробно сведения о сайте: логотип (адрес до изображения и его размеры), телефон, адрес и название компании (сайта).
    • Строка 9 по 13: еще одна подструктура с выводом изображения, то есть логотипа. Все изображения, которые необходимы для микроразметки необходимо выводить именно в такой структуре, где помимо адреса до изображения в meta-тегах еще указывается информация о его размерах.
    • Строка 14: указываем телефон, если он есть.
    • Строка 15: реальный адрес, если работаете в офисе, например.
    • Строка 16: здесь пишем название компании.
  • Строка 21: дата публикации статьи. Здесь будьте очень внимательны, потому что ее указывать необходимо в специальном формате: "ГОД-МЕСЯЦ-ДЕНЬ". И обязательно разделитель должен быть знак "".
  • Строка 24: дата последнего изменения статьи, чтобы подсказать поисковику какую из статей необходимо переиндексировать, если она была изменена в последнее время. Здесь также действуют правила из предыдущего пункта.
  • Строка с 27 по 29: указываем в специальной подструктуре информацию об авторе статьи.
  • Строка 32 по 45: основная контентная часть Вашей статьи, внутри которой необходимо отметить несколько элементов:
    • Строка 35: заголовок Вашей статьи. Его помечаем следующим образом, добавляя к тегу заголовка свойство — itemprop="headline";
    • Строка 38 по 42: как Вы уже видели ранее, здесь располагается подструктура с изображением. Но в данном случае здесь мы указываем на главное изображение в статье;

Сейчас прошу не пугаться большого описания и самого HTML кода. Я старался все прокомментировать, чтобы Вы видели из чего состоит обычная статья и какие атрибуты необходимо прописать.

Если Вы разобрались в структуре микроразметки Schema.org для статьи, то проделали уже 80% работы. Осталось малость, но эта "малость" требует технических знаний. Потому что сейчас необходимо перенести данную структуру на реальный работающий сайт.

Есть вариант сделать проще с помощью мастера разметки структурированных данных от Google.

Когда попадете туда — увидите следующее:

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

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

Чтобы разметить, необходимо либо ввести URL страницы, либо вставить HTML этой же страницы.

Мы введем адрес одной из статей сайта и на его примере покажу как разметить:

Пометка данных Schema.org

Вы попадете на страницу, где справа будут указаны элементы, которые необходимо пометить на странице слева.

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

Когда закончите, необходимо кликнуть справа вверху по кнопке «Создать HTML». Вас перенаправит на страницу с готовым HTML кодом и разметкой для вставки на сайт:

Готовая микроразметка Schema.org на мастере разметки структурированных данных Google

Есть 2 варианта внедрения этой разметки на свой сайт:

  • JSON-LD: необходимо лишь вставить между тегами head сгенерированный тег script;
  • Микроданные: в этом случае необходимо найти на сайте аналогичные элементы в своей HTML структуре и разметить их, как в сгенерированном HTML.

В CMS, таких как WordPress, OpenCart и других все делается с помощью плагинов, не вручную. Ниже посмотрим с помощью каких плагинов.

Шаг 3. Внедряем микроразметку Schema.org на реальный сайт

Внедряем микроразметку Schema.org на реальный сайт

Многие используют различные CMS. Поэтому нет уникального кода, который бы работал сразу на любом сайте. Но у Вас есть код микроразметки, который получился у меня в ходе многочисленных поисков. Вам останется постепенно внедрить данную разметку на своем сайте. И сейчас я дам советы, которые помогут Вам в этом:

  1. Начинайте разметку с основных структур. То есть для начала разметьте основную сущность, внутри которой находятся все остальные элементы. Поэтому сначала необходимо найти блок, в котором содержится все: изображение, автор, дата и так далее;
  2. Далее займитесь разметкой блока "Organization". Потому что он не меняется динамически. Его необходимо один раз сделать и поместить внутрь сущности "BlogPosting". Данный блок затем скройте с помощью CSS стилей.
  3. Затем необходимо разметить дату публикации и дату последнего изменения. Сделать это несложно. В каждой CMS есть своя функция, которая отвечает за это. Так как это мета-теги, то скрывать ничего не нужно. Например в WordPress дата публикации и дата изменения выводятся следующим образом:
    • PHP КОД
      the_time('o-m-d'); // дата публикации статьи
      the_modified_date('o-m-d'); // дата изменения статьи
      
      Вам лишь необходимо разместить это в соответствующих мета-тегах.
  4. Далее отметьте подструктуру "articleBody". Именно внутри нее Вам необходимо будет указать заголовок и главное изображение статьи.
  5. И последним шагом исправьте разметку главного изображения в статье. Так как это, чаще всего, сделать технически сложнее всего, то оставьте данный элемент на концовку.

После внедрения обязательно проверьте с помощью валидаторов на отсутствие ошибок.

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

Предварительный просмотр микроразметки Schema.org

Кликаете в правом верхнем углу по кнопке «Предварительный просмотр» и попадаете на странице предпросмотра:

Пример микроразметки рецептов Schema.org

Позиции сайта "зависли" и не идут в ТОП?

Закажите разбор сайта по SEO с консультацией

Сделайте аудит сайта самостоятельно с помощью сервиса

Микроразметка FAQ от Schema.org

Как увеличить CTR на поиске за 15 минут?

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

Вот пример статьи, где я добавил микроразметку:

FAQ микроразметка в статье

Как добавить такую микроразметку?

Очень легко, достаточно в исходный код страницы вставить следующий JSON внутри тегов script:


Еще несколько советов по использованию:

Используйте 4 пункта, тогда будут показываться все 4 вопроса. Если напишете больше 4 вопросов, то последний пункт будет скрыт под элемент «Развернуть».

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

Если все сделали правильно, то достаточно буквально 15-30 минут и вы увидите в поиске в сниппете микроразметку.

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

Ошибки микроразметки Schema.org

Рассмотрим самые популярные ошибки при добавлении микроразметки Schema.

  • Необходимо указать значение для поля itemReviewed

    Здесь нужно понимать для чего нужно свойство itemReviewed.

    Это свойство, которое отдельно без сущности существовать не может. Сущностью для свойства может быть AggregateRating и Review.

    Это обязательное свойство для данных сущностей, поэтому его указать, иначе звездочки на поиске не появятся.

  • Необходимо указать значение для поля item

    Это свойство используется в сущностях DataFeedItem и ListItem.

    Например, вы хотите разметить «хлебные крошки» (BreadCrubms). Внутри элементов списка необходимо использовать для ссылок данное свойство:

    1. SEO
    2. Внутренняя перелинковка
  • Необходимо указать значение для поля url

    Это поле используется во многих сущностях. Если вы видите такую ошибку на валидаторе, то вам необходимо указать это поле внутри вашей сущности. Для каждой CMS вывод ссылки на новость отличается.

  • Необходимо указать значение для поля image

    Это может быть URL или сущность ImageObject.

    Если это ImageObject, то нужно вводить гораздо больше значений:

    Название изображения

    Описание Автор Фотография сделана Россия, Москва Дата загрузки: 22 декабря, 2020 Подробное описание изображения.

    Самое важное поле — это URL.

  • Для id указан недопустимый url

    Ошибка чаще всего возникает с сущностью BreadcrumbList когда не задан URL, а используется текстовое описание.

    Внимательно изучите сущность itemListElement, потому что она используется для BreadCrumbs.

  • Необходимо указать значение для поля itemListElement

    Это ошибка при разметке «хлебных крошек» на сайте. Если хотите сделать последний элемент списка неактивным (без ссылки), то он должен быть не BreadcrumbList элементом. Пример ниже:

    
    		

Частозадаваемые вопросы по микроразметке Schema.org

  • Itemprop что это?

    Itemprop — это свойство сущности для разметки подробных сведений об этой сущности.

    На примере: есть сущность для разметки фильма. У фильма есть много свойств: название, режиссер, жанр. Чтобы указать в микроразметке каждое свойство — необходимо в соответствующем атрибуте itemprop задать ему значение.

    Плохие парни навсегда

    Режиссер: Адиль Эль Арби (род. 30 июня 1988 г.) Комедия
    Трейлер "Плохие парни навсегда"
    Бёрнетт рассорился с напарником, оставил службу в полиции Майами и занялся...

    Обратите внимание, что нужно разметить и сам фильм и трейлер, либо информацию о трейлере совсем не вводить.

  • Как узнать тип микроразметки в Гугл?

    Введите в любой из валидаторов микроразметки URL сайта и узнаете тип микроразметки (сущности). Если хотите узнать вид микроразметки, то изучите следующую статью.

  • Как разместить URL сайта в Schema.org?

    Все зависит от того, какую сущность микроразметки вы используете.

    Например, если используете сущность BlogPosting (на русском эта же сущность), то используйте следующий код:

      
    			
  • Каким образом можно проверить корректность настройки микроразметки?

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

  • Плагины внедрения микроразметки для CMS

    Для WordPress: Schema, Schema — All In One Schema Rich Snippets, Schema & Structured Data for WP & AMP, WP SEO Structured Data Schema, а также Yoast SEO.

    Для OpenCart: SEO Structured Data — Rich Snippets — Microdata.

    Для Joomla: Google Structured Data.

    Для Битрикс: Микроразметка Schema.org, Микроразметка Schema.org в один клик.

    После внедрения любого плагина обязательно проверяйте свои страницы с помощью валидаторов.

  • Как выбрать тип Schema.org?

    Рекомендую зайти на следующую страницу — структурированные данные от Google. Слева выбрать тот материал, который вам нравится и затем разметить в соотвествии с рекомендациями.

  • Как исправить ошибку микроданных в Google?

    Чтобы исправить ошибку — необходимо хорошо разобраться в сущности, которую вы размечаете.

    Чаще ошибка связана не с микроразметкой Schema, а именно с незнанием технической части сайта или CMS. Задать свой вопрос вы можете в комментариях ниже.

  • Каким разметить номер телефона с помощью Schema.org?

    Есть свойство Telephone. Важно понимать, что это лишь свойство, оно должно быть внутри сущности, например, внутри сущности Organization.

  • Как создать микроразметку для Яндекса онлайн?

    Для Яндекс и для Google можно создать шаблон микроразметки с помощью генератора.

  • Валидатор не видит разметку

    • 1-я ситуация: ваш сайт недоступен робот и он не может проверить;
    • 2-я ситуация: страница размечена неверно. Вы не соблюдали правила разметки сущности.

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

  • Плагин проверки микроразметки в браузере Chrome

    Расширение называется Structured Data Testing Tool.

  • Как добавить микроразметку для сайтов на Wix? (Schema.org)

    На самом деле это актуально для любого конструктора.

    Для начала вам необходимо сформировать скрипт в формате JSON-LD через этот генератор.

    Затем скопировать этот скрипт, перейти в раздел редактирование сайта. Там выбрать «Настройки», далее «Коды аналитики». Выбираем справа вверху «Новый инструмент», далее «Новый код».

    Вставляем скопированный скрипт в формате JSON-LD.

    Осталось сохранить и проверить на валидаторе правильность разметки.

  • Как добавить микроразметку для сайтов на Tilda? (Schema.org)

    Генерируем скрипт в формате JSON-LD, как в ответе на предыдущий вопрос про Wix.

    На Тильде заходим в «Настройки страницы», затем «Дополнительно» и далее «HTML код для зоны». Кликаем «Edit code» (редактировать код).

    Вставляем скопированный код и сохраняем.

Вывод

Многие, возможно, начнут возмущаться, что нет готового решения, которого все так ждали. Все хотят волшебную таблетку: "скопировал->вставил". Такого не будет, если Вы хотите реальных и ощутимых результатов. У Вас индивидуальный шаблон, у которого своя собственная структура. Поэтому наберитесь терпения и разберетесь в том, как устроена микроразметка Schema.org.

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

Успехов!

С Уважением, Юрий Немец

91 комментарий к записи
  • Наталья Яшина

    Юрий, огромная благодарность за статью. Как раз встал вопрос разобраться с микроразметкой.

     
  • Волк-одиночка

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

     
  • Антон

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

     
    • Юрий Немец

      Здравствуйте, Антон!

      Для чего необходима микроразметка Schema.org читайте в данной статье: ПЕРЕЙТИ.

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

       
    • Александр

      ОМГ, заболевание чтоли у всех по поводу уникальности? Один каркнул, другой повторил, и понеслось. Не важно насколько уникален текст, важно, чтобы он был ВОСТРЕБОВАННЫЙ пользователями, его читали, им пользовались, пусть даже копипаст на 100% со ссылкой на источник, но он будет в выдаче и санкций не последует!!! Даже уникальный тест НЕ ВОСТРЕБОВАННЫЙ пользователями ну никак не будет выдвигаться в топ выдачи. Всё это личный опыт и тесты, полный копипаст с сылкой на источник у меня выходил выше первоисточника и только по тому, что пользователи отменно пользовались информацией этой статьи!!! А то у всех семь бед один ответ — не уникальный текст, переписать! Важно качество и востребованность! Хотя дело ваше, пишите до сих пор уникальный от 95% текст, дело ваше, поисковикам давно на это насрать. 

       
  • witos1

    А я заказывал за 500р.

     
  • Игорь

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

     
    • Юрий Немец

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

       
  • Александр

    А тег <meta>  допускается размещать в теле страницы, вне <head>?

     
    • Юрий Немец

      Александр, в качестве элемента микроразметки — да. В примере показано как это сделать правильно.

       
  • Александр

    Юрий, еще вопрос: а почему в статье Вы сделали разметку "Article" а не  "BlogPosting"?  Есть какие то нюансы использования этих разметок? 

     
    • Юрий Немец

      Александр, мы сейчас тестируем некоторые сниппеты, чтобы точно понять как и что "подцепляет" Google. Поэтому микроразметку незначительно, но иногда меняем для тестов.

       
  • Артем

    Микроразметка Schema.org вещь отличная, но чтобы ее внедрить самостоятельно нужно много инф. почитать. Другое дело готовое взять.angry

     
  • Алексей

    хорошая статья, спасибо! такой подробной и понятной инфы по данной теме еще не встречал 🙂

     
  • Сергей

    Юрий, добрый день! Спасибо за информацию в статьях.

    Я самоучка и пытаюсь вникнуть в микроразметку для поддержания своего сайта.

    Вопрос. Подскажите возможно ли и как повлияет , если к примеру на одной странице размечать микроразметку как для уникально статьи и плюс еще если статья о творческой работе (изображение), а так же разметки для нескольких отдельных изображений. То есть если по яндексу (список тематик) на одной странице сайта нужно отметить и "Оригинальный текст" и "Другие творческие работы" и "картинки"  ? Это можно совмещать в одном коде то есть <div…1>…<div…2>…<div…3>…..</div3><div2><div1>    ?

    Или нужно определиться  и что-то одно ? Или я не правильно понимаю и достаточно просто выбрать нужные мне itemprop=  и их указать в границах одних <div> для трех тематик ?

     
    • Юрий Немец

      Здравствуйте, Сергей!

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

      Советую Вам просто посмотреть на Яндексе какие сущности есть в данной микроразметке и выбрать подходящий для Вас вариант.

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

       
      • Сергей

        Юрий, спасибо! Да, сам понял что нужно четче все прочитать и пробовать вставлять самому на сайт с подбором нужных разметок. А после хотел проверить в валидаторах гугла и яндекса и по возможности подправить.

        Но столкнулся с проблемой. После изучения всего начал вставлять код разметки у себя на сайте в админке в html редакторе, а он при сохранении убирает все эти новые теги микроразметки (все обрезает) и оставляет на сайте обычный старый код оформления. Подскажите пожалуйста как это исправить ? То есть как мне на сайте разместить эту разметку.

        Я с программистом (что делал сайт) связь потерял и сам пробую разобраться. Хотя бы какую информацию искать с подобными проблемами ?

         
        • Юрий Немец

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

           
          • Сергей

            Юрий, извиняюсь, возможно, мои вопросы глупы. Но подскажите пожалуйста.

            1. Шаблон wordpress в какой программе создается. Это просто код и в обычном Notepad++ я его могу создать ?

            2.Шаблон это код заключающий в себе все нужные теги (теги микроразметки), ссылки и весь текст на сайте ? То есть как у Вас выше пример кода между <div>…</div> это и есть готовый шаблон сохраненный в формате html ? 

            3. И главное… Прочел что через ftp  можно перенести свой шаблон в папку themes, путь до папки: httpdocs или public_html . Если этой папки у себя не могу найти ? Ее можно просто по правилам создать и вставить на сервер через ftp. Или лучше вторым путем загружать через панель управления хостингом (если возможно)

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

            Спасибо заранее за ответ.

             

             
            • Юрий Немец

              1. Лучше взять готовый шаблон. Бесплатных шаблонов для WordPress очень много.

              2. Шаблон WordPress — это набор PHP, CSS, JS, IMG файлов. Это не HTML странички, потому что они генерируются динамически.

              3. Можно загрузить через панель управления хостингом, а можно через FTP.

              Чтобы разместить микроразметку Вам нужен файл single.php. Чаще всего он так называется. Но в разных шаблонах структура может быть разная.

               
              • Сергей

                Юрий, спасибо ! Буду разбираться и пробовать.

                 
  • Almas

    Спасибо! Толковая статья!

     
  • Ice

    А разве страницу нужно размечать только одну сущность?

    Не правильней ли будет

    WebPage

    MainContentOfPage {

          Article (или BlogPosting)

    }

    WPFooter

     

     
    • Юрий Немец

      Я привел пример только одной самой популярной сущности для блогов. Но сущностей на странице может быть больше одной. Например на странице блога могут быть сущности "BlogPosting" и "Comment".

       
  • infraweb

    А как определить эффективность микроразметки ? Есть какие то графики, цифры ? Инструменты для вебмастера ? Валидация это один вопрос. А как взвесить реальную пользу ?

     
    • Юрий Немец

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

       
  • Руслан

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

    Надеюсь, всё получится быстро и без проблем

     
  • Александр

    Жаль конечно, что нет готового кода, но ничего буду разбираться. 🙂

     
    • Юрий Немец

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

       
      • Александр

        Юрий, согласен с вами. Суть есть, и довольно не плохо всё расписано. Но только статья эта тогда получается совсем не для новичка, который хочет разобраться. Если честно, то я просто не увидел в статье информации о том куда вставлять все эти кода, в какой файл. Хоть бы несколько примеров надо было добавить, куда вы у себя на блоге вставляли эти кода.

         
        • Юрий Немец

          Александр, вам необходимо разметить именно статью. Поэтому, если вы используете CMS WordPress, то вам необходимо все изменения вносить в файл single.php вашей активной темы. Может быть так, что ваша тема в данном файле подключает другой файл, где хранится вся информация для полной записи, которая выводится в WordPress. Вам необходимо найти именно этот файл, который и отвечает за вывод полной записи. Он может называться еще content-single.php и лежать, например, в папке layouts в директории вашей темы.

           
          • Александр

            Юрий, спасибо за ответ. Ещё раз прочитал статью. Зацепился я на вашем блоге, потому что из выдачи топа яндекса по запросу: "как внедрить микроразметку", реально только у вас полностью есть микроразметка. У остальных есть предупреждения и ошибки. Я уже понял, что одну ошибку у меня выдаёт из плагина All In One SEO Pack. Вот что пишется: microdata

            ОШИБКА: невозможно определить принадлежность данных полей. Возможны две причины: эти поля некорректно размещены, либо указан лишний атрибут itemprop

            Может нужно ещё настройки проверить плагина, хотя я вроде настраивал всё правильно.

            А вторая ошибка, что то с комментариями. Тут такой текст: article

            ПРЕДУПРЕЖДЕНИЕ: поле comment содержит некорректный тип данных http://schema.org/UserComments. Допустимые типы данных http://schema.org/Comment

            Что то можете в двух словах подсказать по этим ошибкам? Спасибо.

             

             
            • Юрий Немец

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

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

               
              • Александр

                Отключил микроразменку в настройках плагина — ошибка пропала. Теперь ещё проблема с комментариями осталась. smiley

                 
                • Юрий Немец

                  Зайдите в файл comments.php и посмотрите какой функцией подключаются комментарии. Скорее всего она будет в файле, который находится в папке inc. Найдите по какому-либо классу атрибут в комментариях и вручную удалите их.

                   
  • Vladimir

    Подскажите пожалуйста, что за ошибка такая "Необходимо указать значение поля name"

    http://prntscr.com/d4ohv8

     
    • Юрий Немец

      Добрый день, Владимир!

      Внизу страницы с описанием сущности Product (перейти) есть примеры использования микроразметки. Смотрите тот вариант, в котором вы размечаете, и сравните все ли обязательные пункты указали.

       
      • Vladimir

        Спасибо, нашел способ исправления ошибки в редакторе. Теперь надо сделать реализацию

         
  • Владимир

    Подскажите пожалуйста, а для главной страницы, где список последних новостей выводяться, нужна разметка или нет? Я смотрю у Вас нет её.

     
    • Юрий Немец

      Добрый день, Владимир!

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

       
  • Диана

    Подскажите, как правильно разметить Рецепты на сайте?

    Прописала recipeinstructionsи recipeingredient, а также name

    Как правильно прописать image?

     
    • Юрий Немец

      Добрый день, Диана!

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

      В самом конце страницы есть примеры разметки. Вам необходимо выбрать вкладку (она вторая слева) "Microdata" и посмотреть как там все размечено. Также вы там найдете как правильно разметить изображение на конкретном примере исходного кода.

       
  • Диана

    Спасибо, Юрий!

    Смотрела спецификации, но видимо так и не добиралась до примера в самом низу указанной страницы!

    Оказалось все просто:

      <img itemprop="image" src="bananabread.jpg" alt="Banana bread on a plate" />\

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

     
    • Юрий Немец

      Диана, отлично, что решилось у вас. Но в статье для для сущности ImageObject по спецификации обязательно нужно задавать ширину и высоту.

       
  • Антон Александрович

    Спасибо, нашел способ исправления ошибки

     
  • Иван

    Как поисковики относятся к микроразметке на динамических сайтах? 

     
  • Александр

    Здравствуйте. Из какого поля Яндекс берет картинку для сниппета рецептов? Сделал на сайте: 

    <img itemprop="resultPhoto" src="{fullimage-1}" /> — пришлось скрыть: desktop: none;

    Кстати Google выдает как ошибку это поле.

    и есть: <link itemprop="resultPhoto" src="{image-1}" alt="{title}"/>

    так же для Google: <img itemprop="image" src="{fullimage-1}" alt="{title}" />

    В Google картинки к сниппету появились, а в Яндексе пока нет, может что-то не правильно разметил, подскажите. Движок DLE.

     
    • Юрий Немец

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

       
  • Дмитрий Ковалевский

    Юрий, спасибо за статью.

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

    Как выбирать тот или иной тип ?

    И что "размечать" на сайте?

    К примеру, сайт адвоката. Есть контакты в шапке и на странице контактов.

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

    Первое — это какой тип выбрать? Есть общий тип "http://schema.org/LegalService&quot;, но внизу страницы есть пояснение и ссылка, что более конкретный тип "http://schema.org/Attorney&quot;. Но когда читаешь описание Attorney, в нем сказано "Этот тип является устаревшим — LegalService является более широким и менее двусмысленным".  Какой-то разворот-поворот, замкнутый круг если честно)

    А также, можно выбрать тип "http://schema.org/Organization&quot;, который более распространен.

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

    Если размечать шапку, то каким типом? Я уже упонул три, но есть же еще и "http://schema.org/WPHeader&quot;.

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

     

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

    С уважением, Дмитрий.

     
    • Юрий Немец

      Добрый день, Дмитрий!

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

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

      <div itemscope itemtype="http://schema.org/LegalService">
         <span itemprop="name">Название вашей фирмы</span>
         <div itemscope itemtype="http://schema.org/PostalAddress">
            <span itemprop="streetAddress">Улица</span>
            <span itemprop="addressLocality">Город</span>,
            <span itemprop="addressRegion">Регион</span>
            <span itemprop="postalCode">Почтовый индекс</span>
         </div>
         <span itemprop="telephone">Телефонный номер</span>
         <div itemprop="geo" itemscope itemtype="http://schema.org/GeoCoordinates">
            <meta itemprop="latitude" content="55.755814" />
            <meta itemprop="longitude" content="37.617635" />
         </div>
          <div itemscope itemtype="http://schema.org/ImageObject">
            <h2 itemprop="name">Название изображения</h2>
            <img src="image.jpg"  alt="Описание изображения"   itemprop="contentUrl" />
            <span itemprop="author">Автор фото</span>
            <span itemprop="contentLocation">Где сделано фото</span>
             <meta itemprop="datePublished" content="2008-01-25">Дата публикации (Например: февраль 25, 2017)
            <span itemprop="description">Описание к фото, как пояснение</span>
          </div>
      </div>

      И таким образом можно вставить столько полей в данной сущности, сколько их представлено на данной странице: Перейти. Но это не значит, что нужно все размещать только на одной странице. Так как это сайт, а не лендинг, то и сама информация будет отличаться от страницы к странице, но сущность должна оставаться одна — "LegalService".

       
      • Цифровой

        За гео отдельное спасибо. На офф сайте не нашел пример

         
        • Юрий Немец

          Пожалуйста! Не все очевидно на Schema.org, но если внимательно все изучить, то поймете, что там все есть, нужно лишь время на изучение.

           
  • КиноЛюба

    Ну наконец то нашла интересную, а главное полезную статья про микроразметку. Два года не "парилась" на этот счет, а тут решила сделать новый сайт и подумала, что если, поставить микроразметку. В общем спасибо вам за проделанную работу. laugh

     
  • Эл

    Доброго дня

    Подскажите, пожалуйста, если я использую сущность Organization, на сайте которой находится статья о товаре/оборудовании, такую статью правильно будет пометить как itemprop="articleBody", или нужно что то другое?

     
    • Юрий Немец

      Здравствуйте!

      Чтобы разметить товар (как карточку товара), то лучше использовать сущность Product. Потому что в этой сущности есть такие параметры как:

      1. Name — название продукта (товара)
      2. SKU — артикул
      3. Description — описание продукта (то, о чем вы и спрашивали)

      Внутри сущности Product нужно использовать сущность Offer. А уже внутри сущности Offer вы можете указать: цену, валюту, наличие на складе и т.д.

       
      • Эл

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

         
        • Юрий Немец

          Если статья информационная (а у вас она именно такая), то вам подойдет та разметка, которая описана в статье выше и вы можете пометить описание через itemprop="articleBody".

           
          • Эл

            Спустя время, вернулся к этому вопросу, и задумался, ведь если использовать  itemprop="articleBody", то нужно указывать, что это блог, однако, совсем не хочется, что бы поисковик счел сайт предприятия с представленным на нем оборудованием, которое продается, чисто информационной информацией и приравнял к блогу. Как же быть?

             
            • Юрий Немец

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

              Но страницы с оборудованием лучше разметить сущностью Product.

               
  • Людмила

    Добрый день, Юрий!  Спасибо за действительно полезную статью. она мне очень помогла разобраться. Подскажите, пожалуйста, верно ли я понимаю? При использовании микроразметки для тэгов a и img, значения для href в них должны быть абсолютными. Т.е., например, http://site.ru/name-of-folde…, а не /name-of-folder/page.html.
    Т.е. если я хочу, например, разметить навигацию сайта, то все ссылки в меню должны быть абсолютными, верно?

     
    • Юрий Немец

      Добрый день, Людмила!

      В статье я вписал относительные ссылки, чтобы кода было немного, вам нужно писать то, что у вас генерирует ваша CMS. То есть пути могут быть и абсолютными и относительными.

       
  • Влад

    ImageObject в BlogPosting должен быть один? Если например в статье много изображений к какому из них добавлять микродату?

     
    • Юрий Немец

      Влад, к первому в статье.

       
  • алекс

    Требуется тоже подправить микроразметку на уже работающем сайте, но не могу найти

     
    • Юрий Немец

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

       
  • Александр

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

     
    • Юрий Немец

      Даже если это напрямую не влияет, то все равно сделает пользу, если у вас будет более расширенный сниппет на поисковой выдаче. Ведь, если он содержит более подробную информацию, по величине больше остальных сниппетов, то больше вероятность, что его выберет пользователь. Таким образом CTR может увеличиться, а это прямой путь в ТОП 😉

       
  • Айк

    Спасибо за пост !

     
  • scorp13

    При использовании микроразметки важно, чтобы контент, которій размечается, был виден

    т.е. вариант 

    <meta itemprop="datePublished" content="2016-01-24">

    может не прокатить, а вот приведенный в комментариях пример

    <meta itemprop="datePublished" content="2008-01-25">Дата публикации (Например: февраль 25, 2017)

    где невидимые данные микроразметки дублируются видимым контентом — то что любит Google.

     
  • Сергей

    Здравствуйте. 

    Не могу разобраться может кто поможет. 

    Хочу разметить карточку, но макет

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

    Дело в том что h1 — это артибут name сущности Product, а хлебные крошки будут размечены в сущности BreadCrums. Вот вопрос, — допустимо ли использовать вложение сущностей. 

    И вообще, нормально ли использовать несколько сущностей на одной странице?

    Спасибо, Юрий, за статью.

     
    • Юрий Немец

      Вам необходимо посмотреть, будет ли ошибка в валидаторе. Но в сущность Product сущность Breadcrumbs не входит и будет ошибка.

       
  • rusfet.biz

    Классно написано! Забираю в закладки. Надо пробовать!

     
  • Евгений

    При скроле страницы эффект увеличения и перекоса изображений очень сильно нагружает глаза.

     
  • Виталий

    Подскажите пожалуйста, после интеграции кода микроразметки на сайт, через какой период Google начинает показывать SERP с учетом микроразметки? Зависит ли это от каких-то факторов или это происходит после следующей индексации?

     
    • Андрей

      Это происходит тогда, когда Гугл это захочет. Причем, даже не факт, что он вообще будет выводить в сниппет звездочки. Так что, на этот вопрос, однозначного ответа не существует.

       
      • Юрий Немец

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

         
  • Тим

    Где найти поля микроразметки для логистики?

     
    • Юрий Немец

      Это может быть микроразметка услуги. Тогда вам подходит сущность Service.

      Вот скриншот со страницы с сайта Schema.org:

      Сущность Schema.org

       
  • Михаил

    Юрий, здравствуйте! Вроде сделал все правильно, но ругается на микроразметку на этой странице: https://www.zdoroviemed.ru/stomatologiya/

     
    • Юрий Немец

      Добрый день, Михаил!
      Проверил, в валидаторе Google две сущности: Organization и Breadcrumbs. Ошибок в них нет на данный момент.

       
  • Roman

    Спасибо за статью. Такой вопрос. А если валидатор гугла показывает 0 ошибок, но 7 предупреждений. В предупреждениях рекомендации разметить те элементы, которых на сайте у меня не предусмотрено. Это плохо или и так сойдет?))

     
    • Юрий Немец

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

       
      • Roman

        Огромное спасибо за быстрый ответ! Ну там такое типа указать количество единиц товара, указать срок действия цены, указать наличие на складе и т. д. Но у меня этого всего нет в коде и не будет пока что)

         
  • Мария

    Добрый день! Подскажите, пожалуйста, как разметить страницу, где перечислены все статьи? То есть основная страница для статей Blogposts, откуда идут ссылки на сами статьи.

     
    • Юрий Немец

      Добрый день, Мария!
      Чтобы разместить страницу со списком статей используйте сущность Blog.

       
  • Сергей

    Здравствуйте! Подскажите пожалуйста все интересует такой вопрос, Schema.org размечается на странице полной новости, а на категориях например в краткой новости, например рицепты там тоже ведь есть и ингридиенты, название и краткое описание, подскажите пожалуйста стоит там размечать или оформляется главная, категории, за ранее спасибо за ответ.

     
    • Юрий Немец

      Здравствуйте, Сергей!

      Возможно вы хотите, чтобы на поиске в Google показывалась карусель рецептов с вашего сайта. Например, так:

      Тогда вам необходимо использовать структурированные данные типа ItemList.

      И на одной странице вы сможете разметить категорию со списком рецептов.

       
  • Алекс

    Добрый день,
    для того, чтобы использовать
    Микроразметка FAQ от Schema.org

    кроме самого кода в

    надо ли какой-то код устанавливать в ?

    Спасибо за ответ)

     
    • Алекс

      вижу теги не выводятся,
      повторю вопрос по Микроразметке FAQ от Schema.org,
      кроме основного кода в теле страницы, который ставят в
      надо ли какой-то код устанавливать в шапке страницы ?
      Спасибо

       

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

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

Содержание