Как проверить микроразметку на сайте — Сollaborator

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

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

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

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

Что нам дает правильная микроразметка

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

• она способствует привлечению необходимого трафика из поисковых систем; 
• нужна для обнаружения необходимого контента поисковиками; 
• оказывает положительное влияние на релевантность страниц; 
• требуется для качественного SEO-продвижения.

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

Для проверки правильности составления кода микроразметки сайта используйте валидаторы Google и Яндекс. В обоих инструментах можно вставить ссылку на страницу либо фрагмент кода с синтаксисом разметки. Внедрять этот код на сайт можно лишь при отсутствии ошибок в обоих валидаторах. Рассмотрим более детально каждый инструмент.

Проверка структурированных данных Google (валидатор микроразметки)

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

Шаг 1. Для начала перейдите на официальную страницу валидатора Google → 

Шаг 2. Заполните форму проверки и запустите процесс. 

Можно также выбрать поискового робота (мобилки/ПК).

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

Вот что увидит владелец сайта, у которого микроразметка не реализована на сайте:

А вот пример, когда микроразметка есть на сайте:

Вот так выглядит элемент микроразметки Organization на сайте:

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

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

   

Вот так работает валидатор Google. Как видно, ничего сложного в проверке микроразметки нет.

Проверка микроразметки в Яндекс.Вебмастере

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

Шаг 1. Для начала перейдите к валидатору микроразметки Яндекс.Вебмастер →

Шаг 2. На странице «Микроразметка» в Яндекс.Вебмастере понадобится ввести ссылку на проверяемую страницу или фрагмент кода и запустить проверку, которая займет несколько секунд.

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

Используйте эту информацию для решения проблем на страницах.

Онлайн валидатор микроразметки от Schema.org

Шаг 1. Переходим на сайт Schema.org →

Шаг 2. Нажимаем «Новый тест», вставляем в поле URL-адрес сайта/страницы и нажимаем «Проверить».

Через некоторое время получаем результат:

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

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

Похожие вопросы

• Как увеличить краулинговый бюджет
• Как сделать микроразметку FAQ на сайте. Примеры и наблюдения

Ольга Горбенко

Практикующий SEO-специалист

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

TILDA HELP CENTER

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

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

Как добавить микроразметку на сайт на Тильде

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

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

Быстрые ссылки формируются автоматически роботом Яндекса. Робот определяет наиболее посещаемые разделы сайта и создает быстрые ссылки при следующих условиях:

1. короткие и понятные названия страниц точно отражают их содержание;
2. быстрые ссылки создаются только из внутренних ссылок сайта;
3. разделы и подразделы выделены в меню или являются самыми популярными переходами со страницы, для которой формируются быстрые ссылки.

В настоящее время дополнительные ссылки добавляются автоматически.

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

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

Для того, чтобы сгенерировать код микроразметки для других страниц, нужно использовать генератор. Мы рекомендуем сервис https://webcode.tools/generators/json-ld

Пример: рассмотрим, как добавить микроразметку для статьи в блоге Тильды «27 документальных фильмов для дизайнеров»:

Заходим на сайт генератора разметки и выбираем тип страницы — «Статья»

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

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

Переходим на Тильду. Настройки страницы → Дополнительно → HTML-код для вставки внутрь HEAD.

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

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

Зачем нужна микроразметка

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

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

Существует несколько основных способов (словарей) микроразметки:

• Добавление параметров Schema.org непосредственно в код сайта
• Использования кода JSON-LD

Способ JSON-LD отличается тем, что для его настройки не нужно вручную менять код каждого элемента, который нужно разметить. Для добавления разметки в этом случае достаточно написать или сгенерировать код разметки и добавить его отдельно в Head сайта или страницы. Кроме того, он рекомендован Google.

Как добавить разметку микроданных │ Справочный центр Tilda

СПРАВОЧНЫЙ ЦЕНТР TILDA

Использование кода для расширенного описания в поисковых системах

Микроданные — это способ указать ваш контент для роботов поисковых систем для использования в фрагментах результатов поиска. Чтобы добавить разметку данных на сайт, сделанный на Тильде, вы можете воспользоваться сервисом webcode.tools.

Как добавить микроразметку на сайт, сделанный на Тильде

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

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

Дополнительные ссылки или дополнительные ссылки теперь добавляются автоматически.

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

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

Для генерации кода микроданных необходимо использовать генератор. Мы рекомендуем этот сервис: https://webcode.tools/json-ld-generator.

