XHTML – element meta a jeho použití

13. listopadu 2002

•

Dalším elementem z hlavičky dokumentu, kterým se v našem seriálu budeme zabývat, je meta. Kromě vysvětlení jeho syntaxe a významu si uvedeme také většinu jeho tvarů, které se ve stránkách používají.

Element meta – meta data aneb informace o informacích

Povolený obsah: EMPTY (žádný obsah)

Atributy:

%i18n;: Tato parametrická entita obsahuje atributy internacionalizace, tedy lang, xml:lang a dir.
id ID #IMPLIED: Obsahem tohoto atributu je jméno elementu.
name CDATA #IMPLIED: Hodnotou tohoto atributu je jméno vlastnosti, které se element týká.
content CDATA #REQUIRED: Tento atribut obsahuje hodnotu vlastnosti specifikované pomocí atributu name nebo HTTP hlavičky specifikované pomocí atributu http-equiv.
http-equiv CDATA #IMPLIED: (HTTP-equivalent) Tento atribut slouží k nastavení určité HTTP hlavičky pro dokument. Jeho hodnotou je jméno hlavičky, nastavovaná hodnota se udává pomocí atributu content. Tyto informace jsou buď přečteny HTTP serverem před odesláním stránky interpretu XHTML a poslány jako HTTP hlavičky, nebo si je čte interpret přímo z kódu stránky. Pokud použijeme atribut http-equiv, již nemůžeme použít atribut name a naopak.
scheme CDATA #IMPLIED: Tento atribut udává, pokud je přítomen, v jakém formátu jsou meta-data v atributu content uvedena nebo jakýsi pomocný text k interpretaci těchto dat. Například pokud je hodnotou content nějaké datum (např. 25-12-02), můžeme zde poskytnout informace o jeho formátu, např. Day-Month-Year (Den-Měsíc-Rok). V praxi se s tímto atributem příliš nesetkáte, neboť u většiny běžně používaných tvarů elementu meta existuje jakási nepsaná dohoda o formátu uváděných dat.

Element meta v XHTML 1.0 Strict DTD

Element meta umožňuje webovým autorům specifikovat informace o daném dokumentu. Tyto informace pak mohou být zpřístupněny uživateli prohlížeče (musí to být ale jiným způsobem než jako součást obsahu stránky), mohou být využity při ukládání stránek do různých databází, a svou nezanedbatelnou roli mají i pro vyhledávací roboty – ti využívají informace zde uvedené buď k samotnému vyhlédávání nebo je zobrazují ve výsledcích vyhledávání jako doplňující informace.

Hodnoty atributů elementu meta mohou a nemusí být citlivá na velikosti písmen (záleží na vžitých tvarech nebo na profilu) – pouze hodnoty atributu http-equiv na velikost písmen citilivé nejsou.

Je také vhodné dát si záležet na jazykové informaci u elementu meta – pokud jsou data uvedená v jiném jazyku než je jazyk dokumentu (nastavený u elementu html), měli bychom uvést příslušné atributy xml:lang a lang.

Hodnoty, které se uvádějí do atributů elementu meta, nejsou součástí žádné specifikace – mohou být definovány v profilu přiřazeném v elementu head, ale veskrze se používá několik vžitých hodnot, které jsou rozpoznávány většinou interpretů XHTML (k jejich používání není třeba použití profilu a nejsou citlivé na velikost písmen) – ty si nyní představíme. Následující přehled berte spíše jako informativní, mnohé zde uvedené tvary elementu meta použijete jen málokdy, nutné jsou jenom některé – ty si uvedeme v příkladu použití elementu meta o něco níže. Začneme nejrůznějšími ekvivalenty HTTP hlaviček:

Jazyk dokumentu

Syntaxe: <meta http-equiv="content-language" content="kód jazyka" />

Uvedení této informace je velmi důležité pro správné zařazení stránky do databáze vyhledávačů, navíc některé vyhledávače přikládají stránce v takovém případě vyšší prioritu.

Kódování dokumentu

Syntaxe: <meta http-equiv="content-type" content="text/html; charset=kódování" />

Tato hlavička ve skutečnosti udává MIME typ posílaných dat, kódování je obsaženo až v jeho parametru charset. Informace o použitém kódování by neměla chybět v žádném XHTML dokumentu. Kódováním jsme se již v seriálu zabývali, proto jen připomenu nejpoužívanější kódování: univerzální UTF-8 použitelné prakticky pro jakýkoli jazyk; dále potom ISO-8859-2 nebo windows-1250 pro češtinu a ISO-8859-1 nebo windows-1252 pro západoevropské jazyky (včetně angličtiny).

