Что такое и зачем нужна микроразметка
Микроразметка – образец семантической оптимизации. Он был представлен зарубежными поисковиками Google, Bing и Yahoo еще летом 2011 года. Осенью к поддержке этого стандрта присоединился Яндекс. Микроразметка дает возможность поисковым роботам правильнее определять и структурировать информацию со страниц сайтов. Микроразметку использует лишь 1 сайт из 10 , а ведь она так выручает.
Микроразметка реализуется добавлением в HTML-код страницы специальных тегов.
Различают такие виды разметки, как:
- Микроформаты
- Микроданные
- RDF
Рассмотрим каждую из них:
Микроданные
Способ разметки (актуальный в HTML5), который обрисовывает специальные данные. Скажем, данная разметка возможно будет содержать отзывы, информацию о дате и времени мероприятия, человеке и т.д. Микроданные используют тривиальные атрибуты HTML-тегов (<div>, <span>).
Микроформаты
Служат для описания типа информации на указанной странице. Каждая страница имеет отдельные свойства. К примеру сказать, если мы очерчиваем мероприятие, то его свойствами будет место, дата, время проведения и т.д. Микроформаты подразумевают применение атрибута class в таких тегах, как <div> и <span>.
RDF
Ещё один и последний способ разметки. Работает по той же схеме, что и вышеизложенные. Важнейшее преимущество – расширенные возможности.
Специалисты Google и Yandex рекомендуют использовать для разметки метод микроданных .Данный метод совмещает в себе простоту и широкие возможности.
О пользе микроразметки
Микроразметка показывает поисковым роботам именно ту информацию, которую следует обрабатывать. Это дает возможность добиться большей релевантности .
В первую очередь присутствие микроформата или микроданных на странице отражается на сниппете (описании), который аккомпанирует ссылку на сайт в поисковой выдаче. Сниппет заключает в себе более полное описание страницы, основные разделы сайта, ценовой диапазон товаров, фотографии адреса, номера телефонов и так далее.
Примеры использования:
Так выглядит сниппет страницы без использования микроразметки:
А так с использованием микроразметки:
Разница налицо. Грамотный сниппет способен привлечь качественный поисковый трафик. С помощью подобного сниппета пользователь понимает, интересна ли эта страница? и несет ли она в себе смысл?
А вот и несколько примеров оформления кода:
Как правильно оформлять заголовки?
Заголовок на странице должен быть один и оформлен в тег
<h1>Заголовок сnраницы</h1> |
Чтобы разметить этот заголовок с помощью микроразметки, надо прописать следующее:
<div itemtype="http://schema.org/Product"> <h1 itemprop="name">Заголовок</h1> </div> |
Добавление хлебных крошек в сниппет
Хлебные крошки в выдаче добавляют еще больше ссылок на сайт:
Как оформить хлебные крошки для сайта
Для того, чтобы сделать отображение сайта таким, необходимо использовать схему: http://www.data-vocabulary.org/Breadcrumb/
И у каждой ссылки на раздел прописать следующее:
<div itemtype="http://www.data-vocabulary.org/Breadcrumb/"> <a href="/ссылка на страницу" itemprop="url"> <span itemprop="title">названиессылки</span> </a> </div> |
Оформление отзывов и звездочек ★★★★★
В последнее время все чаще и чаще можно заметить в поисковике сайты, которые отображаются со звезодчками/количествами отзывов:
Оформление звездочек в выдаче сайта
Для этого необходимо там, где у нас есть отзывы прописать следующее:
<div class="review" itemprop="aggregateRating" itemscope="" itemtype="http://schema.org/AggregateRating"> <meta itemprop="reviewCount" content="Отзывов: 1"> <meta itemprop="ratingValue" content="5"> <div> |
Микроразметка цены и наличие товара на сайте
Для того, чтобы в выдаче поисковика отображалась цена товара и ее наличие необходимо прописать следующее:
<div itemtype="http://schema.org/Offer"> <div itemtype=" http://schema.org/ItemAvailability"> <meta itemprop="price" content=»450 р."> <meta itemprop="priceCurrency" content="RUB"> <link itemprop="availability" href="http://schema.org/InStock"> Цена: 450 р. <br> </div> </div> |
Описание товара для сайт, description
Для того, чтобы описать какой-либо товар, необходимо использовать следующий код:
<div itemtype="http://schema.org/Product"> <p itemprop="description">Описание товара</p> </div> |
В результате всего вы получите следующее отображение сайта в выдаче:
Проверка микроразметки
Для того, чтобы проверить правильность микроразетки, необходимо проверить сайт в следующих системах:
Видео о пользе семантической микроразметки сайта от Яндекс:
Что такое Schema.org?
Schema.org – набор словарей, используемых для описания объектов и сущностей на страницах сайтов. Данный стандарт использует микроданные.
В стандарте Schema.org есть около 550 классов, и с каждым днем их число растет. Отдельные классы поддерживаются сервисами Яндекса.
Влияние микроразметки на ранжирование
В Яндексе
Разметка делает ресурс более зримым для юзера в поисковой выдаче. Яндекс поощряет микроразметку и , значит , это помогает ранжированию .
В Гугле
По данным на октябрь 2013 года, Гугл не использует микроразметку для повышения позиций сайтов.
Заключение
Микроразметка – очень надёжный инструмент, дающий возможность сделать ресурс более структурированным и клиент ориентированным.