Přidejte Microdata do modulu drobečkové navigace (mod_breadcrumbs). „Drobečková navigace“: mikroznačky a jejich dopad na úryvky stránek Mikroznačky organizace schématu strouhanky

Přidejte Microdata do modulu drobečkové navigace (mod_breadcrumbs). „Drobečková navigace“: mikroznačky a jejich dopad na úryvky stránek Mikroznačky organizace schématu strouhanky

Zdravím vás přátelé. Dnes je to 400. výročí na mém blogu. U příležitosti takového rande jsem opravdu chtěl poskytnout nějaký opravdu užitečný obsah, aby byl zajímavý, užitečný a relevantní. A téma na takový článek se objevilo zčistajasna – chtěl jsem porozumět vzniku krásných střípků ve vyhledávání, ale zároveň jsem zabrousil do dalších dvou témat:

  • instalace strouhanky na váš blog WordPress (chtěl jsem to bez pluginu, abych nenačítal web),
  • a nastavení mikro značkování (bez něj jsou strouhanky málo použitelné).
Navigační prvek

Slyšel jsem a četl o strouhankách už dlouho, ale nemohl jsem opravdu pochopit, k čemu slouží běžnému blogu s jednoduchou a srozumitelnou strukturou. Posuďte sami, mám hlavní stránku, všechny příspěvky jsou rozděleny do kategorií a to je vše. To znamená, že maximální cesta z domovské stránky k finálnímu článku jsou 2 kliknutí. Každý článek má odkaz na kategorii, do které patří, takže návštěvník se prostě nemá kam ztratit.

Jiná věc je, pokud je web složitý a jeho struktura je taková, že můžete půl hodiny chodit v kruzích a nenajdete, co hledáte. Pokud máte nějaký internetový obchod s desítkami kategorií, z nichž každá je rozdělena na podřízené nadpisy, ty a pak další, a pak je každý produkt rozdělen do barev - zde chápu důležitost strouhanky - uživatel je potřebuje jako prvek navigace a .

Mimochodem, z toho pochází název „drobečka“ zpočátku to byla jen navigace na webu. Vzpomeňte si na pohádku „Jíšek a Mařenka“, kde děti cestou házely kousky chleba, aby později našly cestu zpět. V pohádce jim tato metoda moc nepomohla, ale pro weby byla užitečná.

Vzhled úryvku ve výsledcích vyhledávání

Takže jsem v takovém gadgetu pro svůj blog neviděl smysl, dokud jsem nenarazil na druhý význam drobků - ukázalo se, že je vidí nejen lidé, ale také vyhledávače. A vyhledávače je vnímají nejen jako interní odkazy, které ovlivňují linkování a rozložení váhy stránky, ale také jako důležitý navigační prvek. Yandex a Google používají tento prvek k vytvoření úryvku. Nechci vám dlouho říkat, jak to vypadá, lepší je to jednou vidět na vlastní oči:

Fragment je zobrazení webu ve výsledcích vyhledávání.

Čím atraktivnější je úryvek, tím vyšší je jeho míra prokliku, což má okamžitě dvojí účinek:

  • Více kliknutí znamená větší návštěvnost webu,
  • Míra prokliku úryvku odkazuje na faktory chování, a čím je vyšší, tím snáze se zdroj vyšplhá na TOP pro potřebné dotazy.

Jediný bod, který mi nebyl jasný, je, že tyto odkazy jsou strouhanka a ne něco jiného. Souhlas, stránka z libovolného článku blogu obsahuje další odkazy na kategorii a na hlavní stránku (horní menu, kategorie v postranním panelu, odkaz na kategorii v bloku s metadaty článku).

Člověk ne, nemůže se podívat na stránku a pochopit - tento odkaz je z nabídky, toto je z textu článku a toto je strouhanka.

Musel jsem procházet fóra a číst mnoho blogů. Ve většině případů píší jen o tom, že jsou potřeba drobky a zlepšují použitelnost a úryvek, a pak píší návod na nastavení pluginu Breadcrumb NavXT (Breadcrumb je v angličtině bread crumbs) nebo poskytují implementační kód bez pluginu - a to je vše. Mám dojem, že většina webmasterů vůbec netuší, jak s tímto prvkem správně pracovat a vnímají jej pouze jako prvek vnitřního prolinkování stránek.

Výsledky Google ukazují, že ne více než 10 % webů má ve svém arzenálu správnou drobečkovou strukturu, zbytek funguje staromódním způsobem a zobrazuje adresu URL stránky ve úryvku.

Mikro označení strouhanky