Co se týče MIME-typu u XHTML dokumentů, v současnosti se používá text/html z důvodů kompatibility s HTML. Tento typ by ale měl být postupně nahrazen MIME-typem XHTML application/xhtml+xml – i ten by ale měl být doprovázen parametrem určujícím kódování dokumentu.

Automatické obnovení stránky

Syntaxe: <meta http-equiv="refresh" content="čas v sekundách" />

Tohoto zápisu můžete využít k automatickému obnovování stránky. Vždycky byste ale měli zvážit, jestli je to opravdu nezbytné, protože takové chování je pro uživatele matoucí, zvláště potom pro uživatele handicapovaného. Pokud se k němu přesto odhodláte, měli byste uživateli toto chování stránky oznámit a navíc mu ho umožnit ovládat – např. zastavit nebo pozastavit.

Zmiňovaný zápis se také často používá k přesměrování na jinou adresu – za časem v takovém případě následuje středník a řetězec URL=adresa stránky. Prohlížeč po daném čase automaticky přesměruje uživatele na zadanou adresu. Tento zápis jednak není standardní a jednak je poměrně velkým problémem z hlediska přístupnosti a použitelnosti takového webu. Jednoduše řečeno, spíše tím uživatele zmatete než dosáhnete nějakého pozitivního efektu. Lepším řešením je v takovém případě použítí HTTP stavového kódu 30x, který je standardní a jsou ho schopna rozluštit všechna možná zařízení pracující s protokolem HTTP.

Ovládání cache prohlížeče

Prohlížeče ukládají do cache navštívené stránky, aby je již při příští návštěvě nemusely nahrávat ze serveru. Vy můžete toto chování ovládat pomocí tří HTTP hlaviček, které se dají suplovat pomocí elementu meta. Nyní si je představíme:

Syntaxe: <meta http-equiv="expires" content="datum a čas" />

Tento zápis udává, do kdy je daná stránka platná (tedy do kdy ji může mít prohlížeč uloženou v cache) – po tomto datu musí prohlížeč zažádat o její novou verzi. Čas se zde udává ve formátu Jméno-dne(3 znaky), Číslo-dne Jméno-měsíce(3 znaky) Rok Hodiny:Minuty:Sekundy GMT, přičemž se jedná o Greenwichský čas (Greenwich Mean Time, tedy GMT) – např. Thu, 30 Dec 2002 15:17:45 GMT.

Poměrně často se používá jako jako čas hodnota 0 v domění, že zajistí neukládání stránky do cache – tato hodnota je ale nestandardní, a proto byste se jí měli vyvarovat.

Syntaxe: <meta http-equiv="cache-control" content="hodnota" />

Pomocí tohoto zápisu lze ovládat cache přímo. Jako hodnotu můžeme uvést např. no-cache (stránka se nesmí ukládat), public (stránka se smí ukládat – toto chování je u běžných stránek automatické, již tomu ale tak není u stránek vyžadujících HTTP autentifikaci – v takovém případě se může hodit tato hlavička) nebo max-age=sekundy (specifikuje dobu od požadavku, po jakou je stránka aktuální – po uplynutí této doby musí prohlížeč zažádat o novou verzi stránky). Za tato slova můžete navíc přidat čárku a text must-revalidate, která říká prohlížeči, že musí poslouchat vaše pravidla ohledně cache (jinak je mu ponechána jistá volnost). Příklad:

Syntaxe: <meta http-equiv="pragma" content="no-cache" />

Tuto hlavičku sice můžete použít, ovšem nikde není zaručeno, že bude správně fungovat – v HTTP specifikaci je ohledně jejího chování ponechána volnost (má sloužit k předávání specifických hlaviček pro různá zařízení), takže je lepší používat obě výše uvedené alternativy.

Co se týče praktického využití těchto hlaviček, doporučoval bych vám ponechat nakládání s cache na prohlížeči (a tedy zmiňované hlavičky nepoužívat) – ten může díky mechanismům protokolu HTTP vcelku dobře určit, jestli je třeba stáhnout novou verzi stránky. Pokud to třeba není, nahrává se vaše stránka rychleji, což je pro uživatele příjemnější. Opravdu opodstatněné jsou tyto hlavičky pouze u webů, které velmi často mění svůj obsah (zpravodajství, webová fóra apod.)

