Лекция Юлия Тихоход в Школе вебмастеров: «Структурированные данные на поиске»
https://academy.yandex.ru/events/webmasters_school/yawebm2015/
Что такое микроразметка и в чём её польза
Что такое микроразметка (семантическая разметка, семантическая микроразметка) и кому она нужна. Очень кратко — всё, что я знаю о применении семантической разметки поисковыми системами и другими веб-сервисами.
Передача данных в машиночитаемом виде
Какие ещё есть способы передать данные о сайте поисковым системам кроме микроразметки, особенности разных способов. Что бывает с плохими вебмастерами, которые пытаются обмануть поисковые системы и передать неверные данные.
Типы разметки
Из чего состоит микроразметка, какие бывают словари и синтаксисы. Популярные сочетания словарей и синтаксисов, как правильно выбирать нужную комбинацию для своего сайта.
Передача данных об интернет-магазине
Разбор семантической разметки: что в принципе доступно для разметки в интернет-магазине, что это даёт, а что можно не размечать вовсе.
Проверка правильности микроразаметки
Ошибки в микроразметке, способы их обнаружения и исправления. Популярные валидаторы микроразметки. Какие ошибки непременно нужно исправлять, а что можно игнорировать.
7. Что дает микроразметка
• Улучшает внешний вид сайта в результатах поиска
• Делает ссылки в социальных сетях более красивыми
• Дает возможность различным сервисам использовать
данные, размещенные на вашем сайт
8
8. Чего микроразметка не дает
Напрямую микроразметка на позицию в результатах поиска не
влияет
9
11. А оно правда надо?
Сниппеты, построенные с использованием микроразметки,
имеют CTR в среднем на 2% больше (до 5% на десктопе, до 7%
на мобильных устройствах), чем обычные сниппеты для тех же
сайтов.
Доля длинных кликов растет в среднем на 2,5%
12
17. XML
• Учитывайте обязательность элементов
• Не забывайте экранировать специальные символы и
оборачивать HTML-код CDATA
• Передавайте дату в машиночитаемом ISO 8601
• Не вписывайте произвольные значения в элементы с
ограниченным набором значений
18
18. Название партнерской программы Способы передачи данных
Автообъявления XML
Адреса и организации
Микроразметка, XLS, заполнение
спец.формы
Вакансии XML
Видео XML, микроразметка
Вопросы и ответы микроразметка
19. Название партнерской программы Способы передачи данных
Творческие работы Микроразметка
Недвижимость XML
Отзывы XML, микроразметка
Программы Микроразметка
Письма Микроразметка
20. Название партнерской программы Способы передачи данных
Рефераты Микроразметка
Рецепты Микроразметка
Товары и цены XML, микроразметка
Фильмы Микроразметка
21. Семантическая разметка для других
сервисов
• Google – специальные сниппеты, оформление писем в списке
входящих, обогащение Knowledge Graph.
• Bing – специальные сниппеты
• Pinterest – расширенные пины
• Facebook, vk, twitter, G+ - красивые ссылки в социальных
сетях
22
24. Словарь
Соглашение о том, как будут называться сущности, и как они
будут друг с другом соотносятся.
Словари бывают:
• Универсальные
• Специализированные
Вы можете создать свой словарь.
25
29. Микроданные
• itemscope - говорит о том, что внутри данного HTML-тега
содержится некая сущность
• itemtype – говорит о том, какого типа эта сущность. Itemscope
и itemtype всегда идут в паре
• itemprop – указывает на свойства сущности. Все itemprop
должны быть размещены внутри HTML-тега, в котором
объявлена сущность, к которой они относятся
30
30. JSON-LD
• @context определяет словарь
• @type — тип описываемой сущности
• Ключи и значения чувствительны к регистру
• Имена ключей в одном и том же объекте не должны
повторяться
31
31. RDFa
• Если в коде используются префиксы, лучше указать их явно в
<html> атрибутом prefix
• Свойства задаются с помощью атрибута property
• Типы указываются с помощью атрибута typeof
32
34. Размещение магазина в Яндекс.Маркете
1. Зарегистрируйтесь
2. Подготовьте информацию о товарах в форме YML, XLS или
CSV файла
3. Выберите подходящий способ оплаты (плата за клик,
комиссия за заказ, оплата по дням)
4. Настройте и оплатите размещение
35. Передача данных для ПС и соц.сетей
Внедрение Open Graph, Twitter Card App
Link1
▌ Просмотр существующих партнерских программ у ПС
▌ Выбор подходящих вашему сайту
2
▌ Выбор способа передачи данных
▌ Заполнение обязательных полей
▌ Заполнение необязательных полей
3
▌ Проверка данных
▌ Исправление ошибок
36
37. Разметка Open Graph
• Заполнить обязательные поля: og:url, og:image, og:title,
og:type
• og:title – короткий заголовок страницы. Не содержит url
страницы и спама
• og:url – канонический url страницы, без параметров
38
38. Разметка Open Graph
• og:description - несколько предложений, характеризующих
содержимое страницы
• og:image – для главной страницы и для страниц, не
содержащих изображений – логотип, для остальных страниц
сайта – основное изображение на странице
• og:type – для большинства интернет-магазинов – website.
Полный список типов – http://ogp.me/#types
39
39. Разметка Twitter Card
• Twitter понимает Open Graph
• Сопоставление свойств Open Graph и Twitter Card -
https://dev.twitter.com/cards/markup
• Для некоторых видов контента есть специфичная для
твиттера разметка
40
40. Добавление App Link
• Имеет смысл, если у вас есть мобильное приложение
• Позволяет отправлять пользователей сразу в приложение
41
44. Передача данных Google
• Данные для Knowledge Graph
• Товары и цены
• Отзывы
• Видео
• Статьи
45
45. Приоритезация
• Товары и цены (сниппеты и, возможно, Яндекс.Маркет)
• Отзывы (для Google)
• Адреса (в т.ч. Для Knowledge Graph)
• Видео
• Статьи
46
46. Принципы выбора способа передачи
данных
• Простота внедрения
• Простота поддержки
• Универсальность (подходит для разных потребителей или
нет)
• Скорость обновления данных
47
47. А теперь способ выбора микроразметки
для ленивых
1. Берете несколько (3-5) страниц конкурентов с контентом, похожим
на ваш
2. Берете валидатор микроразметки (например, яндексовый)
3. Прогоняете типовые страницы через валидатор и смотрите, какая
разметка есть у конкурентов
4. Внедряете у себя такую же
5. Profit!
48
55. Топ-5 ошибок в микроразметке
• В RDFa (в т.ч. Open Graph) не указан префикс, не
являющийся префиксом по умолчанию
• В микроданных itemprop указаны за границами тега,
содержащего itemscope, или атрибут itemscope не указан
• Пропущены обязательные для получения результата поля
• Неверный формат даты (не ISO 8601)
• Использование неверного типа данных
56
58. Проверяйте микроразметку регулярно
59
Вы меняете верстку и микроразметка на вашем сайте ломается. Чтобы
вовремя узнать об этом, используйте API валидатора микроразметки.
64. Возможно ли использование цветных
символов (эмоджи) в заголовках и
описаниях сниппетов для интернет-
магазина?
│ В Google – да. В Яндексе – нет.
65. К чему приводит неправильная
микроразметка и как от этого страдает
внешний вид сайта и предоставляемой
информации?
│ Внешний вид сайта и информации не
страдает никак. На выдаче и в
социальных сетях могут быть
неправильные сниппеты.
66. Анализ микроразметки и результаты ее
обработки в Yandex и Google - несколько
различаются. Что в первую очередь следует
учитывать при формировании шаблонов
страниц?
│ Яндекс проверяет микроразметку более
строго. У Яндекса и Google различается набор
обязательных полей для разных типов.
Старайтесь указывать обязательные поля
для обеих поисковых систем.
67. При создании сайта, микроразметка - это что-
то само собой разумеющееся или необходимо
отдельно прописывать эту опцию в тз?
│ Лучше ничего не считать само собой
разумеющимся и все прописывать в ТЗ. В том
числе и необходимость микроразметки. Все, что
вы не укажете в ТЗ, может быть использовано
против вас
68. Возможно ли организовать в сниппете на
позиции от 10 и ниже структурированные
данные?
│ Да, возможность построения
специальногго сниппета не зависит
от позиции сайта в результатах
поиска.
69. Какой смысл использовать Микроданные,
если Яндекс ищет только по нескольким их
видам (рецепты, видео, ...)?
│ Не Яндексом единым Микроразметка
довольно универсальная штука, ее
понимает не только Яндекс. Количество
типов, которые понимают ПС тоже растет.