Přeskoč navigaci

Zde hledá Jyxo.

Jyxo

Jak funguje deklarace DTD

Martin Kopta, vydáno/aktualizováno: 16.7.2002/28.07.2002

Zásadní chybou všech knih pro začátečníky ve webdesignu je opomíjení základního kamene (X)HTML – tím je DTD, tedy Definice Typu Dokumentu. Hned poté, kdy nováčkovi vysvětlíte, jak HTML funguje, že se skládá ze značek (tagů) a jejich vlastností (atributů), měli byste hned přikročit k vysvětlení, že HTML se řídí normami, jež jsou definovány v DTD.

V dnešním článku si řekneme něco o deklarování dokumentu, tedy o odkazování na jeho DTD. V příštím díle si vysvětlíme základy čtení DTD.

Rozehřívací ukázka

Nejde jen o nějaké bezduché dodržování standardů. Hned vám ukážu, že správné užití deklarace DTD může mít zásadní vliv na zobrazení dokumentu v prohlížeči.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <title>Ukázka práce s DTD</title>
    <style type="text/css">
      body {
        background-color: yellow;
      }
      div {
        margin: auto 50px;
        width: 300px;
        border: 10px solid red;
        background-color: black;
        color: yellow;đ
      }
    </style>
  </head>
  <body>
    <div>Ukázka práce s DTD</div>
  </body>
</html>

Zkuste si nyní výše uvedený příklad otevřít v MSIE 6. Udělejte si otisk obrazovky a přidejte před <html> deklaraci DTD:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Opět si udělejte otisk obrazovky a oba příklady porovnejte.

Co zjistíte?

Podle dokumentace k MSIE 6, by v prvním případě měl být <div> zarovnaný vlevo a šířka bloku bude 480 pixelů, protože 10 + 10 px připadá na sílu tahu rámečku. To je samozřejmě v přímém rozporu s definicí vzhledu v CSS. V druhém případě bude už šířka správná a blok bude navíc správně zarovnán na střed (margin: auto;).

Dokud se pohybujeme na půdě HTML, pak o moc nejde. V okamžiku, kdy se pustíte do XHTML nebo XML obecně, riskujete, že se dokument nezobrazí vůbec, pokud nebude přísně dodržovat normu předepsanou v DTD.

Deklarace typu dokumentu

Na DTD se v dokumentech HTML a XML odvoláváme prostřednictvím deklarace <!DOCTYPE>, která musí být ve zdrojovém textu XML uvedena hned za deklarací XML <?xml version="1.0" ?> a u dokumentů HTML jako první.

Deklarace typu dokumentu má ustálený tvar. Za <!DOCTYPE následuje mezera a základová značka následujícího dokumentu. U XHTML je důležité, že je psána malými písmeny <!DOCTYPE html.

Pokud používáme obecně známý typ dokumentu, jako jsou HTML, XHTML, WML, NewsML, MathML a podobně, použijeme veřejnou deklaraci – za základovou značkou po mezeře následuje slovo PUBLIC a veřejný identifikátor:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN">

Pomlčka na začátku znamená, že DTD nebyla registrována u oficiální standardizační organizace a jedná se tedy o průmyslový standard. Na tom místě může být uvedeno ISO 8879:1986 jako v případě ISO HTML 4.0, které se poněkud liší od W3C HTML 4.0. Pokud je Identifikátor registrován jinou organizací, může začít jejím prefixem, nebo znamínkem + (plus). Za // následuje název původce standardu, za dalším // je název standardizovaného typu dokumentu a po posledním // následuje ISO zkratka pro jazyk, v němž je definice sepsána (takže tam nepište //CS, pokud zároveň nepřepíšete i celé DTD do češtiny).

Existují i jiné typy identifikátorů. U nich se používají URN:

<!DOCTYPE NewsML PUBLIC "urn:newsml:iptc.org:20001006:NewsMLv1.0:1">

Za identifikátorem by měl, ale nemusí následovat URL uložení DTD. Na uvedeném URL si prohlížeč vyzvedne DTD v případě, že ji ještě nemá ve svém katalogu, takže doporučuji URL nevynechávat.

Druhým typem jsou DTD, které nejsou obecně známé, a proto nelze předpokládat, že budou uloženy v katalogu prohlížeče předem. U těchto deklarací se neuvádí veřejný identifikátor, ale pouze odkaz na uložení DTD. Odkaz může být relativní vůči umístění aktuálního dokumentu, nebo absolutní odkaz, který se více hodí pro soubory umístěné na Webu.

Aby se odlišily veřejné definice od systémových, označují se slovem SYSTEM. Příkladem za všechny může být DocBook, což je velmi rozšířený formát pro rukopisy knih (a existuje pro něj i veřejný identifikátor).

<!DOCTYPE DocBook SYSTEM "./docbookx.dtd">

Poslední možností je vepsat DTD přímo do dokumentu. To se hodí pro krátké definice jednoduchých dokumentů, jako je následující ukázka definice XML dokumentu pro zápis genealogického vývodu.

<!DOCTYPE vyvod [
  <!-- zakladovy prvek -->
  <!ELEMENT vyvod (potomek+)>
  <!-- oznaceni muzskeho potomka -->
  <!ELEMENT potomek ((jmeno, prijmeni)?|(potomek)+)+>
  <!-- data narozeni a umrti -->
  <!ATTLIST potomek
    narozen NMTOKEN #REQUIRED
    zemrel NMTOKEN #REQUIRED
  >
  <!ELEMENT jmeno (#PCDATA)>
  <!ELEMENT prijmeni (#PCDATA)>
]>

Za takovou definicí by mohl následovat třeba tento dokument:

<vyvod>
  <potomek narozen="1906-02-07" zemrel="1976-09-21">
    <jmeno>Jaromír</jmeno>
    <prijmeni>Vomáčka</prijmeni>
    <potomek narozen="1945-11-03" zemrel="">
      <jmeno>Karel Jaromír</jmeno>
      <prijmeni>Vomáčka-Eberhardt</prijmeni>
    </potomek>
  </potomek>
</vyvod>

Už jen pro samotné HTML existuje mnoho DTD. Na deklaraci některých z nich se můžete podívat v dokumentaci Mozilly:

Samotné DTD se liší podle toho, zda jde o definice HTML nebo XML. Pro XML jsou trochu zjednodušeny, protože syntaxe dokumentů XML je přísnější (například, že všechny otevřené kontejnery musejí být uzavřeny) a není toho tolik třeba definovat pro jednotlivé typy dokumentů. O tom si ale povíme jindy.

Související články

Tato stránka je přístupná libovolným prohlížečem, nejlépe však vypadá v prohlížeči, který podporuje HTML 4.0 a CSS 2 (Internet Explorer od verze 5, Mozilla, Opera a další). Pokud čtete tuto zprávu, váš prohlížeč zřejmě dostatečně nepodporuje CSS. Stránku sice vidíte bez pokročilejšího formátování, avšak veškerý obsah je plně přístupný i pro vás.