Hodnocení PICS

Syntaxe: <meta http-equiv="PICS-Label" content='hodnocení PICS' />

PICS znamená Platform for Internet Content Selection, tedy jakýsi „systém“ pro výběr internetového obsahu. Jedná se o systém hodnocení obsahu webových stránek, původně určený k tomu, aby se děti nedostali k „závadnému obsahu“. Postupem času se z něj ale stal systém pro charakteristiku jakýchkoli dat.

Volně přístupná specifikace PICS a spoustu dalších informací o tomto systému se nachází na w3.org/PICS. Abyste hodnocení na svých stránkách mohli používat, musíte nechat své stránky zhodnotit nějakou službou. Ta vám pak vygeneruje na základě tohoto hodnocení text, který vložíte do elementu meta. Tento text bude pravděpodobně obsahovat uvozovky („), proto je třeba ho vložit do apostrofů.

Používat hodnocení PICS je důležité hlavně u stránek, kde lze předpokládat dětského návštěvníka, neboť ti mohou mít přístup na nehodnocené weby zakázaný nebo omezený.

Implicitní skriptovací jazyk

Pokud chceme využívat na stránce atributy, které jsou ovladačemi událostí (ještě o nich bude řeč), musíme uvést MIME typ skriptovacího jazyka, ve kterém jsou udávány jejich hodnoty:

Syntaxe: <meta http-equiv="content-script-type" content="typ" />

Jako MIME typ můžeme uvést např. text/javascript (pro JavaScript, což je nejrozšířenější skriptovací jazyk na straně klienta) nebo text/vbscript (pro Visual Basic Script).

Implicitní stylový jazyk

Pokud chceme využívat atribut style, musíme uvést MIME typ implicitního stylového jazyka, ve kterém jsou hodnoty tohoto atributu udávány:

Syntaxe: <meta http-equiv="content-style-type" content="typ" />

Jako MIME-typ můžeme uvést např. text/css (pro CSS, jediný stylový jazyk použitelný v současných prohlížečích).

Implicitní styl

Syntaxe: <meta http-equiv="default-style" content="jméno" />

Pomocí HTTP hlavičky, respektive jejího ekvivalentu, můžete také specifikovat vámi preferovaný styl, pokud posktytujete i alternativní. O těchto věcech si ještě budeme povídat v části o stylech.

Nyní budeme v našem přehledu pokračovat dalšími tvary elementu meta, a sice těmi, které používají atribut name:

Popis dokumentu

Syntaxe: <meta name="description" content="popis" />

Tento popis je často zobrazován pod odkazem ve výsledcích vyhledávání, proto byste do něj měli vložit text, který co nejlépe popisuje obsah vaší stránky. Měli byste se vyvarovat toho, aby všechny stránky vašeho webu obsahovaly pouze stručný, všude stejný výčet hlavních témat webu. Naopak, každá stránka by měla obsahovat popis toho, co konkrétně obsahuje (tuto informaci můžete chápat jako jakýsi rozšířený titulek dokumentu).

Pokud stránka obsahuje stejné informace ve více jazycích současně, můžete použít i více elementů meta name="description", z nichž každý bude obsahovat popis v jiném jazyce – tento jazyk musíte uvést v atributech xml:lang a lang.

Klíčová slova dokumentu

Syntaxe: <meta name="keywords" content="klíčová slova" />

Klíčová slova jsou ta slova, kterých se vaše stránky týkají. Při jejich zadání do vyhledávače by se měla ve výsledcích objevit i vaše stránka. Měli byste je oddělovat čárkou a platí pro ně to samé, jako pro popis dokumentu.

Popis a klíčová slova by mohla leckoho svádět k různým podvodům vyhledávačů – pokud zde uvedete falešná slova, která jsou často vyhledávaná (např. sex), uživatel si ničeho nevšimne a vaše stránka by se měla objevovat ve výsledcích vyhledávání daleko častěji. Tak to ale, bohudíky, není – jednak vyhledávače nepřikládají zde uvedeným informacím příliš významu při vyhodnocování relevantnosti stránky pro daný dotaz (uvedené informace ale často zobrazují ve výsledcích vyhledávání u odkazu na stránku), ale hlavně umí podobné podvody odhalit a velmi štědře je penalizují, takže vaše stránka se bude vyskytovat až úplně u dna výsledků vyhledávání. I kdyby se vám to ale podařilo, tak existuje několik důvodů, proč se to nemusí vyplatit:

