Добавете микроданни към модула за навигационни пътеки (mod_breadcrumbs). „Глебни пътеки“: микромаркиране и неговото въздействие върху фрагментите на страницата Микромаркиране на навигационните пътеки schema org

Добавете микроданни към модула за навигационни пътеки (mod_breadcrumbs). „Глебни пътеки“: микромаркиране и неговото въздействие върху фрагментите на страницата Микромаркиране на навигационните пътеки schema org

Поздрави приятели. Днес е 400-годишнината на моя блог. По случай такава дата много ми се искаше да дам наистина полезно съдържание, за да бъде интересно, полезно и актуално. И темата за такава статия се появи неочаквано - исках да разбера формирането на красиви фрагменти при търсене, но в същото време се зарових в още две теми:

  • инсталиране на галета във вашия WordPress блог (исках го без плъгин, за да не зареждам сайта),
  • и настройка на микро маркиране (без него трохите за хляб са малко полезни).
Навигационен елемент

Чувал съм и съм чел за галета от дълго време, но просто не можех да разбера каква е ползата от тях за обикновен блог с проста и разбираема структура. Преценете сами, имам главна страница, всички публикации са разделени на категории и това е всичко. Тоест максималният път от началната страница до крайната статия е 2 клика. Всяка статия има връзка към категорията, към която принадлежи, така че посетителят просто няма къде да се изгуби.

Друг е въпросът, ако сайтът е сложен и структурата му е такава, че можете да се въртите в кръг половин час и да не намерите това, което търсите. Ако имате някакъв вид онлайн магазин с десетки категории, всяка от които е разделена на дъщерни заглавия, тези на свой ред и след това още един, а след това всеки продукт е разделен на цветове - тук разбирам важността на трохите за хляб - потребителят се нуждае от тях като елемент за навигация и .

Между другото, името „галета“ идва от това; първоначално това беше просто навигация в сайта. Спомнете си приказката „Хензел и Гретел“, където децата хвърляха парчета хляб по пътя си, за да могат по-късно да намерят пътя обратно. В приказката този метод не им помогна много, но за уебсайтовете беше полезен.

Поява на фрагмента в резултатите от търсенето

И така, не виждах смисъл в такава притурка за моя блог, докато не попаднах на второто значение на трохите - оказва се, че те се виждат не само от хората, но и от търсачките. И търсачките ги виждат не само като вътрешни връзки, които влияят на свързването и разпределението на теглото на страницата, но и като важен навигационен елемент. Yandex и Google използват този елемент за създаване на фрагмент. Не искам да ви разказвам дълго как изглежда, по-добре е да го видите веднъж със собствените си очи:

Фрагментът е показване на сайт в резултатите от търсенето.

Колкото по-привлекателен е фрагментът, толкова по-висока е неговата честота на кликване, което веднага дава двоен ефект:

  • Повече кликвания означават повече трафик към сайта,
  • Честотата на кликване на фрагмент се отнася до поведенчески фактори и колкото по-висока е тя, толкова по-лесно е ресурсът да се изкачи до ТОП за необходимите заявки.

Единственото нещо, което не ми стана ясно е, че тези връзки са breadcrumbs, а не нещо друго. Съгласете се, страницата от всяка статия в блога съдържа други връзки към категорията и към главната страница (горно меню, категории в страничната лента, връзка към категорията в блока с метаданни на статията).

Не е човек, той не може да погледне страницата и да разбере - тази връзка е от менюто, това е от текста на статията, а това е трохи за хляб.

Трябваше да прелиствам форуми и да чета много блогове. В повечето случаи те пишат само за факта, че са необходими трохи и те подобряват използваемостта и фрагмента, а след това пишат инструкции за настройка на приставката Breadcrumb NavXT (Breadcrumb е трохи от хляб на английски) или предоставят код за внедряване без приставка - и това е всичко. Имам впечатлението, че повечето уебмастъри нямат представа как правилно да работят с този елемент и го възприемат само като елемент от вътрешната връзка към страницата.

Резултатите на Google показват, че не повече от 10% от сайтовете имат правилните навигационни точки в своя арсенал, останалите работят по старомодния начин, показвайки URL адреса на страницата във фрагмента.

Микро маркиране на галета

