Собственно говоря, HTML так и называется «гипертекстовый язык разметки». Его можно назвать языком «макроразметки» - разметки контента всего содержимого web-страницы.
Свои требования к разметке предъявляют и поисковые системы (среди них решающее значение имеют только две – Яндекс и Google). Среди требований – такая организация содержимого, чтобы она облегчала анализ страницы. Важнейшим фактором становится временной параметр анализа – чем строже будет организовано содержимое, тем точнее и быстрее робот проводит свою работу, тем успешнее продвижение сайта по результатам работы поисковика.
Все требования подобного рода и собраны в, так называемую, «микроразметку» сайта.
Для пользователя следствием удачного применения микроразметки является более удобный характер представления результатов поиска. Сравните два возможных варианта сниппета после поиска Яндекса:
- A – здесь микроразметка не использовалась;
- B – в этом случае, наоборот, микроразметка применена очень активно.
Для осуществления разметки используются специальные атрибуты в рамках HTML-кода. Вся необходимая информация собирается в одном htm-файле без привлечения внешних ресурсов. Приводим пример микроразметки, предлагаемой Google (здесь тема сайта «Картинки»):
<meta property="og:image" content="http://example.com/rock.jpg" />
<meta property="og:image:width" content="300" />
<meta property="og:image:height" content="300" />
<meta property="og:image" content="http://example.com/rock2.jpg" />
<meta property="og:image" content="http://example.com/rock3.jpg" />
<meta property="og:image:height" content="1000" />
Яндекс использует несколько отличную от Гугл систему микроразметки:
<div itemscope itemtype="http://schema.org/Organization">
<span itemprop="name">Название организации</span>
Контакты:
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
Адрес:
<span itemprop="streetAddress">Александра Пушкина, 114</span>
<span itemprop="postalCode">746228</span>
<span itemprop="addressLocality">Владивосток</span>,
</div>
Телефон:<span itemprop="telephone">+7 999 777–77–77</span>,
Факс:<span itemprop="faxNumber">+7 999 111–11–11</span>,
Электронная почта: <span itemprop="email">myorg@list.ru</span>
</div>
Сравните тот же самый код страницы, но уже без микроразметки:
<div>
<span>Название организации</span>
Контакты:
<div>
Адрес: Александра Пушкина, 114,
746228,
Владивосток,
</div>
Телефон: +7 999 777-77-77,
Факс: +7 999 111-11-11,
Электронная почта: myorg@list.ru
</div>
На весну 2017-го действуют следующие 5 форматов микроразметки:
- Schema.org – совместная разработка Гугл, Yahoo и Microsoft, к которой со временем примкнула и Яндекс;
- OpenGraph – разработка компании Facebook, которой придерживаются все её разработки и разработки тесно сотрудничающих с Facebook её партнёров;
- микроформаты – целая серия форматов, описывающих различные тематические направления web-страниц, от кулинарных рецептов до социальных взаимоотношений;
- RDF - Resource Description Framework («среда описания ресурса») – разработка консорциума W3C, носящая глобальный характер среды описания данных. В настоящий момент действует 3 версия (1.1) данного формата. Его полное описание доступно на http://www.w3.org/TR/2015/REC-rdfa-core-20150317/;
- микроданные (microdata) – ещё одна разработка W3C, полное описание на https://www.w3.org/TR/2017/WD-microdata-20170504/.
Заметим, все форматы находятся в постоянном развитии, и пока специальная разметка разработана не для всех сфер применения web-страниц.
Таким образом, основное назначение микроразметки – передача данных о содержимом сайта. Исходя из этих данных, поисковики создают сниппеты в результатах поиска, а также проводят индексацию сайта для целей других служб.
Механизм применения микроразметки продемонстрируем на примере формата Schema.org. Этот механизм состоит из трёх шагов:
- Описание заключается в контейнер – ему присваивается имя и тип:
<div itemscope itemtype="http://schema.org/Organization" >
...
</div>
- Внутри контейнера происходит описание конкретного свойства.
- Вне контейнера в конкретных точках применения происходит разметка информации со ссылкой на конкретное свойство схемы:
<span itemprop="streetAddress">Александра Пушкина, 114</span>
Что интересно, унифицированного алгоритма обработки получаемых данных не существует, всё зависит от конкретной темы сайта. На весну 2017-го микроразметке и, соответственно, обработке подлежат 11 тем, среди которых: видео, вопросы и ответы, картинки, кулинарные рецепты, компьютерные программы, товары и цены.
Так как объём информации по каждой теме довольно широк, возникает необходимость её проверки на соответствие стандартам.
Оба сервиса, и Яндекс, и Google, имеют специальные валидаторы, так называемой, микроразметки сайта. Микроразметка и отвечает за компоновку на сайте информации для поисковых роботов.
Проверка в Яндексе
Для начала стоит сказать, что валидаторов разметки в сети разработано несколько, но самым предпочтительным для использования является именно валидатор Яндекса, как системы, держащей все нити управления в своих руках. Ведь именно Яндекс (наряду с Google) в значительной степени пока и определяет политику работы всех поисковых систем мира.
Валидация микроразметки относится сугубо к специальным, профессиональным, областям анализа, поэтому выполняется по адресу подсистемы Яндекса «Для Вебмастеров»:
https://webmaster.yandex.ru/tools/microtest/
Входим на страницу и перед нами вся необходимая информация для проведения работы:
Теперь, в многостраничном поле ввода под двухцветным заголовком «URL документа или вставьте фрагмент HTML-кода» размещаем адрес проверяемой страницы.
Тут возникает только одна проблема – страница должна содержать эту самую микроразметку. Если микроразметки нет, то под заголовком «Результат проверки» просто показывается сообщение, что разметка на странице не обнаружена. Как показывает практика, тыкать пальцем в небо и проверять совершенно незнакомый сайт на микроразметку бесполезно, её на сайте не будет.
Запуск проверки проводится кнопкой «Проверить» или комбинацией горячих клавиш Ctrl + Enter.
Если разметка на сайте используется, то результат проверки будет отражён в многостраничном поле ниже:
Если вы просто ввели HTML-код страницы, то результат работы будет представлен адресом локального хоста:
Мы сейчас не говорим, как следует интерпретировать полученную информацию – понятное дело, это уже тема другого разговора и при достаточной SEO-подготовке.
Если у вас возникают вопросы по поводу сервиса валидации микроразметки Яндекса, то можно обратиться к страницам помощи, которые служба размещает по адресу:
https://yandex.ru/support/webmaster/yandex-indexing/validator.xml
Страница при этом будет иметь вид:
Валидатор Яндекса кроме полной проверки пяти перечисленных форматов микроразметки, проверят также формат специально размеченных данных и специальные сниппеты, но эти два, пока в ограниченном объёме.
Валидатор предусматривает шесть результатов своей работы, касающиеся обнаруженных ошибок анализа:
- Страница не может быть загружена для анализа;
- Микроразметка не обнаружена – может произойти по двум причинам – или разметки действительно нет, или она неверно оформлена;
- Отсутствие необходимого поля – это уже элемент именно проверки, например, при описании картинки не указан её адрес;
- Невозможно определить чему принадлежат некоторые поля – обычно они выходят за свою разметку;
- Не выполнены условия организации сниппетов;
- В свойстве “content” meta-тега находится ссылка, что недопустимо.
Кроме того, в окне результатов могут появляться три предупреждения:
- Некорректное значение поля – например, некорректный формат даты;
- Неверно задан тип данных – обращаем внимание, что наряду со стандартными типами, определёнными W3C, Яндекс определяет и некоторые свои типы;
- Отсутствие разметки, которая должна использоваться вместе с используемой.
Как результат успешно проведённой Яндексом валидации – в результатах поиска Яндекса страница будет представлена структурированным сниппетом. Это обычно происходит через 10-14 дней.
Проверка в Google
Аналогичным образом проводится валидация микроразметки в Google. Адрес данного ресурса :
https://developers.google.com/structured-data/testing-tool/
Схема расстановки микроразметки, на которую ориентируется Google, называется Schema.org. Во многом идея работы «американца» ничем не отличается от работы российского варианта валидации.
Начинается всё со страницы следующего вида:
Как видим, здесь тоже есть возможность ввести адрес проверяемой страницы или непосредственно html-код.
Запуск проверки производится кнопкой «Запустить тест». Несмотря на то, что оба валидатора работают по одной схеме Schema.org, результаты их работы несколько отличаются. Вот результат работы Google:
Практика показывает, что валидатор Google предъявляет менее строгие требования к разметке и находит меньше ошибок. Более того, Гугл не информирует владельца сайта, через какой промежуток времени разметка вступит в силу и будет видна в результатах поиска.
Общей рекомендацией использования сервисов валидации Яндекса и Гугл может быть следующая: необходимо, по возможности, использовать оба и на основе такой двойной проверки уже и делать выводы.