Nebyl jsem příliš líný, pustil jsem se do vyhledávání a analyzoval, jak vznikal Breadcrumb na různých webech a jak tyto weby vypadají ve vyhledávání. Moje teorie se ukázala jako správná:

  • Na webu jsou drobky – žádné mikroznačky – běžný úryvek s URL.
  • Jsou tam drobky – je tam micro markup – vylepšený úryvek.

Vykopal jsem vše, co jsem potřeboval, a dnes vám povím o strouhankách od A do Z. Technicky vzato není jejich umístění na web ani polovina úspěchu – je to 10 %. Hlavní funkcí, která přinese skutečné výhody, je mikro značkování.

Hlavní přínos není ve strouhance, ale v jejich správném mikrooznačení pro úryvek.

S micromarkingem jako pojmem jsem se seznámil teprve před pár měsíci. Tehdy jsem tomu moc nerozuměl, ale snažil jsem se nastavit základní prvky pro články a komentáře. Někteří blogeři napsali, že je to téměř magické tlačítko, které posouvá stránky na vrchol (většinou studenti bloggerské školy Alexandra Borisova) - nevím, proč se tak rozhodli. To se mi hned zdálo pochybné, ale nyní mohu s jistotou říci – za 2 měsíce, co mám na svém webu mikroznačky, jsem nezaznamenal žádné znatelné pohyby ve výsledcích vyhledávání u propagovaných dotazů.

V případě označování strouhanky by měla být situace jiná nebudeme čekat na žádné pohyby ve výsledcích organického vyhledávání, ale budeme počítat s tím, co jsem uvedl výše – zlepšením klikatelnosti úryvků a odpovídajících buchet (růst díky; behaviorální faktory).

Drobečková navigace na WordPress bez pluginu

Přešli jsme tedy od rozhovorů „proč a k čemu“ ke rozhovorům „jak na to“. Okamžitě jsem zahodil plugin Breadcrumb NavXT, protože nemá smysl „vyžadovat úpravu se souborem“ a sám neumí mikroznačky. Je tu ještě jedna možnost - WordPress SEO plugin SEO od Yoast, ten umí také drobečky, ale nemám chuť to měnit. Zbývá pouze použít skript nebo funkci.

Pokud se rozhodnete instalovat drobky na WordPress, pak to udělejte bez pluginů – web se bude méně zatěžovat a bude více příležitostí k přizpůsobení kódu.

Krok 1. Funkce wp_zhilin_krohi

Protože jsem se právě začal učit základy PHP, začal jsem se zajímat o vytvoření funkce, která by na mém blogu zobrazovala drobky. Intuitivně jsem viděl, že by neměly být žádné problémy, protože všechny drobečkové prvky jsou již zobrazeny v šabloně, stačí je vzít a uspořádat potřebné odkazy podle očekávání.

Když se podívám dopředu, řeknu, že jsem byl schopen vytvořit nejkompaktnější (lehké a rychlé čtení) funkci, jakou jsem kdy na jiných stránkách našel.

První verze kódu dopadla rychle, ale nevzal jsem v úvahu jeden bod - kód by měl nejen zobrazovat odkazy na stránky, ale také obsahovat mikroznačky, ale byla s tím přepadení - můj kód se opakoval chyby mnoha webmasterů - kvůli standardní implementaci výstupu nefungovala distribuce odkazů na prvky pro vkládání značek.

Musel jsem začít znovu a spoléhat se na jednodušší funkce WordPress PHP (ale naučil jsem se něco nového). Výsledkem byla funkce wp_zhilin_krohi (poprvé jsem funkci pojmenoval vlastním jménem - nice), která zobrazuje drobky na stránkách s články a na stránkách kategorií. Všechny nadřazené kategorie (bez ohledu na to, kolik jich je) jsou automaticky zohledněny a každý prvek je zabalen do mikroznaček.

U článků vypadají drobky takto:

Domů > Nadřazený nadpis (pokud existuje) > Kategorie > Článek

Domů > Nadřazená kategorie (pokud existuje) > Kategorie >

Mám obavy, že název článku ve strouhance povede k spamování stránky klíčovými slovy. Požádal jsem o to technickou podporu Yandex, v odpovědi napsali, že pokud to není zaměřeno na klamání vyhledávačů, neměly by existovat žádné sankce, ale berou se v úvahu. Zde je odpověď:

Pokud si tedy myslíte, že vám zbytečné opakování nadpisu článku bude vadit, řádky 17 až 20 smažte.

Zde je samotná funkce, musíte ji přidat do souboru functions.php vašeho motivu, před závěrečným?> (to se provádí přímo přes admin panel, nepotřebujete ani FTP klienta):

