sonyps4.ru

Что такое микроразметка и как ее проверить. Что такое микроразметка и чем грозит вебмастерам ее отсутствие

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

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

Люди, которые отвечают за разработку и всю техническую часть таких сайтов, как Holodilnik.ru , Ozon.ru , Lenta.ru , Interfax.ru и Ivi.ru , ответили на вопросы о том, как на практике происходит внедрение микроразметки и каких результатов она позволяет добиться. А мы со своей стороны рассказали, какие типы мы бы порекомендовали таким сайтам и для чего.

Интернет-магазины

Денис Егоров, руководитель направления интернет-маркетинга Holodilnik.ru :
На сайте holodilnik.ru мы решили внедрить сразу два типа разметки, Open Graph и Schema.org/Product . Причина такого выбора проста - один из этих типов поддерживает поисковик на «Я», а второй - поисковик на «G»:) Внедрять ее было достаточно легко, и о своем выборе нам не пришлось пожалеть.

Конечно, многие сейчас задаются вопросом, какова эффективность того или иного внедрения, в том числе и какова эффективность внедрения мироразметки - на все нужны ресурсы, которые потом должны себя оправдать. Вопрос этот, действительно, интересен. На момент внедрения мы считали микроразметку необходимым улучшением, и у нас не было цели напрямую отслеживать ее эффективность. Однако за год, прошедший с момента ее внедрения, мы получили следующее: глубина просмотра посетителей из поисковиков выросла почти в 2 раза, при этом показатель отказов снизился в 3-4 раза. Количество же достижения цели выросло на 20-30%. Согласитесь, это неплохой показатель. И хотя, конечно, мы не связываем весь этот рост только с внедрением одной лишь микроразметки, значительная доля изменения этих показателей, безусловно, ее заслуга.

Андрей Кузьмичёв, руководитель направления поисковой оптимизации Ozon.ru :
В Ozon.ru мы внедрили разметку разных стандартов, потому что каждая из них дает выигрыш в чем-то своем: микроформат hCard и Schema.org дают качественное представление в поисковых системах, а Open Graph - в социальных сетях. В общем и целом, благодаря этой разметке наши сниппеты стали более качественными и структурированными.

На достигнутом мы останавливаться не собираемся, как, видимо, и поисковые системы. Чем больше новых типов микроразметки они начинают учитывать, тем больше у магазинов становиться возможностей как-то выделиться на поиске. Так, недавно стала учитываться разметка Schema.org/Product по новой партнерской программе Яндекса для разметки товаров . Однако для некоторых категорий мы будем использовать семантическую разметку товаров совместно с программой «Товары и цены» , которая пока иногда дает преимущества по скорости обновления данных о продуктах. И такая задача уже стоит у наших программистов.

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

Для страниц с товарами в Schema.org существует большой тип Schema.org/Product , с помощью которого можно подробно описать практически любую вещь. Благодаря такой разметке в Яндексе формируются структурированные сниппеты с описанием товара и ценой .

Для формирования таких сниппетов нужны указанные поля name , description , price и priceCurrency :

массажёр Beurer MG 81

Массажер Beurer MG81 - это современный, элегантный и многофункциональный прибор. Крупные массажные головки эргономичной формы выполняют глубокий вибрационный (ударный) массаж на любом участке тела. Дополнительно массируемый участок тела можно прогреть инфракрасным нагревательным элементом. Также возможно подключить 2 разные массажные насадки. Вибромассажер с инфракрасным излучателем может проводить массаж с различной интенсивностью. Вы можете проводить массаж и самостоятельно, и с помощью другого человека. Длинный сетевой шнур позволяет проводить сеанс массажа в удобном месте независимо от расположения розетки. Также у массажера удобная и не скользящая ручка для простого и надежного применения. 3320 руб.
Большое влияние на решение о покупке оказывают отзывы. Если у вас есть отзывы, мы рекомендуем добавить специальную разметку: в Product для этого есть свойство AggregateRating , а в микроформатах есть тип hReview .