Не бях твърде мързелив, влязох в търсенето, анализирах как е направен Breadcrumb на различни сайтове и как тези сайтове изглеждат при търсене. Моята теория се оказа вярна:

  • Има трохи на сайта - без микро маркиране - обикновен фрагмент с URL.
  • Има трохи - има микро маркиране - подобрен фрагмент.

Изрових всичко, от което се нуждаех, и днес ще ви разкажа за хлебните трохи от А до Я. Технически, поставянето им на сайта не е дори половината от битката – това са 10%. Основната функция, която ще донесе реални ползи, е микро маркирането.

Основната полза не е в навигационните трохи, а в правилното им микромаркиране за фрагмента.

Запознах се с микромаркирането като концепция само преди няколко месеца. Тогава не разбирах много, но се опитах да настроя основните елементи за статии и коментари. Някои блогъри писаха, че това е почти магически бутон, който избутва сайтове към ТОП (предимно ученици от училището за блогъри на Александър Борисов) - не знам защо са решили така. Това веднага ми се стори съмнително, но сега мога да кажа със сигурност - за 2 месеца, в които имах микромаркиране на моя сайт, не забелязах забележими движения в резултатите от търсенето за популяризирани заявки.

В случай на маркиране на галета, ситуацията трябва да е различна; няма да чакаме никакви движения в органичните резултати от търсенето, но ще разчитаме на това, което казах по-горе - подобрение в кликаемостта на фрагментите и съответните кифли (растеж поради поведенчески фактори).

Breadcrumbs на WordPress без плъгин

Така че преминахме от разговори „защо и за какво“ към разговори „как да го направя“. Веднага изхвърлих плъгина Breadcrumb NavXT, тъй като няма смисъл да се „изисква модификация с файл“ и той сам не знае как да прави микромаркиране. Има и друг вариант - WordPress SEO плъгин SEO на Yoast, той също може да прави breadcrumbs, но нямам желание да го сменям. Единствената останала опция е да използвате скрипт или функция.

Ако решите да инсталирате breadcrumbs на WordPress, направете го без плъгини - сайтът ще бъде по-малко натоварен и ще има повече възможности за адаптиране на кода.

Стъпка 1. Функция wp_zhilin_krohi

Тъй като току-що започнах да изучавам основите на PHP, започнах да се интересувам сам да направя функция, която да показва навигационни трохи в моя блог. Интуитивно видях, че не би трябвало да има проблеми, тъй като всички елементи на трохите вече са показани в шаблона, просто трябва да ги вземете и да подредите необходимите връзки според очакванията.

Гледайки напред, ще кажа, че успях да създам най-компактната (четете лека и бърза) функция, която някога съм намирал на други сайтове.

Първата версия на кода се оказа бързо, но не взех предвид една точка - кодът трябва не само да показва връзки към сайта, но и да съдържа микромаркиране, но имаше засада с него - кодът ми се повтори грешките на много уебмастъри - поради изпълнението на стандартния изход, разпространението на връзки към елементи за вграждане на маркиране не работи.

Трябваше да започна отначало, разчитайки на по-прости PHP функции на WordPress (но научих нещо ново). В резултат на това резултатът беше функцията wp_zhilin_krohi (за първи път нарекох функция със собственото си име - хубаво), която показва галета на страници със статии и на страници с категории. Всички родителски категории (без значение колко са) се вземат предвид автоматично и всеки елемент е обвит в микро маркиране.

За статиите трохите изглеждат така:

Начало > Родителско заглавие (ако има такова) > Категория > Статия

Начало > Родителска категория (ако има такава) > Категория >

Имам опасения, че заглавието на статията в breadcrumbs ще доведе до спам на страницата с ключови думи. Направих запитване за това до техническата поддръжка на Yandex, в отговор те написаха, че ако това не е насочено към измама на търсачките, тогава не трябва да има санкции, но те се вземат предвид. Ето отговора:

Така че, ако смятате, че ненужното повторение на заглавието на статията ще ви притесни, изтрийте редове от 17 до 20.

Ето и самата функция, трябва да я добавите към файла functions.php на вашата тема, преди затварящата?> (това става директно през админ панела, дори не ви трябва FTP клиент):