Пример: Как добавить микроданные для статьи на Тильде «Как улучшить SEO на Тильде»:

Выберите тип страницы «Статья» на сайте генератора

Заполните поля. Они могут отличаться в зависимости от выбранного вами типа страницы.

Скопируйте код из правого столбца

Перейдите на Тильду → Настройки страницы → Дополнительно → HTML-код для раздела «Заголовок»

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

Для проверки разметки микроданных можно воспользоваться сервисами проверки разметки, например вот этой от Google. Он проверит для вас правильность разметки микроданных и предоставит информацию об ошибках, если они есть.

Зачем использовать разметку микроданных?

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

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

Существует несколько способов добавления микроданных на веб-сайт:

• путем добавления параметров Schema. org непосредственно в код веб-сайта
• с использованием кода JSON-LD

Метод JSON-LD позволяет не изменять код для каждого элемента вручную. Чтобы добавить разметку микроданных, вы можете написать или сгенерировать код разметки и добавить его в раздел Head вашего веб-сайта или страницы. Google рекомендует этот метод.

Разметка схемы для SEO

Брэндон Аморозо

25 сентября 2020 г.

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

Что такое структурированные данные Schema.org?

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

Можете ли вы заметить что-нибудь необычное в этом результате поиска? Если вы сказали звездный рейтинг, вы его поняли! Рейтинги продуктов, отображаемые под вашим стандартным результатом поиска, являются побочным продуктом реализации структурированных данных schema. org на странице продукта.

Обзоры — это лишь один пример того, что добавление схемы может сделать для ваших результатов поиска. Чтобы сгенерировать собственный код, воспользуйтесь Помощником по разметке данных Google.

Разница между схемой, микроданными, разметкой структурированных данных, Open Graph, JSON-LD и т. д.

Давайте проясним путаницу между всеми этими разными, но довольно похожими терминами:

• Структурированные данные: стандартизированный формат для обозначения размещать информацию на веб-странице, чтобы помочь поисковым системам лучше понять, о чем эта веб-страница.
• Микроданные: микроданные — это форма структурированных данных, которая работает с HTML5.
• Schema.org: Согласованные определения тегов микроданных между основными поисковыми системами Google, Bing и Yahoo.
• Rich Snippets: Тип расширенного результата. Обычные результаты поиска с отображением дополнительной информации.
• Расширенные результаты: любой тип визуально улучшенных результатов поиска с информацией, извлеченной из структурированных данных.
Особенности SERP
• : Любой результат, который не является традиционным органическим результатом. Наиболее распространенными являются расширенные фрагменты! Они также могут быть избранными сниппетами, контекстной рекламой, твит-боксами и панелями знаний 9.0023
• Панели знаний: блок, который вы иногда видите в правой части экрана в результатах поиска, полученных из сети знаний Google, базы, используемой для получения информации из различных источников для предоставления релевантных результатов поиска Google. Лучший пример: если вы местный бизнес и у вас есть учетная запись Google My Business, вы обычно увидите это в результатах поиска с правой стороны.
• Open Graph: Facebook использует разметку, чтобы знать, какие изображения и описание отображать, когда кто-то делится вашей страницей в социальных сетях. Открытый граф не заменяет Schema, но их можно и нужно использовать вместе.
• JSON-LD: нотация объекта Javascript для связанных данных. Другими словами, это формат реализации для schema. org, который считается более простым в реализации, чем микроданные.

Schema Markup SEO Best Practices

JSON-LD

JSON-LD позволяет просто вставлять разметку в документ с кодом HTML, а не оборачивать разметку вокруг элементов HTML, как это делается с микроданными. Мы используем JSON-LD для реализации разметки схемы для всех наших клиентов.

Что делает JSON-LD?

JSON-LD структурирует ваши данные, аннотируя элементы на странице, которые, в свою очередь, используются поисковыми системами для извлечения фактов и информации о вашем веб-сайте и веб-странице.

Куда добавить JSON-LD?

Google рекомендует добавлять JSON-LD в раздел вашего HTML-документа, но он также может находиться в разделе.

Как реализовать JSON-LD

«@context»: «

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

<тип сценария = «application/ld+json»>