В Google на основе разметки формируются специальные сниппеты .

Для этого необходимо указать значение поля AggregateRating :

"Смартфон Apple iPhone 6 4.7" 16Gb Space Gray


Для страницы с контактами подходит разметка Organization от Schema.org или микроформат hCard . C их помощью можно участвовать в партнерской программе Яндекса : попасть в справочник и улучшить ответы не только в поиске, но и на Яндекс.Картах.

При использовании микроформата необходимо указать название организации, адрес и телефон:

Онлайн-мегамаркет OZON.ru: год за годом

Офис в Москве

125252 , г. Москва, Чапаевский переулок, д. 14


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

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


Для страницы с перечнем товаров можно добавить разметку ItemList , чтобы получить специальный остров с каталогом :

Сковороды Rondell

{{totalModelsCount}} {{currentModelsCount}}

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

СМИ

Александр Ломакин, технический директор Lenta.ru :
В Lenta.ru мы используем три типа семантической разметки: это Open Graph , Twitter Cards и Schema.org .
С первыми двумя стандартами от Facebook и Twitter все просто - наши материалы достаточно много «шерят» и «лайкают», поэтому в социальных сетях они должны выглядеть ничуть не хуже, чем на основном сайте. С помощью разметки мы это контролируем, размечая фотографию, заголовок, и краткое описание.


Для новостных сводок и различных текстов подходит разметка CreativeWork , с помощью которой в Яндексе строится структурированный сниппет и остров с карточкой новости.

Детский театральный фестиваль "Большая перемена" открывается в Москве

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

Платформа «Острова» находится на стадии бета-тестирования

На страницу с контактами можно добавить разметку Organization или hCard .

Видеохостинги

Денис Чудинов, руководитель направления оптимизации Ivi.ru :
Мы начали задумываться над внедрением микроразметки лишь в 2012 году, в то время как Яндекс еще в 2010 году стал учитывать первые типы микроразметки. Но лучше поздно, чем никогда:) Однако оказалось, что и в 2012 году в Рунете не было практически никаких примеров ее использования, все были только наслышаны о ней, но совершенно не понимали, как и что внедрять. Поэтому учиться приходилось на собственном опыте: нам ничего не оставалось делать, как самим рассматривать разные варианты, изучать документацию имеющихся стандартов и подсматривать у западных коллег. В общем, экспериментировали. В итоге решили внедрить два типа: Open Graph и Schema.org/Movie , так как они помогают передавать данные поисковым системам и красиво отображаться в социальных сетях.

Для нас это внедрение проходило непросто как с точки зрения разработки, так и с точки зрения понимания, зачем она нужна - на тот момент было не очень очевидно, что даст микроразметка. В общем было ясно только то, Open Graph нужен для социальных сетей, а Schema.org для поисковиков. Кроме того, на тот момент у нас не было отдельной метрики для измерения эффективности разметки, да и не очень было понятно, как эффект именно от ее внедрения можно измерить. Однако прошло немного времени, и мы стали замечать, что из текста сниппетов в Яндексе стали пропадать «левые тексты», они стали более информативными. И это же стали замечать наши пользователи, что не могло наc не радовать.

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

Все видеоматериалы можно подробно описать с помощью типа VideoObject от Schema.org или расширения Open Graph от Яндекса. Разметка позволит участвовать в партнерских программах Яндекса и Google и хорошо отображаться как в результатах большого поиска, так и в поиске агрегаторов видео.

В разметке указываются данные видео: название, длина, номер серии и так далее.


А с помощью разметки Schema.org/Movie можно получить структурированные сниппеты с описанием фильмов в Яндексе:

Для этого необходимо разметить подробную информацию о фильме:

Кавказская пленница, или Новые приключения Шурика

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

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

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

Мы благодарим наших партнеров за ответы и содействие в составлении этой статьи.

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

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

Теги: Добавить метки

