Strukturovaná data + JSON-LD = VSL

Díky specifikaci schema.org poskytují jedinečnou možnost předat ve zdrojovém kódu vyhledávači, v našich podmínkách hlavně Google, další data o obsahu na stránkách a popsat tak jejich informační vazby ve správném kontextu. U e-shopů jsou to například informace typu, zda je zboží na skladě, kolik stojí nebo jeho hodnocení a počet recenzí. Strukturovaná data mají ale význam i v jiných oborech, které nemusí být e-commerce povahy. Jsou definována například pro webové stránky restaurací, institucí, blogů, událostí, receptů nebo jimi můžete popsat osoby, o nichž je řeč. Data, která by z kontextu stránky vyhledávač těžko rozlišoval, pro něj označíte zcela jasně a on s nimi může dál pracovat. Tyto informace se tak následně mohou zobrazit ve snippetech výsledků vyhledávání nebo mohou být zahrnuty do Google Knowledge Graphu.

Snippety a bohaté výsledky vyhledávání

Data podle schema.org specifikace můžete ve zdrojovém kódu označit hned několika způsoby. Nejpoužívanějším způsobem označení jsou mikrodata. Mikrodata mají podobu HTML atributů, které je třeba do příslušných částí kódu vložit. Podobným případem je formát RDF-a, kterým lze rovněž jednotlivé úseky kódu HTML atributy popsat.

Strukturovaná data: mikrodata

Strukturovaná data: RDF-a

Třetím typem formátování strukturovaných dat je JSON-LD (JSON – Linking Data). Jedná se o doporučený formát podle Google a přináší oproti předchozím dvěma zmíněným implementacím některé výhody.

Strukturovaná data: JSON-LD

JSON-LD a Google Tag Manager

Hlavní výhodou tohoto formátu je možnost vložit jej na stránky přes Google Tag Manager (GTM) bez nutnosti upravovat zdrojový kód stránky. Nemusíte tak implementaci řešit s vývojáři, což často ušetří spoustu času. JSON-LD kód pro příslušné schéma najdete buď na stránkách schema.org nebo si jej naklikáte v JSON-LD generátoru, vložíte jej do nově vytvořeného kontejneru v GTM a následně si správnost nasazení můžete ověřit v nástroji na testování strukturovaných dat nebo v Google Search Console. V GTM může u schématu Website vložení vypadat následovně:

GTM: vložení JSON-LD kódu na všechny stránky webu

Na uvedeném příkladu jsou strukturovaná data vložena na všechny podstránky webu. Pokud byste chtěli tato data zobrazit například pouze na stránkách blogových příspěvků, museli byste tyto stránky vybrat zvolením možnosti Some Pages a použitím filtru.

GTM: Vybrání stránek, na kterých se bude kód zobrazovat

Dynamické hodnoty v JSON-LD

Pro jednoduché schéma, jako je Website, předchozí příklad postačí. Co když ale chceme pracovat s takovými strukturovanými daty, která se na stránkách neustále mění? Například hodnocení nebo dostupnost produktu? Abyste nemuseli měnit obsah kontejneru vždy, když se na stránkách některý z údajů změní, použijte proměnné pro získání dat přímo z HTML kódu stránek. V GTM můžete použít různé typy více či méně definovaných proměnných. Pro získání řetězce URL stránky postačí následující proměnná.

GTM: proměnná Page_URL

Pokud chcete získat údaj z některého HTML elementu na stránce, může už být zadání složitější a vyžaduje minimální znalosti JavaScriptu a CSS selektorů.

GTM: proměnná Rating

Získané proměnné následně vložíte do kontejneru v JavaScriptovém kódu, který vygeneruje strukturu JSON-LD. Proměnné přímo do JSON-LD formátu v GTM totiž vkládat nelze. Proměnné jsou zde uzavřené do dvojitých složených závorek.

GTM: finální podoba kontejneru s proměnnými

Řešení jsem převzal z článku Chrise Goddarda na blogu MOZ, kde je volně k dispozici ke stažení modelový zdrojový kód.

Korektnější práci s daty by přineslo, kdyby byla potřebná data pro JSON-LD dokument k dispozici v datové vrstvě, ze které si je v GTM můžete také načíst. Takové řešení by nebylo závislé na HTML struktuře stránky (například názvy tříd a identifikátorů). Nehrozilo by tedy, že se po změnách na webu najednou přestanou některé proměnné načítat.