{

«@context»: « https://schema.org », ‍

Реализуя вышеизложенное, вы можете использовать любые типы элементов и свойства элементов, которые Schema.org определяет. .

«@type»: «…»,

Последним элементом каждого JSON-LD является спецификация типа. Полный список типов можно найти здесь, на schema.org. Это сообщает поисковой системе, что я использую этот тип элемента, и вы можете найти его здесь. Теперь все, что вы добавите, будет атрибутом типа.

<Тип сценария = «Приложение/LD+JSON»>

{

«@Context»: « https://schema.org », 33333333333333333333333333333333333333333333333333333333333333333333339н. type: «Рецепт», 

Совет electroIQ. Если вы используете вложенный тип элемента, вам нужно будет указать другой @type.

Пары атрибут-значение

Давайте начнем аннотировать информацию о типе элемента! Вы можете найти свойства элемента на странице типа элемента Scehma.org, чтобы добавить их в свой HTML-код.

Для каждого свойства элемента в JSON-LD требуются следующие два элемента:

1. Свойство элемента: какое свойство элемента определяется словарем Schema.org?
2. Значение: значение указанного свойства элемента. Крайне важно, чтобы значение соответствовало свойству и было единственным (т. е. каждое значение должно быть аннотировано отдельно. Строки (символы) и URL-адреса нуждаются в «двойных прямых кавычках». сами по себе не нуждаются в кавычках, но также можно заключать их в кавычки (это просто означает, что они будут считаться строка  тип данных).

33 : «Рецепт»,

«имя»: «Салат с прошутто от Брендона с курицей»,

Использование квадратных скобок

аннотировать значения.

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

«Имя»: [«Салат с прошутто от Брендона», «Салат с прошутто от Брендона»],

Эти квадратные скобки означают, что для этого типа элемента может быть несколько значений; Салат Брэндона имеет два разных названия.

Вложение JSON-LD

Вложение звучит сложнее, чем есть на самом деле. Думайте о своем JSON-LD как о матрешке. Самая большая кукла — это ваш высокоуровневый @type, но внутри основного @type может быть несколько @types.

Вложение

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

3339. . 440”,

“bestRating”: “5”,

“worstRating”: “4”,

},

Wow! Это чертовски хороший салат. Вы можете видеть, как я вложил его в текущий JSON-LD, а также как я сделал отступ во вложенном коде для удобства чтения.

Контрольный список вложения:

• Использовать свойство элемента, относящееся к типу элемента
• Значения заключены в фигурные скобки
• Необходимо определить тип элемента этого свойства
• Сопутствующие свойства атрибута/значения в свойствах конкретных типов элементов.
• Поставьте запятую после закрывающего }, если есть еще свойства элемента.

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

Распространенные ошибки JSON-LD и Schema Markup

Мы все были там. Ваша разметка просто не будет работать в инструменте тестирования структурированных данных Google. После того, как вы все больше разочаровываетесь, вы решаете, что вся эта поисковая система просто не для вас. Ждать! Ниже приведены наиболее распространенные ошибки, с которыми мы сталкиваемся при реализации JSON-LD:

1. Синтаксис

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

2. Словарь

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

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

3. Нарушение политики

Обычно это происходит только при добавлении аннотированной информации, которая на самом деле не отображается на странице. Это не только противоречит рекомендациям Google, но и не будет отображаться в результатах поиска, так зачем это делать?

4. Редакторы документов

Напишите свой код в редакторе HTML. Копирование и вставка из Google Docs, Pages, Microsoft Word и т. д. может вызвать проблемы с форматированием (особенно с кавычками).

Пошаговый список для добавления JSON-LD на ваш сайт

То, как вы в конечном итоге реализуете свой JSON-LD, зависит от того, достаточно ли вы опытны в этом. Ниже мы предоставили схему для новичков в Schema.org и JSON-LD, которую вы можете легко воспроизвести, чтобы начать получать расширенные результаты поиска!

1) Что вы хотите разметить?

Определите, что вы хотите разметить, чтобы вы могли найти соответствующий тип Schema. org и соответствующий словарь атрибутов/свойств. Иногда это может иметь смысл для вас, но это не будет вариантом в среде Schema.org

2) Не создавайте с нуля

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

3) Найдите страницу типа вашего элемента Schema.org

4) Сохраните неизменяемые элементы, чтобы скопировать и вставить их

5) Добавьте свой тип элемента как @type:

6) Перечислите свойства и значения вашего элемента, но без синтаксис

7) Форматировать в правильный синтаксис JSON-LD с вложением, где это необходимо или целесообразно

8) Протестировать с помощью инструмента проверки структурированных данных

9) Решить, куда добавить структурированные данные на веб-страницу

Как правило, просто вставьте его в раздел.