Je to neetické a tak to může velmi poškodit pověst vašeho webu.
Takto získaní návštěvníci hledají na vašich stránkách informace, které se tam nenachází – z toho vyplývá, že si vaši stránku zapamatují negativně a při příštím setkání s ní (např. v reklamě, ve výsledcích vyhledávání) se jí budou snažit vyhnout.
Tím, že uvedete nejrůznější slova z oblasti pornografie, se na vaší stránku vzhledem k možnému automatickému filtrování stránek v proxy nemusí dostat mnoho případných návštěvníků (např. z firem, škol; děti).

Autor dokumentu

Syntaxe: <meta name="author" content="autor dokumentu" />

Zde by měl být obsažen autor kódu dokumentu. Iniciativa Dogma W4 navíc doporučuje následující formát této informace:

Jako part může být uveden text code (autor kódu), scripts (autor skriptů), style (autor stylů) a all (autor veškerých kódů v dokumentu). Pokud jméno autora obsahuje neanglická písmena (písmena s háčky a čárkami), měl by být uveden i jeho přepis do angličtiny. Pokud je autorů více, měli by být uvedeni každý ve zváštním elementu meta. Příklad:

Copyright dokumentu

Syntaxe: <meta name="copyright" content="copyright dokumentu" />

Pokud chcete uvést copyright na svoje stránky, můžete to učinit tímto způsobem. Hodnotou je jméno člověka nebo organizace, který/která je držitelem copyrightu, dále případně jeho e-mailová adresa a rok vytvoření dokumentu. Příklad:

Generátor dokumentu

Syntaxe: <meta name="generator" content="generátor dokumentu" />

Obsahem této informace je program, který generoval nebo v kterém byly vytvořeny dané stránky.

Ovládání webových robotů

Jak asi víte, vyhledávače si v určitých časových intervalech vyžádávají webové stránky, které potom ukládají do své databáze a umožňují pomocí ní uživatelům tyto stránky prohledávat. Té části vyhledávače, která prochází webové stránky, se říká webový robot nebo webový pavouk. Ten si většinou uloží kopie nebo části všech stránek vašeho webu, na které se dostane pomocí odkazů nebo jiným způsobem. My ale můžeme chování těchto robotů omezit, a to dvěma způsoby – pomocí elementu meta nebo souboru robots.txt. Nejdříve se podíváme na variantu s elementem meta:

Syntaxe: <meta name="robots" content="hodnota" />

Jako hodnotu můžeme použít jedno z následujících slov nebo jejich kombinaci (v tom případě jsou od sebe odděleny čárkou): all, index, nofollow a noindex. Z těchto slov nám vznikne několik možných modelů chování robota:

all – robot může stránku zanést do databáze (zaindexovat) i procházet stránky, na které jsou v ní odkazy. Toto chování by mělo být implicitní, proto ho není třeba uvádět.
index – robot může stránku zaindexovat.
index, nofollow – robot může stránku zaindexovat, ale nesmí procházet odkazy zde uvedené.
nofollow – robot nesmí procházet odkazy.
noindex – robot stránku nesmí zaindexovat.
noindex, nofollow – robot nesmí stránku indexovat ani procházet odkazy.