Здравствуйте, уважаемые посетители моего блога!

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

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

Итак, начну по порядку.

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

Микроразметка — это разметка веб-страниц с использованием специальных тегов и атрибутов.

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

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

В настоящее время есть следующие разновидности микроразметки: микроформаты, RDFa и микроданные:

Ну а теперь вкратце о каждом виде разметки.

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

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

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

.

Микроданные

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

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

При разметке html-страниц применяются тоже, как и в микроформатах, HTML-теги

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

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

Ребята, я не стал подробно описывать каждый тип микроразметки, так как основные читатели моего веб-ресурса блогеры. И если у вас есть блог, вам будет достаточно создать на нем один вид микроразметки. Какой? Читайте дальше и все узнаете.

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

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

Преимущества микроразметки

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

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

Он в основном содержит в себе описание данной страницы, фото, контактные данные, цену товара и его рейтинг и т.д.

Плюсы микроразметки

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

  • лучше выглядит сниппет в результатах поисковой выдачи;
  • повышение количества кликов пользователей по ссылке вашей статьи;
  • увеличение релевантности страниц блога;

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

Теперь рассмотрим более наглядно преимущества в использовании микроразметки микроданных. Я буду брать примеры из поисковой системы Google. Там можно более наглядно это увидеть.

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

Видеоролики в сниппете (изображение видео):

Мероприятия в сниппете (дата и название мероприятия, место проведения):

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

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

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

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

На сегодняшний день Schema является стандартом для микроданных.

Стандарт Schema.org имеет в себе около 600 различных классов и их количество постоянно увеличивается. Из этого многообразия классов поисковая система Яндекс распознает не все, а лишь некоторые.

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

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

Влияние микроразметки на ранжирование в выдаче

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

«Микроразметка поможет вашему сайту стать заметнее в результатах поиска Яндекса. Поисковая система Яндекс заинтересована в предоставлении возможности своим пользователям решать проблемы, используя поисковую строку…»

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

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

Анализ и проверка микроразметки

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

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

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

Валидатор микроразметки Яндекса:

http://webmaster.yandex.ru/microtest.xml

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

http://www.google.ru/webmasters/tools/richsnippets

Как я внедрил микроразметку на своём блоге

Да, друзья, все, о чем я писал в сегодняшней статье, не пустые слова, а нужная и полезная информация!

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

Первый — это самостоятельно удалить старые микроформаты hcard и hatom, которые были вмонтированы в мой бесплатный шаблон Incredy, а затем установить микроданные Schema.org.

Второй путь — заказать удаление микроформатов и установку микроданных Schema за деньги.

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

Однако все мои усилия не привели к желаемому результату. Старые микроформаты hcard и hatom не хотели покидать мой блог, и постоянно выбрасывали разные «финты»:

Я начал опять рыться в Интернете, как свинья в огороде, надеясь отыскать заветный желудь. И мне повезло. Я попал на блог webreligion.ru, автором которого является Руслан Белый.

Хочу сказать, что я и раньше был на его блоге (читал его статьи и писал к ним комментарии), так как мы с ним были в одной группе участников блогомарафона «Дружба блогеров», который организовал Константин Белан.

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

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

Хочу отметить, что Руслан (автор блога webreligion.ru) отлично разбирается в программировании. Очень быстро и со знанием дела удалил старую микроразметку и встроил новую Schema.org. В валидаторах проверки микроразметки Яндекс и Google ни одной ошибки!

Но всё дело в том, что Руслан уже не занимается данной услугой…Поэтому, если Вам нужна микроразметка, то пишите на почту суперпрограммисту, моему партнёру и просто отличному специалисту — Дмитрию Горунину: [email protected]

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

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

Ну, вот и все. Моя статья подходит к концу. Надеюсь, она вам поможет.

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

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

Сниппет с микроразметкой

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

Простой сниппет

Детальный сниппет


