Podpora jazyků XHTML a CSS v moderních prohlížečích III.

28.05.2007 - PaedDr. Petr Pexa Počet zobrazení: 22294  

V tomto příspěvku si vysvětlíme termín Definice typu dokumentu (DTD), se kterým jste se setkali již v prvním dílu, seznámíme se s jednotlivými aktuálními typy DTD a upozorníme na možné problémy se zobrazením stránek bez DTD či se staršími typy DTD.

Definice typu dokumentu (DTD)

Každý správně formátovaný (a především validní) XHTML dokument by měl na začátku zdrojového kódu obsahovat tzv. xml deklaraci s použitým kódováním, např.

a pak především informaci o verzi použitého XHTML a typu DTD ( Document Type Definition ). DTD je vlastně jakýsi návod pro prohlížeč, jak má dokument zpracovat, říká mu, jaké elementy jsou v dokumentu použity a co s nimi má dělat.

Můžeme použít veřejné DTD typu PUBLIC (viz dále) nebo lokální DTD pro konkrétní dokument typu SYSTEM (použitelné především u XML dokumentů).

 

Mnohé webové stránky ale DTD vůbec neobsahují. Jednak je to proto, že mnozí tvůrci význam tohoto řádku neznají, nebo zjistili, že když ho v kódu neuvedou, nic závažného se nestane, stránka se zobrazí stejně. To ale platí pouze pro prohlížeče starší.

V testovaných nových verzí prohlížečů je již situace výrazně odlišná. V 1. dílu tohoto seriálu jste se dozvěděli, že na (ne)uvedení DTD závisí, zda se barevně zobrazí v Opeře rolovací pásy, v dalších dílech se dozvíte, že např. ve Windows Exploreru nefunguje bez DTD deklarace skvělá nová vlastnost CSS2 position:fixed, v tomtéž prohlížeči a také v Opeře 9 nefunguje bez DTD vlastnost overflow:visible, ve Firefoxu se odlišně zobrazují barevné rámečky, a tak bychom mohli ve výčtu obdobně (ne)fungujících vlastností pokračovat.

Největší problémy způsobuje tvůrcům stránek (při snaze mít ve všech prohlížečích stránky stejně zobrazené) Internet Explorer 6, který používá v závislosti na použitém DTD dokonce dva výrazně odlišné zobrazovací režimy (standardní a tzv. quirk mód ), tomuto problému se budeme věnovat v příštím dílu tohoto seriálu.

Přechodové DTD: DTD XHTML 1.0 Transitional

Základním typem je tzv. přechodová definice DTD. Ta se nejvíce přibližuje současnému standardu jazyka XHTML. Stránky s tímto typem DTD jsou velmi běžné, neboť používají vše, na co jsme zvyklí z HTML, tady např. všechny elementy i atributy jazyka HTML 4.01. Nepoužívají se však rámy (frames). V současné době se jedná o bezpochyby ideální variantu pro začínajícího webmastera, profesionál nechť si však na základě svých znalostí a zkušeností vybere jednu z následujících dvou variant.

Html je název kořenového elementu, PUBLIC určuje použití veřejného DTD na uvedené url.

Strukturu DTD pro tuto verzi jazyka XHTML si můžete prohlédnout na http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd

Striktní DTD: DTD XHTML 1.0 Strict

 

Strict (striktní) definice je určena pro stránky, jejichž autoři se rozhodli zbavit je všech pozůstatků dob minulých. Takové stránky již neobsahují žádné nedoporučované elementy ani atributy jazyka HTML. Chybí elementy a atributy, které řídí prezentaci a vzhled dokumentu (jako například element < center> či < font> ), a u některých elementů není podporován např. atribut align.

Seznam povolených elementů XHTML 1.0 Strict (resp. XHTML 1.1):

• strukturální modul - kolekce elementů definujících základní strukturu xhtml dokumentu: body, head, html, title
• textový modul - definuje základní elementy sloužící jako kontejner pro text a elementy zaměřené na obsah: abbr, acronym, address, blockquote, br, cite, code, dfn, div, em, h1 až h6, kbd, p, pre, q, samp, span, strong, var
• bidirectional textový modul - bdo
• prezentační modul - obsahuje elementy zaměřené na vzhled, které byly původně v XHTML 1.0 Strict, resp. XHTML1.1 zakázány (ale ostatní verze XHTML 1.0 je povolovaly), nakonec zůstaly tyto: b, i, big, hr, sub, sup, tt, small
• hypertextový modul - modul s jediným elementem: a
• modul seznamů - dl, dt, dd, ol, ul, li
• formulářový modul - form, input, label, select, option, textarea, button, fieldset, legend, optgroup
• modul tabulek - caption, table, td, th, tr, col, colgroup, tbody, thead, tfoot
• modul obrázků : img
• modul obrazových map - area, map
• modul skriptů - noscript, script
• modul stylů: element style, atribut style
• objektový modul - object, param
• metainformační modul - meta
• modul linků - link
• base modul - base
  
  