/*** Drobky s mikro značením ***/ funkce wp_zhilin_krohi() ( if (!is_home()) ( echo "Home" "; ) if (is_category() || is_single()) ( $cats = get_the_category() ; foreach ($kočky jako $kočka) ( echo "id_termu)."" >" .$kočka->jméno." " " ) ) if(is_single()) ( the_title(); ) );

Mikroznačka se okamžitě zapracuje do kódu funkce a automaticky se zobrazí spolu s každým odkazem.

Krok 2. Zobrazení funkce na stránkách

Aby se na stránkách objevil řetězec odkazů, které jsme vytvořili, musíte otevřít soubor s tématem WordPress, který je zodpovědný za odpovídající typ stránky, a vložit do něj kód, který funkci volá:

Minimálně potřebujete soubor single.php (zobrazuje příspěvky) - téměř vždy se jmenuje stejně a pak záleží na šabloně, někde se stránky kategorií zobrazují přes archive.php, někde přes index.php - najdete např. jeden, který potřebujete.

V tomto souboru musíte najít místo, kde byste chtěli drobky vidět. Obvykle jsou umístěny v horní části webu (před názvem příspěvku) jako navigační prvek. Vyhledejte tento kus kódu - php the_title a vložte před něj výstup funkce (podívejte se na design, kam se hodí).

Drobečková navigace není vždy umístěna v horní části stránky, existují výjimky. Řekněme, že je potřebujete pouze k zobrazení úryvku, pak je můžete umístit do suterénu – vyhledávače tam mikroznačku uvidí. Tato možnost byla implementována na blogu Sergeje Sosnovského - má samostatný blok v horní části pro uživatele, ale nemá mikroznačky a v patičce se zobrazují strouhanka s mikroznačkami (popravdě nechápu proč, i když ):

Krok 3. Návrh

Vzhled jakéhokoli prvku stránky musí být v souladu s designem vašeho webu, proto neexistuje jediné řešení pro každý blog.

To samé jsem nastavil na svých zdrojích – zmenšil jsem písmo drobečky oproti hlavnímu obsahu. Za tímto účelem jsem v souboru style.css ani nevytvářel samostatné styly, ale funkci jsem uzavřel do kontejneru div a zadal v něm jeden jediný parametr – velikost písma (možná jste si všimli na snímku obrazovky výše):

Všechny ostatní vlastnosti drobečkové navigace jsou zděděny ze stylů motivů. Chcete-li provést malé doplňky (změnit písmo, barvu textu atd.), zadejte potřebné vlastnosti ve stejném kontejneru.

Pokud chcete radikálně změnit design zobrazeného řetězce odkazů (udělat nějaké obrázky nebo tlačítka), pak jim přiřaďte speciální třídu, například takto - pak pro tuto třídu vytvořte samostatný blok ve style.css a zadejte všechny potřebné parametry.

Zde se vám budou hodit vaše znalosti kaskádových stylů CSS a designový vkus (pokud si design děláte sami).

Kontrola mikroznaček strouhanky

Poté, co uděláte vše, nezapomeňte zkontrolovat správnou funkci mikroznaček ve speciálních validátorech Yandex a Google, nikdy nevíte, objeví se nějaké chyby:

webmaster.yandex.ru/microtest.xml developers.google.com/structured-data/testing-tool/ (45 hlasů, průměr: 4,7 z 5)

Zdravím všechny, dnes si nadefinujeme minimální sadu a příklady implementace mikroznaček drobečky, článků a produktů pro komerční a informační stránky. Technologie sama o sobě již není novinkou, ale rozmanitost jejích atributů může být matoucí, a proto se v tomto článku pokusím upozornit na několik typických a osvědčených řešení, která lze ihned bezpečně implementovat.

Celé téma mikroformátů nelze obsáhnout v jednom článku, a proto, jak je diskutováno v jiných materiálech, budu na ně odkazovat. Kromě toho se můžete vždy ponořit do Nástroj pro tvorbu mikroznaček Google.

Mikro označení strouhanky

Inu, tohle je klasika žánru, která nesmí chybět na žádné stránce. Například stránka vypadá takto:

//1. úroveň: hlavní stránka

SEO blog Pingo

//úroveň 2: kategorie

Pro začátečníky

//úroveň 3: finální materiál
Typy vyhledávacích dotazů