Есть типы контента, для которых микроразметка обязательна:

    ​ видеоролики;

    ​ фильмы;

    ​ рецепты;

    ​ мероприятия;

    ​ отзывы;

    ​ товары;

    ​ программы;

    ​ рефераты;

    ​ рестораны.

Стандарты микроразметки

Яндекс рекомендует микроразметку Schema.org. Это стандарт семантической разметки, принятый в 2011 г. корпорациями Google, Yahoo и Bing для улучшения структурированности информации на сайте, передачи ее смысла поисковым роботам.

Он использует микроданные для семантической разметки документа.

Микроданные - теги, употребляемые в языке HTML5.

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

Соответствие контента и сущностей

Мероприятие

Организация

Товарное предложение

Несколько товаров

Ресторан

Картинки

Программы

SoftwareApplication

Мобильные приложения

MobileApplication

Интернет-программы

Вопросы и ответы

Question и Answer


Как делают микроразметку

Прописывают ее прямо в html-коде. Используют три основных атрибута:

    Itemscope – указывает роботу о присутствии микроразметки.

    Itemtype - описывает тип сущности.

    Itemprop - указывает свойства сущности.

Первые два атрибута применяются совместно. Для itemprop прописывают значения разных полей. Стандартные: name, description, image, url. Другие поля - специальные и зависят от сущности контента.

Пример кода с разметкой для организации.


Проверяем корректность микроразметки в Яндексе

Еще в 2012 г. Яндекс запустил инструмент, с помощью которого можно проверить микроразметку. Валидатор доступен в «Яндекс.Вебмастер».


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


После проверки валидатором доступен перечень несоответствий, которые делятся на ошибки и предупреждения. Яндекс публикует расшифровку результатов. Валидатор микроразметки от Яндекса - не единственный. Также можно проверить с помощью validator.ru и Structured Data Linter. Однако Яндекс поддерживает микроформаты, микроданные, RDFa, OpenGraph и рекомендуемую schema.org, а также проверяет на соответствие требованиям своих сервисов и партнерской программы.

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


История «рождения» микроразметки

Словари для микроразметки начали создаваться сразу двумя разными источниками: Open Graph и Schema.org. Родоначальниками Open Grapf стали сотрудники facebook. Основная цель, которую они преследовали создавая данный словарь - сделать так, чтобы любой сайт мог быть частью социальной сети facebook и корректно в ней отображаться. Равным образом Schema.org создавалась поисковыми системами для того, чтобы можно было делать удобные сниппеты с данными.

Так что же такое микроразметка?

Микроразметка — единый язык семантической оптимизации, который одинаково понимают и интерпретируют поисковые роботы Google , Яндекс , Bing , Yahoo . Этот язык включает в себя определённые специальные теги, например, такие как

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

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

Начнем со словарей

Как уже упоминалось выше, наиболее распространенными словарями микроразметки являются Open Graph и Schema.org .

По статистическим данным Яндекса известно, что словарь Open Graph используют 15% всех сайтов рунета. Этот показатель является преобладающим среди всевозможных словарей для микроразметки. Сегодня разметку Open Graph понимает не только facebook, как это планировалось сначала, но и многие другие популярные социальные сети, такие как Google+, Twitter, Вконтакте и т.д. На своем официальном сайте создатели Open Graph заявляют, что создание данного словаря - это возможность представления данных веб-страницы как социальных граф. Стоит отметить, что язык строился на основании уже существующих технологий.

В свою очередь, язык микроразметки Schema.org создавался совместно с крупнейшими поисковыми компаниями Google, Yandex, Bing, Yahoo!. Основная цель, которую преследовали разработчики - дать пользователю возможность увидеть в сниппете выдачи дополнительные данные о компании не заходя на сайт, и, таким образом, сделать поиск более быстрым и удобным. Со Schema.org сниппет содержит более полное описание страницы, может включать рейтинг, выводить стоимость «от и до», включать разметку хлебных крошек и т.д.