Vzhled stránky je tedy upraven pouze pomocí kaskádových stylů (CSS - Cascading Style Sheets).

Strukturu DTD pro tuto verzi jazyka XHTML si můžete prohlédnout na http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd

DTD pro webové dokumenty, napsané v jazyce XHML 1.1

 

Nejmodernější varianta DTD, velmi podobná XHTML 1.0 Strict, u které již byla uplatněna tzv. modularizace (viz předchozí seznam modulů), tzn. proces zařazení jednotlivých elementů do skupin podle jejich funkce v souvislosti s trendem prohlížení obsahu internetu pomocí jiných zařízení než tradičního PC (mobilní zařízení, tiskárny, hlasové syntezátory, apod.). Tato rozsáhlá sada modulů pro komplexnější tvorbu XHTML dokumentů vynechává již prakticky všechny prezentační vlastnosti (a také rámy) a formátování webu je nutné provést pouze pomocí CSS.

V XHTML 1.1 dokumentech je navíc nutné použít v hlavičce speciální MIME-type application/xhtml+xml, nelze použít tradiční text/html. Dokumenty napsané v této verzi jazyka XHTML tedy musí být uloženy přímo ve formátu XHTML (s příponou *.xhtml), ten ale zatím nepodporuje Explorer ani ve verzi 7 a je nabídnuto pouze stažení a uložení souboru, v Opeře a Firefoxu je již tento nový typ dokumentů zobrazen dobře. Také je nutné ověřit (a případně zajistit), zda hostingový server podporuje MIME type application/xhtml+xml.

 

S tímto novým formátem je, ale spojena poměrně revoluční změna v interpretaci kódu prohlížečem - jakákoliv syntaktická chyba (např. < br > místo  < br />) ve správně uloženém XHTML dokumentu již není prohlížeči tolerována (na rozdíl od HTML dokumentů), je hlášena chyba v kódu a stránka se vůbec nezobrazí.

Strukturu DTD pro tuto verzi jazyka XHTML si můžete prohlédnout na http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd

DTD s podporou rámců: DTD XHTML 1.0 Frameset

Další možná definice DTD slouží pro tvorbu stránek s rámy (frames). Je totožná s přechodovou Transitional definicí DTD, jediným rozdílem je, že v této definici nalezneme místo elementu < body> elementy < frameset> a < frame />. Tato varianta však již není doporučovaná, přestože je stále funkční i validní.

Strukturu DTD pro tuto verzi jazyka XHTML si můžete prohlédnout na http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd

DTD pro dokumenty napsané ve starším jazyce HTML 4.01

S tímto typem DTD lze na internetu najít bezpochyby stále většinu stránek. Jeho použití není chybné, splňuje požadavky na validitu kódu, ale podobně jako předchozí varianta pro rámy je již i tato zastaralá. Strukturu DTD pro tuto verzi jazyka XHTML si můžete prohlédnout na
http://www.w3.org/TR/html4/loose.dtd

DTD typu SYSTEM pro dokumenty napsané přímo v jazyce XML

 

Dokumenty napsané v jazyce XML nemají žádný standardizovaný seznam elementů, a nemůže tedy ani existovat veřejné DTD. Definici typu dokumentu si musí autor XML dokumentu vytvořit sám a uložit v externím souboru (viz 1. příklad) nebo DTD přímo deklarovat v hlavičce konkrétního XML dokumentu (viz 2. příklad) Takové DTD je označováno jako typ SYSTEM.

 

Cenik je opět název kořenového elementu, SYSTEM určuje použití lokálního DTD cenik.dtd s konkrétní definicí typu dokumentu. Nespornou výhodou tohoto řešení je možnost použití jednoho DTD na více dokumentů.

 

DTD tedy musí autor XML dokumentu sám napsat nebo lze pro jeho vytvoření použít např. program TidyGUI, který DTD k libovolnému dokumentu automaticky vygeneruje. Takto např. vypadá vygenerované DTD k následnému jednoduchému XHTML dokumentu: