Meta tagy

Meta tagy jsou speciální elementy, které se v HTML dokumentu zapisují do hlavičky stránky a které nesou informace doplňující obsah stránky. Ty nejsou při zobrazení stránky nikde vidět, ale pomáhají prohlížečům, vyhledávačům a dalším programům v lepší interpretaci stránky.

Struktura meta tagu

Meta tagy mají jednoduchou strukturu. Vždy jde o HTML značku <meta>, která většinou obsahuje dva atributy – name a content:

<meta name="jmeno" content="Obsah meta tagu">

Jméno a obsah můžeme uvést jakýkoliv. Toho využívají třeba programy pro generování stránek, které do HTML kódu umisťují svůj vlastní meta tag:

<meta name="generator" content="Wix.com Website Builder">

Takový meta tag není vůbec k ničemu užitečný, kromě toho, že generátoru buduje značku, pokud se na něj tedy někdo podívá do zdrojového kódu. Podobně funguje také meta tag author:

<meta name="author" content="Jan Štráfelda">

U některých vybraných meta tagů se místo jména name píše http-equiv. Podle původní představy tyto meta tagy sloužily jako kevivalent HTTP hlaviček. Případně i další, např. google, pokud jde o meta tag, který je určen pouze jemu. 

Meta tagy důležité pro SEO

Kromě podobných zbytečných meta tagů existuje i několik meta tagů klíčových, bez kterých se žádný marketér neobejde.

Meta tag description

Meta tag description obsahuje popisek stránky. Ten je důležitý tím, že se zobrazuje ve výsledcích vyhledávání, kde jeho vhodná podoba může zvýšit míru prokliku. Popisek také zobrazují sociální sítě u odkazů.

<meta name="description" content="Toto je popisek stránky.">

Meta tag robots

Meta tag robots řídí crawlery vyhledávačů – určuje jim, zda si mohou stránku uložit do indexu a zda smí procházet odkazy na stránce obsažené.

<meta name="robots" content="index,follow">

Meta tag keywords

Meta tag keywords už dnes nemá význam, i když dříve se do něj zapisovala klíčová slova, která se stránky týkala. Pokud váš redakční systém ještě stále obsahuje správu tohoto meta tagu, můžete ho směle ignorovat.

<meta name="keywords" content="dnes,uz,to,nefunguje">

Meta tag nositelinkssearchbox

Vyhledávač Google u některých hledání, typicky u tzv. navigačních dotazů, zobrazuje tzv. sitelinky, odkazy vedoucí dovnitř našeho webu. A v některých případech u nich může zobrazit i vyhledávací formulář. Usnadňuje tak cestu uživatelům do hloubi našeho webu. Pokud si však zobrazování formuláře nepřejeme, lze ho tímto meta tagem umístěným na úvodní stránce webu zakázat.

<meta name="google" content="nositelinkssearchbox">

Další užitečné meta tagy

Meta tag charset

Informuje o kódování, ve kterém byl dokument vytvořen. Je to jediný meta tag, který se zápisuje s jedním atributem:

<meta charset="utf-8">

Meta tag viewport

Tento meta tag je důležitý pro responzivní weby, protože říká prohlížeči, jak má web zobrazit, tj. jak moc ho má roztáhnout na displeji. Podle něj vlastně prohlížeč pozná, že je web navržený jako responzivní.

<meta name="viewport" content="width=device-width, initial-scale=1">

Meta tagy sociálních sítí

Facebook a Twitter mají v dokumentaci popsány další meta tagy, které jim pomáhají pochopit obsah stránky, typ dokumentu či třeba přiřadit k náhledu správný obrázek. Pokud to váš redakční systém podporuje, měl by v něm jít obsah těchto meta tagů spravovat. Je to velice užitečné, protože to pomáhá odkazy šířit dále.

Meta tag notranslate

Říéká Google, že si nepřejeme, aby automaticky nabízel danou stránku k překladu do dalších jazyků. Což je obecně užitečné chování, protože to zvyšuje dosah našeho obsahu. Nicméně, mohou se vyskytnout situace, kdy to nechceme.

<meta name="google" content="notranslate">

Meta tag rating

Tento meta tag označuje obsah stránky jako určený pro dospělé a podle toho s ním různá zařízení pracují. Například Google pak takovou stránku nezahrne do výsledků vyhledávaní SafeSearch (což je speciální nastavení vyhledávání, které se zapíná na úrovni Google účtu).

<meta name="rating" content="adult">

Málo důležité meta tagy

Meta tag referrer

Určuje, zda web běžící na HTTPS protokolu bude předávat HTTP referer stránkám běžícím na nezabezpečeném HTTP protokolu.

<meta name="referrer" content="unsafe-url">

Meta tag refresh

Zajišťuje přesměrování na adresu, kterou do meta tagu nastavíme, přičemž prohlížeč čeká po dobu, kterou mu v sekudnách také předáme. Například tento metata tag přesměruje po 3 sekundách návštěvníka na adresu https://example.cz:

<meta http-equiv="refresh" content="3;url=https://example.cz">

Dnes už se meta tag refresh téměř vůbec nepoužívá, nahradilo ho přesměrování na straně serveru.

Verifikační meta tagy

Různé aplikace je používají k ověření, že jste majitelem webu. Na stránkách aplikace si vygenerujete meta tag s unikátním řetězcem, zajistíte jeho vložení do stránky a aplikace si to ověří stažením stránky a porovnáním řetzce. Následně vás pustí k citlivým datům, ke kterým by se vaše konkurence neměla dostat.

<meta name="google-site-verification" content="ms7fipE7uKY">

Zákaz čtení stránky

Google podporuje speciální meta tag, který zakazuje webovým prohlížečům takto označenou stránku předčítat nahlas, například při použití Google Assistant:

<meta name="google" content="nopagereadaloud">

Titulek stránky

Někteří lidé mezi meta tagy řadí také element <title>, titulek stránky. Zřejmě proto, že je také umístěn v hlavičce vidět a jeho obsah není na stránce na první pohled vidět.