Если рассмотреть принцип работы словаря микроразметки Schema.org более детально, то можно увидеть, что веб-страница представляет собой схему из разных типов данных. Каждый такой тип соединен с набором свойств. Типы иерархически организуются в схемы. На официальном сайте Schema.org можно найти утверждённые и действующие типы и их свойства. Для примера рассмотрим alternateName , description , image .

В свойстве alternateName, в основном, излагается текстовая информация, в которой указываются псевдонимы (алиасы) описываемого объекта. В свойстве description представляется описание того объекта, о котором идет речь, а в image может отображаться изображение или ссылка на изображение товара (услуги) о котором(ой) идет речь.

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

  • itemscope - описывает каждый блок отдельно, позволяет описать информацию на уровне сущности;
  • itemtype - указывает тип сущности;
  • itemprop - позволяет указать дополнительные свойства. Например, сущность — кинопремьера. В таком случае можно указать название, дату, место проведения.

Помимо Open Graph и Schema.org . существуют и другие, менее популярные словари:

  • FOAF (Friend of a Friend) - словарь основан на идее связей между людьми, вещами, их отношением друг к другу;
  • Data-Vocabulary.org - словарь разрабатывался командой Google до Schema.org. На сегодня разработка данного словаря остановлена, а разработчики Data-Vocabulary.org перешли в Schema.org;
  • Dublin Core - словарь, созданный для библиотечных нужд в далеком 1995 г., имеет набор базовых параметров;
  • Good Relations - словарь, созданный для описания товаров из сферы торговли в интернете, позволяет описывать товар, его цену, место, где его можно приобрести.

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

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

Интернет-магазин

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

Товарные страницы

В Schema.org для разметки товарных страниц используются схемы Product и Offer или AggregateOffer в Schema.org/Product . Информация продуктовых страниц может быть представлена в виде структурированных сниппетов с описанием товара и ценой в выдаче Яндекса.

Для этого необходимо в коде указать поля name, offers, price, pricecurrency и т.д. Например:

Контакты

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

Отзывы

Если на страницах товаров есть отзывы, их также можно разметить при помощи свойства AggregateRating в Product . В результате в выдаче Google в сниппете появится рейтинг и отзывы:

Код выглядит следующим образом:

Картинки

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


Код выглядит следующим образом:


А чтобы пользователи могли лайкать и делиться Вашим контентом в социальных сетях, необходимо установить виджет. Виджет - это небольшой анонс внешней ссылки с изображением и описанием. Для того, чтобы данная информация не искажала исходный материал и корректно отображалась на странице, необходимо использовать словарь микроразметки Open Graph. В коде нужно будет указать заголовок, картинку и описание:

Информационные порталы и СМИ

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

Новостные страницы в большинстве своем используют мультимедийный контент. Поэтому, наиболее часто используемый язык микроразметки Schema.org/Article размечается следующими атрибутами:

  • itemscope itemtype=http://schema.org/WPHeader - указывает на общий контент;
  • itemscope itemtype=http://schema.org/Article - указывает на тело статьи;
  • itemprop=»name» - обозначает заголовок;
  • itemprop=»author» - авторство;
  • itemprop=»datePublished» (Обязательно время в формате «Y-m-d») - дата публикации;
  • itemprop=»articleBody» - текст статьи;
  • itemprop=»articleSection» - рубрика;
  • itemprop=»image» - изображение.

Видеохостинг

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

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

Также, не стоит забывать, что не всегда пользователи ищут фильм конкретно по названию. В поисковую строку они могут вводить имя актёра или режиссёра, к примеру. Поэтому, для того, чтобы сайт показывался в выдаче по данным запросам, необходимо использовать разметку Schema.org/Movie , которая позволит получить структурированный сниппет в Яндексе. Для этого необходимо указать подробные данные о фильме: название, жанр, описание, актеров и т.д.


Коммерческий сайт

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


Для этого, в коде данные необходимо размечать с помощью атрибутов Question и Answer от Schema.org:


