Posted on By seodiz_baza_

Красивый сниппет навигации breadcrumbs на RDFa в результатах поиска Google

breadcrumb для сайта

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

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

К сожалению в микроформате (самом легком варианте создания сниппетов) этот сниппет создать нельзя, поэтому мы будем использовать другой, по моему мнению не очень сложный вариант разметки в формате RDFa.

Создание сниппета breadcrumbs на RDFa с отображением хлебных крошек

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

<div xmlns:v="http://rdf.data-vocabulary.org/#">
<span typeof="v:Breadcrumb">
<a href="http://site.ru/first-category" rel="v:url" property="v:title">Первая категория для сниппета</a> ›
</span>
<span typeof="v:Breadcrumb">
<a href="http://site.ru/second-category" rel="v:url" property="v:title">Вторая категория для сниппета</a> ›
</span>
</div>

Конечно валидатор будет ругаться на такой код, вставленный в документ не поддерживающий этот тип разметки. Но это не страшные ошибки и они ни на что не влияют. А для того, чтобы сделать страницы сайта соответствующими стандарту W3C, нужно изменить доктайп страницы (doctype) и версию html кода на RDFa:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
<html version="XHTML+RDFa 1.0" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="http://rdf.data-vocabulary.org/#">

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

Создание красивого сниппета breadcrumbs в поиске Google на RDFa без хлебных крошек

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

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="http://rdf.data-vocabulary.org/#">

Теперь вся ваша страница будет поддерживать формат RDFa, и вы сможете добавить RDFa разметку вашим категориям прямо в том месте где они выводятся на странице в соответствии с ее дизайном, изменив html код каждой категории по следующему образцу:

<span typeof="v:Breadcrumb">
<a href="http://site.ru/category" rel="v:url" property="v:title">Категория для сниппета без хлебных крошек</a>
</span>

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

Читайте также: сниппеты навигация rdfa