Co zde tedy vidíme? Jednak je každá úroveň strouhanky samostatný prvek, úroveň a roli zde hraje pouze jejich pořadí. Za druhé, každý prvek (kromě posledního) je vnořen třikrát:

  • Deklarace položky: itemscope itemtype="http://data-vocabulary.org/Breadcrumb"
  • Definování hodnoty atributu odkazu: itemprop="url"
  • Definování hodnoty atributu názvu: itemprop="title"
  • Poslední prvek může mít i atribut url, ale podle mě to není potřeba – proč by stránka ve strouhance ukazovala na sebe?

    Atributy lze použít ve spojení s libovolnými značkami – důležité je pouze pořadí a úroveň vnoření. Například:



    Pro začátečníky


    Zavedení drobečků s mikroznačkami na web pomáhá vyhledávačům zobrazovat „čitelné“ strouhanky v úryvku (což není špatné) a také jednoduše lépe porozumět struktuře webu.

    Označení článku

    Tento typ mikroznaček je určen pro články a jakékoli další informační materiály na komerčních i běžných stránkách. Stránka, kterou čtete, má například následující strukturu:


    //Deklarujte název prvku

    //Definice atributu “Datum publikování”.
    Konkurenceschopnost vyhledávacích dotazů
    //Definování atributu „Název publikace“.
    Obsah článku. //Definice atributu „Obsah článku“.


    Odhad aritmetického průměru
    Maximální hodnota hodnocení
    Minimální hodnota hodnocení
    Počet hodnocení


    Zde je vše stejné jako u strouhanky, kromě následujících:

    • Atribut Datum publikace musí být zadán ve formátu ISO-8601 ve tvaru RRRR-MM-DDTHH:MM, kde T je pouze znak, RRRR je rok, MM je měsíc, DD je datum, HH je hodina a MM je minuta.
    • Při definování atributu „Kategorie publikace“ a „Název publikace“ není vůbec děsivé, že odkaz spadá také do oblasti hodnoty - robot vytáhne pouze data odpovídající očekávané hodnotě atributu.

    Zavedení značkování článků pomáhá vyhledávacímu robotu lépe porozumět a klasifikovat obsah informačního materiálu. Pokud je navíc informace jedinečná, bude nakonec přidána do databáze Google.

    Mikrovelikost zboží (produkt nebo služba)

    Tento typ mikroformátu je nepostradatelný pro stránky popisující zboží a služby:

    //Deklarujte prvek
    Růžový slon //Určete název produktu nebo služby
    Pěkný slon. //Definování popisu produktu nebo služby


    //Deklarujte podtyp „Nabídka“
    //Určete cenu produktu nebo služby
    //Určete měnu ceny produktu nebo služby


    Odhad aritmetického průměru
    Maximální hodnota hodnocení
    Minimální hodnota hodnocení
    Počet hodnocení


    Totéž – vyhledávací robot okamžitě vidí, co se na stránce nachází a kde se nachází a proč je to vůbec potřeba. Vizuálním výsledkem může být zvýšení atraktivity úryvku v SERP.

    Breadcrumbs (breadcrumb nebo breadcrumb) jsou prvkem rozhraní webu, jehož hlavním účelem je naznačit cestu z hlavní stránky tam, kde se uživatel aktuálně nachází. To se samozřejmě děje především pro pohodlí uživatele na webu, čímž se usnadní pochopení virtuální struktury. Starost o uživatelský komfort je jednou z tajných misí, která naplňuje stovky myslí na použitelnost: každý chce udělat rozhraní pohodlnějším a vyhledávače nejsou výjimkou. Promluvme si o mikroznačkách ve strouhance pro vizualizaci odkazů ve výsledcích vyhledávání Google.

    Pro přehlednost uvádíme vizuální příklady vydávání výsledků vyhledávání bez mikroznaček a s mikroznačkami:

    1. V prvním záznamu je odkaz pod nadpisem zobrazen běžným způsobem a pro běžného uživatele zpravidla není zcela čitelný.
    2. Ve druhém záznamu je vše jinak, odkaz tam není vidět, ale jsou tam ty stejné drobečky, které zobrazují logickou strukturu umístění nalezeného prvku. Druhá možnost vypadá konstruktivněji, pojďme se podívat, jak to umístit na svůj web.

    Tohoto zázraku je dosaženo díky použití mikrodat ve strouhance. Představme si, že máme na webu tuto strukturu:
    Hlavní stránka – Operační systémy – FreeBSD

    Každá položka má svou vlastní cestu a je přítomna v navigačním řetězci jako odkaz. Odkaz je také uzavřen ve značce, například div, atributy značky jsou nastaveny:

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

    Za položku získáte blok:

    ...

    Tento blok obsahuje odkaz a název prvku. U odkazu je nastaven atribut itemprop=”url”, název je také uzavřen v samostatné značce span a je nastaven atribut itemprop=”title”. V důsledku toho bude samostatný prvek v řetězu vyžehlen takto:



  • pohledy