/*** Трохи с микро маркиране ***/ функция wp_zhilin_krohi() ( if (!is_home()) ( echo "Home" "; ) if (is_category() || is_single()) ( $cats = get_the_category() ; foreach ($cats като $cat) ( echo "term_id)." >" .$cat->name." " " ) ) if(is_single()) ( the_title(); ));

Микро маркирането незабавно се запича във функционалния код и автоматично се показва заедно с всяка връзка.

Стъпка 2. Показване на функцията на страници

За да може веригата от връзки, които създадохме, да се появи на страниците, трябва да отворите вашия WordPress тематичен файл, който отговаря за съответния тип страница, и да вмъкнете в него кода, който извиква функцията:

Като минимум се нуждаете от файл single.php (показва публикации) - почти винаги се нарича по един и същи начин и след това зависи от шаблона, някъде страниците с категории се показват чрез archive.php, някъде през index.php - ще намерите такъв, от който се нуждаете.

В този файл трябва да намерите мястото, където искате да видите трохите. Обикновено се поставят в горната част на сайта (преди заглавието на публикацията) като елемент за навигация. Потърсете тази част от кода - php the_title, и вмъкнете изхода на функцията пред него (вижте дизайна, където пасва).

Breadcrumb не винаги се поставя в горната част на страницата; има изключения. Да кажем, че ви трябват само за показване на фрагмент, след което можете да ги поставите в мазето - търсачките ще видят микро маркирането там. Тази опция е приложена в блога на Сергей Сосновски - той има отделен блок в горната част за потребителите, но няма микромаркиране, а галета с микромаркиране се показват в долния колонтитул (не разбирам защо, но ):

Стъпка 3. Дизайн

Външният вид на всеки елемент от страницата трябва да е в хармония с дизайна на вашия сайт, следователно няма едно решение за всеки блог.

Настроих същото на моите ресурси - намалих шрифта на галета в сравнение с основното съдържание. За да направя това, дори не създадох отделни стилове във файла style.css, а затворих функцията в контейнер div и посочих един единствен параметър в него - размера на шрифта (може да сте забелязали на екранната снимка по-горе):

Всички други характеристики на навигацията са наследени от стиловете на темата. За да направите малки допълнения (промяна на шрифта, цвета на текста и т.н.), посочете необходимите свойства в същия контейнер.

Ако искате радикално да промените дизайна на показаната верига от връзки (направете няколко снимки или бутони), след това им задайте специален клас, например така - след това за този клас създайте отделен блок в style.css и посочете всички необходими параметри.

Това е мястото, където вашите познания за CSS каскадни стилови таблици и усет към дизайна ще ви бъдат полезни (ако правите дизайна сами).

Проверка на микро маркиране на галета

След като направите всичко, не забравяйте да проверите правилната работа на микромаркирането в специални валидатори на Yandex и Google, никога не се знае, ще изскочат някои грешки:

webmaster.yandex.ru/microtest.xmldevelopers.google.com/structured-data/testing-tool/ (45 гласа, средно: 4,7 от 5)

Здравейте всички, днес ще дефинираме минималния набор и примери за внедряване на микромаркиране на галета, статии и продукти за търговски и информационни сайтове. Самата технология вече не е нова, но разнообразието от нейните атрибути може да бъде объркващо и затова в тази статия ще се опитам да подчертая няколко типични и доказани решения, които могат безопасно да бъдат внедрени веднага.

Цялата тема за микроформатите не може да бъде разгледана в една статия и затова, тъй като се обсъжда в други материали, ще се позова на тях. Освен това винаги можете да се задълбочите в Създател на микромаркиране на Google.

Микро маркиране на галета

Е, това е класика в жанра, която задължително присъства във всеки сайт. Например за страница изглежда така:

//1во ниво: главна страница

SEO блог Pingo

//ниво 2: категория

За начинаещи

//ниво 3: окончателен материал
Видове заявки за търсене

И така, какво виждаме тук? Първо, всяко ниво на галета е отделен елемент, ниво и само редът им играе роля тук. Второ, всеки елемент (с изключение на последния) е вложен три пъти:

  • Декларация на елемент: itemscope itemtype="http://data-vocabulary.org/Breadcrumb"
  • Дефиниране на стойността на атрибута на връзката: itemprop="url"
  • Дефиниране на стойността на атрибута name: itemprop="title"
  • Последният елемент също може да има url атрибут, но според мен не е необходим - защо страницата ще сочи към себе си в навигационния път?

    Атрибутите могат да се използват заедно с всякакви тагове - важни са само редът и нивото на влагане. Например:



    За начинаещи


    Въвеждането на навигационни пътеки с микромаркиране в сайта помага на търсачките да показват „четливи“ навигационни пътеки във фрагмента (което не е лошо), а също и просто да разберат по-добре структурата на сайта.

    Маркиране на статия

    Този тип микро маркиране е предназначено за статии и всякакви други информационни материали, както на търговски, така и на обикновени сайтове. Например страницата, която четете, има следната структура:


    //Деклариране на името на елемента

    //Дефиниране на атрибута „Дата на публикуване“.
    Конкурентоспособност на заявките за търсене
    //Определяне на атрибута „Име на публикация“.
    Съдържание на статията. //Дефиниция на атрибута „Съдържание на статията“.


    Средноаритметична оценка
    Максимална рейтингова стойност
    Минимална рейтингова стойност
    Брой оценки


    Всичко тук е същото като за галета, с изключение на следното:

    • Атрибутът „Дата на публикация“ трябва да бъде посочен във формат ISO-8601 във формата ГГГГ-ММ-ДДТЧЧ:ММ, където Т е само знак, ГГГГ е годината, ММ е месецът, ДД е датата, ЧЧ е часът , а ММ е минутата.
    • Когато дефинирате атрибута „Категория на публикация“ и „Име на публикация“, изобщо не е страшно, че връзката също попада в областта на стойността - роботът ще извади само данните, съответстващи на очакваната стойност за атрибута.

    Въвеждането на маркиране на статии помага на робота за търсене да разбере по-добре и класифицира съдържанието на информационния материал. Освен това, ако информацията е уникална, тя в крайна сметка ще бъде добавена към базата данни на Google.

    Микроразмер на стоки (продукт или услуга)

    Този тип микроформат е незаменим за страници, описващи стоки и услуги:

    //Деклариране на елемента
    Розов слон //Определете името на продукта или услугата
    Хубав слон. //Определяне на описанието на продукта или услугата


    //Декларирайте подтипа „Оферта“
    //Определяне на цената на продукта или услугата
    //Посочете валутата на цената на продукта или услугата


    Средноаритметична оценка
    Максимална рейтингова стойност
    Минимална рейтингова стойност
    Брой оценки


    Същото нещо - роботът за търсене веднага вижда какво се намира на страницата и къде се намира и защо изобщо е необходимо. Визуалният резултат може да бъде повишаване на привлекателността на фрагмента в SERP.

    Навигационните пътеки (breadcrumbs или breadcrumbs) са елемент от интерфейса на уебсайта, чиято основна цел е да посочи пътя от главната страница до мястото, където потребителят се намира в момента. Разбира се, това се прави предимно за удобство на престоя на потребителя на сайта, като по този начин се улеснява разбирането на виртуалната структура. Загрижеността за потребителския комфорт е една от тайните мисии, които изпълват умовете на стотици потребители: всеки иска да направи интерфейса по-удобен и търсачките не са изключение. Нека да поговорим за микро-маркиране на навигация за визуализиране на връзки в резултатите от търсенето с Google.

    За по-голяма яснота, ето визуални примери за издаване на резултати от търсене без и с микромаркиране:

    1. В първия запис връзката под заглавието се показва по обичайния начин и като правило не е напълно четлива за обикновения потребител.
    2. Във втория запис всичко е различно, връзката не се вижда там, но има същите тези галета, които показват логическата структура на местоположението на намерения елемент. Вторият вариант изглежда по-конструктивен, нека видим как да го поставите на уебсайта си.

    Това чудо се постига чрез използването на микроданни в навигацията. Нека си представим, че имаме тази структура на сайта:
    Начало – Операционни системи – FreeBSD

    Всеки елемент има свой собствен път и присъства в навигационната верига като връзка. Освен това връзката е затворена в таг, например div, атрибутите на етикета са зададени:

    Itemscope itemtype="http://data-vocabulary.org/Breadcrumb"

    Ще получите блок за артикула:

    ...

    Този блок съдържа връзката и името на елемента. За връзка е зададен атрибутът itemprop=”url”, заглавието също е затворено в отделен span таг и е зададен атрибутът itemprop=”title”. В резултат на това отделен елемент във веригата ще бъде изгладен така:



  • изгледи