Nyní se budeme zabývat souborem robots.txt. Tento soubor nám umožňuje definovat poměrně detailně chování robotů, a to i v závislosti na jménu robota. Jedná se o obyčejný textový soubor, který musí být umístěn v kořenové složce webu, tzv. rootu (např. pro server http://interval.cz je toto umístění http://interval.cz/robots.txt) – pro celý server je tento soubor jediný, protože robot ho bude hledat pouze tady. Všechna písmena v názvu souboru musí být malá.

V souboru je vždy jedna řádka vyhrazena jednomu příkazu, přičemž příkazy jsou dva – User-agent: jméno robota (jako jméno robota lze definovat i pouhou část z celkového jména, bez udání verze, nebo znak *, který udává, že následující příkazy platí pro všechny roboty) následovaný jedním nebo více příkazy Disallow: URI, které udávají, kam daný robot nesmí – URI jsou relativní ke kořenové složce webu, přičemž mohou reprezentovat soubor, složku nebo začátek názvu jednoho z nich. Pro komentáře se používá znak #, přičemž každý komentář je ukončen řádkovým zlomem. Vše si nyní ukážeme na příkladu:

User-agent: *         # Pravidlo platí pro všechny roboty.
Disallow: /slozka1/ # Znepřístupní složku slozka1.
Disallow: /slozka     # Znepřístupní veškerá URI začínající na slozka,
                      # tzn. /slozka1/, /slozka/, ale i /slozka3.html.
                      # Prázdná řádka se smí vyskytovat mezi záznamy pro jednotlivé roboty,
                      # ale již ne mezi příkazy v uceleném záznamu.
User-agent: Lojza     # Pravidlo platí pro robota Lojza, Lojza 1.1 i SuperLojza
Disallow: /           # Znepřístupní celý web.

A k čemu se ovládání chování robota hodí? K tomu, aby zbytečně neprocházel stránky, které nejsou pro indexaci důležité (např. různě kódované verze téže stránky). Také byste si měli uvědomit, že tato pravidla nejsou pro roboty závazná (dodržují je jen tzv. slušní roboti), a proto se v žádném případě nemůžete na toto chování spoléhat (např. u souborů s tajnými daty).

Typ zdroje

Syntaxe: <meta name="resource-type" content="document" />

Tento zápis udává, že se jedná o dokument. Je údajně důležitý pro některé vyhledávače.

Ovládání Googleu

Na závěr vám ukáži, jak lze pomocí elementu meta ovládat webového robota vyhledávače Google.

Syntaxe: <meta name="googlebot" content="hodnota" />

Hodnotou zde mohou být jednak slova platná pro meta name="robots", navíc ale můžeme použít jedno ze speciálních:

nosnippet – ve výpisu vyhledaných stránek nebude u naší stránky popisek.
noarchive – Google znepřístupní uživateli verzi stránky, kterou má uloženou u sebe. Toto slovo lze prý použít i u meta name="robots", ale nevím jaká je zde podpora jiných vyhledávačů.

Použití elementů meta v praxi

Nyní se tedy budeme věnovat elementům meta v praxi – samozřejmě, že jejich použití vždy záleží na potřebách konkrétní stránky, nicméně každá stránka by měla obsahovat informaci o jazyku a kódování dokumentu, popis, klíčová slova a autora dokumentu. V případě použití atributu style je navíc nutné uvést implicitní stylový jazyk, to samé platí i pro atributy ovladačů událostí (v tom případě je nutné uvést implicitní skriptovací jazyk). Minimální hlavička XHTML dokumentu, obsahující všechny nutné náležitosti, by tedy mohla vypadat nějak takto:

<head>
  <meta http-equiv=“content-type“ content=“text/html; charset=utf-8″ />
  <meta http-equiv=“content-language“ content=“cs“ />
  <title>Pepova stránka o autech: úvod</title>
  <meta name=“description“ content=“Pepova stránka o autech. Zabývá se vším, co se týká automobilismu – nová auta, opravy, zákony, ale také motoristickým sportem.“ />
  <meta name=“keywords“ content=“auta,auto,fotky,fotka,opravy,oprava,zákon,
automobilismus,motoristický sport“ />
  <meta name=“author“ content=“all: Pepa Novák (Pepa Novak); pepa@zdepa.cz“ />
</head>

Další možnosti přiřazení meta dat k dokumentu

Další možností specifikování meta dat (ale v podstatě nepoužívanou, a proto nepříliš podporovanou) je element link. S jeho pomocí se můžeme odkazovat na externí soubor s meta daty. V takovém případě bychom ale měli použít profil elementu head. Elementu link se ještě budeme věnovat v dalších dílech seriálu.

Meta data se svým způsobem specifikují i pomocí dalších prvků, nejen meta – sem řadíme např. atribut title nebo elementy address, title, ins nebo del (ještě o nich bude řeč, proto nezoufejte; uvedl jsem je jen proto, abyste si nemysleli, že element meta je jediným prvkem, který specifikuje meta data v XHTML).

Další možností specifikace meta dat jsou potom různé jazyky na bázi RDF, např. Dublin Core – jejich prvky se včleňují do XHTML pomocí jmenných prostorů. Tyto jazyky jsou již ale nad rámec XHTML, proto se jimi nebudeme zabývat. Pokud se o nich chcete něco dozvědět, doporučuji vám odkazované stránky.