Адекватность семантической разметки на страницах сайта можно проверить при помощи Валидатора микроразметки от Яндекса или Google . Они поддерживают все известные форматы микроразметки, в том числе OpenGraph и Schema.org.

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

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

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

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

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

Из часто используемых можно отметить такой стандарт, как Open Graph, позволяющий достаточно просто описать вид статьи или видео для публикации в Facebook (о настройке Open Graph на WordPress вы можете прочесть в статье Прожектора №57 « »).

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

И наибольшего внимания достоин стандарт Schema.org , появившийся благодаря самим поисковым системам: его поддерживают и Google, и Яндекс, он является достаточно удобным и не слишком сложен в освоении. Также, помимо прочего, по нему можно найти довольно много информации в открытых источниках.

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

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

Как это работает? Если сниппет выгодно отличается от других, то он может привлечь к себе больше внимания. Следовательно, ссылку в выдаче чаще открывают, увеличивается CTR и поведенческие факторы (откуда формально могут увеличиться и позиции).

Звучит довольно заманчиво:

Какой из сниппетов более привлекателен, если Вы ищете рецепт торта?

Виды и типы

Ознакомиться со списками поддерживаемых типов полей вы можете в специальных разделах «Справки» Google и «Помощи» Яндекса (и в его списке партнерских программ).

Обе поисковые системы поддерживают микроразметку для таких данных, как:

  • Меню «хлебные крошки».
  • Статьи.
  • Товары.
  • Отзывы.
  • Видео.
  • Программы.
  • Рецепты и др.

Пример сниппета товара с ценой, отзывами и «хлебными крошками» в Google

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

Пример написания микроразметки

Для того чтобы у себя на сайте поместить размеченные данные, вам потребуется либо полностью разобраться в принципе написания разметки, либо воспользоваться специальным сервисом Google под названием «Маркер ».

Поговорим о каждом из вариантов.

Например, на сайте имеется блок с адресом и телефоном организации. Для эксперимента возьмем сайт в ТОПе по запросу «купить телефон »:

Расширенный сниппет с адресом организации

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

Исходный код сайта

Для адресов организаций в schema.org указываются специальные контейнеры, которые обязаны быть в коде и должны быть описаны строго определенным образом.

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

Корпорация ГУРУ:

115280, Москва, ул. Ленинская Слобода, д.19, стр.1

Электронная почта: [email protected]

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

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

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

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

Аналогично можно описать любую схему: для меню «хлебные крошки» можно использовать шаблон из справочной системы Google (исходные коды по ссылке). Ознакомиться с применением кода можно, например, на сайте «Связного ».

Исходный код меню «хлебные крошки»

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

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

Пример использования «Маркера»

Как говорилось выше, создать микроразметку можно и без знания шаблонов с помощью сервиса Google «Маркер ».

Первый шаг — указать адрес страницы и тип необходимых данных:

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

Выбор полей осуществляется мышью:

Выбор полей для разметки мышью

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

Итоговый код

В данном случае все даже проще, чем ранее. Столкнуться со сложностями можно будет, только если страницы сайта не статические, а динамические и создаются посредством кода PHP, например, при написании микроразметки на платформе WordPress. В таком случае необходимо будет править файлы index.php (и, возможно, header.php).

Особенности использования

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

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

Другие примеры, как обычно, остаются на ваше собственное изучение.

Проверка правильности микроразметки

Одним из важнейших шагов перед выкладкой готовой разметки является валидация проверка правильности написания разметки . Выполнить ее можно с помощью специальных сервисов «Валидатор микроразметки » в составе Яндекс.Вебмастера и Testing Tool в составе Google Developers.

Работать с данными сервисами очень просто — копируем в поле ввода код и получаем либо ответ «все хорошо»:

Валидатор от Яндекс

либо предупреждение, где написана ошибка, если вы что-то перепутали в порядке (как я предупреждал ранее):

Итоги

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

В остальном желаю успехов в начинаниях на поприще семантической разметки!



Загрузка...