SEO, словарь и синтаксис: поговорим о микроразметке

SEO

23 мая 2017

SEO, словарь и синтаксис: поговорим о микроразметке

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

Но не стоит торопиться. Для начала важно определить, с чем мы имеем дело.

Микроразметка и правила её внедрения

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

К примеру, на странице «О нас» или «Контактные данные» необходимо при помощи микроразметки выделить блок с контактами – в этом случае робот покажет необходимую страницу при запросе «контакты компании Х».

При помощи валидатора микроразметки от Яндекса можно с легкостью проверить корректность ее написания:

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

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

Словари микроразметки

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

Работа с Schema.org

Schema.org прежде всего необходим для формирования расширенного сниппета и увеличения релевантности страницы.

Вот пример результатов поиска:

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

itemscope — описание каждого отдельного блока, возможность описания информации на уровне сущности;
itemtype — указание типа сущности;
itemprop — возможность указания дополнительных свойств. К примеру, сущности – театральное событие. При этом можно указать дату, место и название события:

<span itemprop="name">Viva Штраус</span>

</div>

<span itemprop="startDate" content="2016-25-12T19:00">Sun 25 December 2016 19:00</span>

</div>

Микроформаты: с чем мы имеем дело?

Микроформатами (microformats.org) называют небольшие HTML-шаблоны, что помогают давать характеристику людям, текстам и событиям. Они включают в себя и словарь, и синтаксис.

Пример разметки контактов:

<a class="p-name u-url" href="http://one.org">Иван Петров</a>

<a class="u-email" href="mailto:ivan_petrov@gmail.com">ivan_petrov@gmail.com</a>,

<span class="p-street-address">Ярослава Мудрого, 15</span>

<span class="p-locality">Харьков</span>

<span class="p-country-name">Украина</span>

</p>

Яндекс способен отличать несколько форматов:

hCard — нужен для разметки контактов – адреса, телефона и других личных данных.
hRecipe — необходим для разметки кулинарных рецептов. Можно указать состав блюда, фото, число порций.
hReview — важен для разметки на страницах отзывов. Размечается текст отзыва, оценка, плюсы и минусы продукта и дата.

Google может определять множество микроформатов в дополнение к названным ранее:

hProduct и GoodRelations — разметка товара на сайте.
hCalendar — разметка мероприятий. Дата, окончание и место проведения.

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

В microformats.org для разметки работают с html-тегами.

Например:

<strong class="fn">Юрий Гагарин</strong>

<span class="title">Летчик-космонавт</span>

<span class="org">Военно-воздушные силы СССР</span>

<a class="url" href=http://example.com/Гагарин>Страница Ю.Гагарина</a>

<span class="value-title" title="1934-03-09">9 марта 1934</span>

</div>

<span class="note">Первый человек в космосе</span>

<span class="locality">Байконур</span>

<span class="country-name">Казахстан</span>

</span>

</div>

Работа с Open Graph

Open Graph – так называется словарь, который создан Facebook. Он необходим для того, чтоб каждый сайт мог корректно отображаться в соцсети. При помощи элементов этого словаря есть возможность размещения только одного объекта – человека, продукта или компании.

Вот ряд обязательных тегов:

og:title — имя объекта.
og:type — тип объекта. Если на странице находится не один объект – следует выбрать главный из них и указать его тип. og:image — URL картинки.
og:url — канонический URL, что будет добавляться в Фейсбук.

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

og:audio — ссылка на аудиозапись, которая касается объекта описания.
og:description — краткое описание.
og:locale — язык и страна, что указываются в формате язык_страна. По умолчанию стоит значение en_US.
og:locale:alternate — альтернативные языки. На них доступно описание объекта. og:site_name — имя сайта (его название).
og:video — ссылка на видео, что имеет отношение к объекту описания.

FOAF

FOAF (Friend of a Friend) занимается описанием человека и связи между людьми. При помощи данного словаря вы узнаете степень близости людей. Он использует поиск Яндекса по блогам и позволяет по максимуму в подробностях описать блоги людей.

Dublin Core

Dublin Core. Используя его, можно работать в библиотеках и музеях.

Например:

Data Vocabulary

Data Vocabulary ранее активно разрабатывал Гугл, но на данный момент он полностью объединен с Schema.org.

Популярная микроразметка «хлебные крошки» - это именно из этого словаря. Например:

<span itemprop="title">Netpeak</span>

</a>

</a>

</span>

</div>

Good Relations – для чего необходим?

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

Вот какой может быть микроразметка:

<div itemscope itemtype="http://purl.org/goodrelations/v1#Individual"

itemid="#product">

Weight: <link itemprop="weight" href="#weight">

</div>

<div itemprop="weight" itemscope

itemtype="http://purl.org/goodrelations/v1#QuantitativeValue" itemid="#weight">

<span itemprop="hasValue">50</span> kg

</div>

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

Синтаксис – это способ работы со словарем. Он дает понять, как именно будут указываться элементы словаря на странице. Нет одного-единственного стандарта в этом вопросе.

Микроданные (microdata) включают ряд основных элементов:

itemscope – указывает на то, что тег содержит в себе информацию описания объекта. itemtype – ссылка на тип объекта. itemprop – основные свойства объекта.

Обычно размечается информация, что уже находится на странице, которую видит пользователь. А когда пользователю нужен понятный формат, а в разметке нужно указать нужные роботам данные – работайте с информацией в атрибуте content любого тега. Или же по рекомендации Яндекса <meta>.

Например:

<span itemprop="name">Чехол для Iphone</span>

Основан на <span itemprop="ratingCount">25</span> голосах пользователей

</div>

RDFa и RDFa Lite - с ними работают нечасто по причине их общей сложности. Описывают объекты, события и людей.

Например:

<h1 property="description">January 2015 Visa</h1>

<a property="url" href="http://acmebank.com/invoice.pdf">Invoice PDF</a>

</div>

</div>

</div>

</div>

</div>

JSON-LD. Занимается описанием объектов на странице сайта при помощи словаря связанных данных. Оформляется разметка в формате «ключ - значение». Данный синтаксис определяет пространство ключей, что зарезервированы.

К примеру:

{

"name": "Manu Sporny",

"homepage": "http://manu.sporny.org/",

"image": "http://manu.sporny.org/images/manu.png"

}

Объект JSON — набор пар «ключ – значение», что указаны в формате: {"title":"Конференция","date":"2014-11-30T12:00:00.000Z"}. Имена ключей единого объекта не должны повторяться. мена ключей одного объекта не должны дублироваться.

Типы данных:

массив — набор значений. Указан в формате [0, 1, 2, 3];
строка — набор символов Unicode, указаны в двойных кавычках: "Имя";
число — обычные числа, но нельзя ставить 0 перед числом: [01];
true и false — бинарные данные;
null — отсутствие значения. Нередко используют для очищения данных.

Итоги

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

Далее нужно распределить общие блоки микроразметки.

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

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

Успехов!