Хлебные крошки микроразметка пример. Микроразметка хлебных крошек для google. Что такое «хлебные крошки»
«Руководитель проектов команды "Бизнес-Мотор", вебмастер, копирайтер.
Хлебные крошки полезны для пользователей и для поисковиков. Микроразметка легче ориентирует пользователя на сайте и используется поисковиками для формирования расширенного сниппета. Рассказываем, что к чему»
Даже весьма серьезные успехи в части повышения позиций могут быть нивелированы непривлекательными сниппетами с низким CTR. И напротив, интересный, мотивирующий сниппет может выделять сайт среди прочих даже в том случае, если он не находится на первых строках выдачи. Именно по этой причине любые возможности по расширению сниппета можно и нужно использовать максимально. Одна из таких — микроразметка «хлебных крошек», которая позволяет показывать в выдаче рубрику, к которой относится материал, в читабельном и понятном пользователю виде.
Что такое «хлебные крошки»?
«Хлебные крошки» (Breadcrumbs) — это общепринятое название навигационной цепочки, которая отражает путь к данной странице сайта с учетом структуры категорий и подкатегорий. Выглядеть она может примерно следующим образом:
Для пользователя сайта «хлебные крошки» удобны тем, что позволяют быстро вернуться в рубрику или подрубрику, к которой относится материал, а также легко ориентироваться в структуре сайта. Но не менее велико значение навигационной цепочки для SEO, ведь именно ее можно оформить с помощью микроразметки с последующими изменениями в сниппете. О том, как это сделать, — читайте ниже.
Как выглядит расширенный сниппет?
Проиллюстрируем сниппет на примере конкретного сайта до и после применения микроразметки «хлебных крошек». Вот так выглядел типичный сниппет обзора книги в Google ранее:
А вот такая информация появилась в выдаче после того, как микроразметка была внедрена, а страница повторно проиндексировалась поисковой системой:
Как нетрудно заметить, в данном случае явное указание рубрики помогает пользователю быстро оценить жанровую принадлежность книги, а значит — получить больше информации о странице и сделать осмысленный выбор. В случае с интернет-магазинами это также помогает с первого взгляда определить рубрику каталога, к которой отнесен товар. В сочетании с семантическое оформление хлебных крошек позволяет получить максимально полный, насыщенный информацией сниппет товара, который наверняка не останется незамеченным пользователем.
Микроразметка «хлебных крошек» в Google и Яндекс
Стоит отметить, что расширенный сниппет в части навигационной цепочки в Google и Яндекс имеет определенные различия, которые следует учитывать. Так, в частности, если применение микроразметки «хлебных крошек» (при условии отсутствия ошибок) практически наверняка отразятся в выдаче Google, то в Яндексе этого гарантировать нельзя. В Яндекс.Вебмастере по этому поводу приводится следующее пояснение:
Для крупных сайтов, имеющих хорошо выраженную структуру, под сниппетом может показываться навигационная цепочка (ряд ссылок на разделы сайта, к которым относится найденная страница). Такая цепочка позволяет быстро оценить объем информации на сайте или тип контента, и при необходимости за один клик перейти в нужный раздел.
Само собой, оценка «выраженности структуры» остается на усмотрение алгоритмов Яндекса, так что сниппет в выдаче этой поисковой системы может и не измениться, несмотря на внедрение микроразметки.
Интересно и другое наблюдение . В расширенный сниппет Google рубрикация подтягивается в строгом соответствии с навигационной цепочкой, размеченной на сайте. В то же время Яндекс «хлебные крошки» может вообще проигнорировать, а показать структуру согласно url-адреса (даже если в реальной размеченной навигационной цепочке больше или меньше уровней).
При всех особенностях расширенного сниппета для категорий Яндекс обеспечивает и дополнительные бонусы от его использования. Наименования рубрик в его выдаче являются кликабельными, т.е. пользователь может вместо конкретного товара или статьи перейти в интересующую его часть каталога и рубрику.
Как использовать микроразметку навигационной цепочки?
Существует несколько стандартов, которые позволяют выполнить микроразметку навигационной цепочки, и все они в равной степени поддерживаются как Яндексом, так и Google. В их числе — OpenGraph, RDF, Schema.org и microdata. Никаких существенных преимуществ у каждого из них нет, так что можно использовать тот, который понятнее администратору сайта или верстальщику.
В качестве примера приведем микроразметку «хлебных крошек» с помощью RDF-маркеров data-vocabulary.org. Для этого необходимо заключить всю навигационную цепочку в тэг
«Хлебные крошки» (breadcrumbs) помогают пользователям ориентироваться в структуре сайта. Хотя, стоит заметить, что в современном дизайне их встречаешь всё реже и реже. Но сейчас они могут оказаться полезными не только пользователям, но и поисковикам.
Поисковики и сами прекрасно умеют определять структуру сайта. Google, например, может построить «крошки» от главной страницы сайта до целевой страницы из цепочки ссылок и вывести их в сниппете. Но, лучше всего «хлебные крошки» разметить с помощью microdata. В словаре Data-Vocabulary.org есть специальный тип для этого - Breadcrumb .
Формат разметки, возможно, ещё будет меняться. На текущий момент, все объекты типа Breadcrumb неявно связываются между собой. Последовательность в цепочке определяется их последовательностью в документе. Для явного связывания объектов есть поле child . В этом случае объекты должны быть вложены друг в друга (как в моём примере).
Казалось бы, с разметкой хлебных крошек в виде неупорядоченного списка можно было распрощаться. Однако я нашёл способ, как создать требуемую связанную структуру. На помощь приходит свойство itemref .
Технически, получилась точно такая же структура - чётко связанный список «крошек». Осталось только проверить на практике, как к нему отнесётся Google.
Обновление: Гугл нормально связал между собой крошки, через аттрибут itemref .
Всем привет, сегодня мы определим минимальный набор и примеры внедрения микроразметки хлебных крошек, статей и товаров для коммерческих и информационных сайтов. Сама технология уже не нова, но разнообразие её атрибутов может ввести в ступор, а потому в данной статье я постараюсь выделить несколько типичных и проверенных решений, которые можно сразу смело внедрять.
Всю тему микроформатов в одной статье не обхватить, а потому, по мере её рассмотрения в других материалах, я буду ссылаться на них. Кроме того, всегда можно и самостоятельно покопаться в конструкторе микроразметки Google .
Микроразметка хлебных крошек
Ну, это классика жанра, которая в обязательном порядке должна присутствовать на каждом сайте. Например, для страницы она имеет следующий вид:
//1 уровень: главная страница
SEO блог Пинго
//2 уровень: категория
Новичкам
//3 уровень: конечный материал
Типы поисковых запросов
Итак, что мы тут видим? Во-первых, каждый уровень хлебных крошек является обособленным элементом, уровнем, а роль тут играет лишь их порядок. Во-вторых, каждый элемент (за исключением последнего) имеет тройную вложенность:
- Объявление элемента: itemscope itemtype="http://data-vocabulary.org/Breadcrumb"
- Определение значения атрибута ссылки: itemprop="url"
- Определение значения атрибута имени: itemprop="title"
У последнего элемента также может быть атрибут url, но на мой взгляд он не нужен - зачем странице указывать на саму себя в навигационной цепочке?
Атрибуты могут использоваться в связке с любыми тегами - важен лишь порядок и уровень вложенности. Например:
Новичкам
Внедрение на сайт микроразметких хлебных крошек помогает поисковым системам в выводе «читабельных» навигационных цепочек в сниппете (что неплохо ), а также просто лучше понять структуру сайта.
Микроразметка статьи
Данный тип микроразметки предназначен для статей и любых других информационных материалов, как на коммерческих, так и на обычных сайтах. Например, для страницы, которую вы читаете, справедлива следующая структура:
//Объявляем название элемента
//Определение атрибута «Дата публикации»
Конкурентность поисковых запросов
//Определение атрибута «Имя публикации»
Содержимое статьи. //Определение атрибута «Содержимое статьи»
Средняя арифметическая оценка
Максимальное значение оценки
Минимальное значение оценки
Количество оценок
Тут всё тоже самое, что и для хлебных крошек, кроме следующего:
- Атрибут «Дата публикации» должен быть указан в формате ISO-8601 вида YYYY-MM-DDTHH:MM, где T - просто символ, YYYY - год, MM - месяц, DD - дата, HH - час, а MM - минута.
- При определении атрибута «Категория публикации» и «Имя публикации» совершенно не страшно, что в область значения попадает также и ссылка - робот вытянет лишь соответствующие ожидаемому для атрибута значения данные.
Внедрение микроразметки статей помогает поисковому роботу лучше понять и классифицировать содержимое информационного материала. Кроме того, если информация уникальна, то она будет со временем может быть добавлена в базу данных Google .
Микроразмета товара (продукта или услуги)
Данный тип микроформата незаменим для страниц с описанием товаров и услуг:
//Объявляем элемент
Розовый слон
//Определяем наименование товара или услуги
Хороший слон. //Определяем описание товара или услуги
//Объявляем подтип «Предложение»
//Определяем стоимость товара или услуги
//Указываем валюту цены товара или услуги
Средняя арифметическая оценка
Максимальное значение оценки
Минимальное значение оценки
Количество оценок
Тоже самое - поисковый робот сразу видит, что и где располагается на странице и для чего она вообще нужна. Визуальным результатом может стать рост привлекательности сниппета в SERP.
Он может быть обычным, включающим лишь название страницы, ее ссылку и краткое описание, или же расширенным за счет дополнительных элементов: фото, адреса, контактного телефона и т.п. С некоторых пор расширять сниппеты помогают и так называемые хлебные крошки , впервые предложенные поисковой системой Google.
Что такое хлебные крошки?
Хлебные крошки, в основе которых лежит микроразметка от Google, это особый способ дополнении сниппета за счет навигационной цепочки, демонстрирующей место страницы в иерархии сайта. Фактически, хлебные крошки заменяют обычную ссылку в поиске названием разделов и подразделов, в которых находится веб-страница. Поисковик приводит следующий пример:
Как видно, детализация URL-адреса посредством хлебных крошек Arts› Books› Poetr y (рус. – Искусство› Книги› Поэзия ) позволяет точно определить местоположение страницы в структуре веб-ресурса.
Причем здесь «хлеб» и «крошки»?
Все просто. Навигационная цепочка под названием «хлебные крошки» призвана отследить маршрут до конкретной страницы вдоль всей иерархии сайта. Похожим образом герои немецкой сказки «Гензель и Гретель» пытались отыскать путь домой из леса, используя предварительно рассыпанные хлебные крошки по маршруту своего путешествия. Отсюда и необычное словосочетание, которое позаимствовал .
Зачем нужны хлебные крошки?
Использование хлебных крошек может быть обусловлено несколькими причинами:
- расширенный за счет навигационной цепочки сниппет активнее привлекает внимание пользователя поисковой системы, повышая тем самым вероятность его перехода по ссылке;
- наличие хлебных крошек в поисковой выдаче уменьшает время на поиск необходимой информации из-за более осознанной навигации по сайту;
- дополненный навигационной цепочкой сниппет, по мнению отдельных оптимизаторов, повышает релевантность страницы в выдаче Google.
Эти факторы для многих веб-мастеров – веский аргумент в пользу внедрения пресловутых хлебных крошек в поисковую выдачу. О том, как это сделать, читайте в следующем параграфе.
Как самому внедрить хлебные крошки?
Во-первых, настроить хлебные крошки можно «вручную», самостоятельно внеся необходимые изменения в код сайта. Этот вариант предполагает использование микроразметки от Google, а именно: микроданных или RDFa. В случае с разметкой через микроданные код навигационной цепочки может выглядеть так:
- " . JText::_("MOD_BREADCRUMBS_HERE") . " ";
- ";
- "; if (!empty($item->link)) { echo "link . "">" . $item->name . ""; } else { echo "" . $item->name . ""; } if (($key != $penult_item_key) || $show_last) { echo "" . $separator . ""; } echo " ";
-
"; if (!empty($item->link)) { echo "link . "">" . $item->name . ""; } else { echo "" . $item->name . "
Микроразметка (Microdata) является стандартом семантической оптимизации и широко внедряется на сайты, поскольку позволяет увеличить CTR показатели страниц и положительно влияет на поисковую оптимизацию в целом. В данной статье мы рассмотрим пример внедрения микроразметки в стандартный модуль mod_breadcbrumbs , который в русском пакете локализации Joomla называется "Навигатор сайта". Внедрение микро-раметки размечает хлебные крошки и в поисковой выдаче визуально это выглядит так:
Добавление микро-раметки позволяет пользователю видеть в поисковой выдаче иерархическую структуру страницы и перейти на другие уровни из цепочки навигации. Например, структура размеченной статьи в выдаче будет такой: “What We Do” > “Joomla” . Соответственно, это позволит юзеру по клику вернуться на уровень категории “Joomla” или в категорию “What We Do”.
Для того, чтобы добавить микроразметку в модуль хлебных крошек, нам потребуется изменить всего 4 строчки кода. Прибегнем к излюбленному методу - переопределению разметки модуля на уровне шаблона сайта.
Ниже статьи прилагается файл с переопределением. Скачайте его и положите в папку:
Внимание! В вашем шаблоне уже может быть переопределен модуль mod_breadcrumb, если это так, то необходимо работать именно с ним
/templates/<название_вашего_шаблона>/html/
Файл default.php должен находится в папке mod_breadcrumbs , если таковой в директории html шаблона нет, следует ее создать.
В результате, должна получиться такая цепочка:
/templates/<название_вашего_шаблона>/html/mod_breadcrumbs/default.php
Для тех, кому интересно, можете внести изменения вручную:
В оригинальном файле default.php модуля mod_breadcrumbs найдите строчку:
Echo "
И замените ее на:
Echo "
найдите строки:
и замените их на:
// Render all but last item - along with separator echo "