Jiří Kosek ml.
Uplynulo o něco málo více než rok od doby, kdy byly kaskádové styly první úrovně (CSS1) přijaty jako doporučení W3C konsorcia -- tedy de facto jako standard. Poslední verze prohlížečů již podporují většinu vlastností CSS1.
I přesto se však se stránkami, které využívají možnosti stylů, setkáme na Internetu poměrně zřídka. Je to tím, že ve starších prohlížečích bez podpory stylů vypadají tyto Weby poněkud chudě. Efekty, které lze dosáhnout jednoduchým a krátkým stylem, se proto do stránek ještě pořád vkládají jako velké obrázky, jejichž přenos značně zatěžuje přenosovou kapacitu Internetu a zpomaluje načítaní stránky.
Poněkud paradoxní pak někomu může připadat zveřejnění návrhu nové verze kaskádových stylů v době, kdy kaskádové styly nemají příliš velkou podporu u tvůrců stránek. Kaskádové styly druhé úrovně (CSS2) jsou však zcela zpětně kompatibilní se starší verzí a standardizují nové vlastnosti, jejichž vznik si již vyžádala praxe.
Než se podíváme na jednotlivé novinky, stručně si ještě připomeneme, co to kaskádové styly jsou. Jedná se o způsob umožňující pro každý element na webové stránce definovat mnoho jeho vizuálních atributů -- barvu, druh použitého písma, způsob zarovnání apod. Při tvorbě stránek pak pomocí tagů vyznačujeme strukturu dokumentu -- konkrétní vzhled jednotlivých elementů je však určen stylem. Kromě výhod, které přináší oddělení struktury dokumentu od definice vzhledu, přináší styly úsporu místa a umožňují snadnější modifikace vzhledu stránky nebo celých skupin stránek dohromady.
Podpora více médií
Sami jistě víte, že obrazovka a tiskárna jsou 2 zcela odlišná výstupní zařízení. Pokud něco vypadá pěkně a čitelně na obrazovce, nemusí to již tak dobře dopadnout po vytištění. Příkladem je třeba správná volba řezu písma. Na obrazovce jsou dobře čitelná bezpatková písma (Arial, Helvetica), pro tisk se však mnohem lépe hodí patková písma (Times), protože patky přirozeným způsobem vedou oko čtenáře po řádku z jednoho konce papíru na druhý.
CSS2 umožňují v jednom stylu definovat některé vlastnosti odlišně pro různá výstupní zařízení. Podporovány jsou následující typy výstupních zařízení: hlasové syntetizátory, on-line zobrazovače Braillova písma, tiskárny Braillova písma, malé obrazovky (PDA), tiskárny, slide pro zpětné projektory, obrazovky, znakové terminály a televizní obrazovky.
Kromě nejběžnější potřeby odlišit způsob zobrazení na obrazovce od tisku je kladen velký důraz na usnadnění výstupu pro uživatele s různými postiženími a na podporu zařízení s menší rozlišovací schopností (např. WebTV).
Typ média nemusí být určen jen v kaskádovém stylu. Při připojování stylu k HTML dokumentu nyní můžeme určit typ média, pro který je styl určen. Prohlížeč sám zvolí vhodný styl podle toho, zda chceme dokument zobrazit na obrazovce nebo např. vytisknout.
Podpora médií se stránkovaným výstupem
Při tisku HTML dokumentu musí prohlížeč rozdělit výstup do několika stránek. Tento úkol vypadá na první pohled jednoduše, ale v praxi přináší mnoho obtíží. Největším problémem je právě nalezení vhodného místa pro zalomení strany. Jistě se vám stalo, že se při tisku webové stránky objevil stránkový zlom uprostřed obrázku, tabulky nebo bezprostředně za nadpisem.
Některé z těchto problémů pomáhají prohlížeči vyřešit právě nové vlastnosti přidané do CSS2. U každého elementu nyní můžeme specifikovat, zda se před či za ním stránka musí, může nebo nesmí zalomit. Obvyklé je tedy takové nastavení, které zakáže zalomení strany za všemi nadpisy a naopak jej před všemi nadpisy umožní.
Dále můžeme nastavit minimální počet řádků jednoho odstavce na konci nebo na začátku stránky. Tím lze zamezit vzniku tzv. sirotků a vdov při tisku.
Můžeme nastavit i velikost a orientaci papíru, oboustranný tisk, okraje zvlášť pro první stranu a pro všechny levé a pravé strany. Stylem lze ovlivnit i tisk ořezových a pasovacích značek.
Vlastnosti pro hlasové syntetizátory
Hlasové syntetizátory nejsou zatím zcela běžným doplňkem každého počítače, ale CSS2 pro ně již nabízí celkem dobrou podporu. Pro každý element můžeme nastavit mnoho vlastností. Vyberu jen některé z nich: velikost prodlev, sílu a tón hlasu, druh hlasu (muž, žena, dítě), hlasitost, směr odkud hlas přichází atd. Nastavit lze například i to, zda se bude obsah elementu číst nebo hláskovat. To je velmi užitečné, zvlášť když v HTML 4.0 existují elementy právě pro označení zkratek.
Vylepšená práce s fonty, download fontů
Předchozí verze stylů umožňovala poměrně přesně specifikovat druh písma, který chceme použít pro zobrazení konkrétního elementu. Pokud však daný řez písma nebyl v systému k dispozici, použil se v podstatě libovolný jiný řez písma. CSS2 přinášejí v této oblasti mnohá zlepšení.
Pomocí selektoru @font-face lze definovat vlastní řezy písma. U každého řezu můžeme definovat jednak název písma, pod kterým se bude řez hledat přímo v systému. Kromě toho lze definovat URL adresu, z které se daný řez může stáhnout. Protože se dnes používá několik formátů fontů, lze u URL určit formát, ve kterém je písmo uloženo. Prohlížeč se pak nesnaží stahovat písma ve formátech, kterým nerozumí.
Největší zajímavostí je však možnost zapsat u každého vlastního řezu základní charakteristiku, která se skládá z určení rodiny, varianty, stylu, duktusu a velikosti písma. V charakteristice můžeme navíc určit i sílu vertikálních a horizontálních tahů písma, sklon a velikost jednotlivých dotažnic. Pokud prohlížeč nemá k dispozici definovaný řez v systému a ani se mu nepodaří písmo nahrát z Internetu, použije nainstalovaný font, který svými parametry nejlépe odpovídá zadané charakteristice. Dosáhneme tak překvapivě dobré věrnosti zobrazení, i pokud požadovaný font není přímo k dispozici.
Tabulky
CSS2 nově přidávají vlastnosti pro formátování tabulek. Tato část návrhu však ještě není zdaleka ve finální podobě.
Vlastnosti pro řízení pozice
Vlastnosti pro řízení pozice umožňují pro každý element určit jeho přesnou polohu na obrazovce. Tento rys již dnes podporují prohlížeče Netscape Communicator a Internet Explorer, protože je to jeden ze základních kamenů dynamického HTML.
Kromě pozice lze určit i pořadí elementů, které se překrývají, a tím ovlivňovat jejich viditelnost.
Selektory
Selektor slouží v kaskádových stylech k určení elementů, na které se budou daná pravidla stylu aplikovat. V nové verzi stylů byly možnosti selektorů podstatně rozšířeny.
CSS1 umožňovaly použití kontextového selektoru X Y, který platnost pravidla omezil na elementy Y obsažené v elementu X. Nyní můžeme použít i selektor X > Y, který pravidlo aplikuje na elementy Y obsažené pouze přímo v elementu X.
Nový pseudoelement X:first-child aplikuje pravidlo pouze na první element obsažený v elementu X.
Pokud chceme, aby se pravidlo aplikovalo na element Y, který bezprostředně následuje za elementem X, můžeme použít nový selektor X + Y.
Novinkou jsou selektory, které pracují na základě obsahu atributů. Selektoru X[z] vyhovují všechny elementy X, které mají na nějakou hodnotu nastaven atribut z. Pokud chceme pravidlo aplikovat pouze pro určitou hodnotu w atributu z, použijeme selektor X[z=w]. Poslední nová varianta selektoru má tvar X[z~=w]. Oproti předchozí variantě nyní stačí, aby hodnota atributu obsahovala slovo w.
Automatické číslování
Návrh počítá s tím, že ve stylu půjde definovat několik čítačů. Čítače pak můžeme využít např. pro automatické číslovaní nadpisů, obrázků nebo tabulek. Kromě samotného obsahu čítače můžeme před nebo za element připojit libovolný text (např. "Tabulka č.").
Kaskádové styly a XML
Zatímco CSS1 byly úzce svázány s jazykem HTML, nyní můžeme CSS2 použít i jako stylový jazyk pro XML (eXtensible Markup Language). Hlavně kvůli XML byly do CSS2 přidány selektory, které umožňují reagovat na obsah atributů.
V blízké době bude velice zajímavé sledovat oblast stylových jazyků pro XML. Dnes totiž existují nejméně 3 stylové jazyky, které je možno společně s XML použít. Kromě CSS2 se jedná o DSSSL a XSL.
DSSSL (Document Style Semantics and Specification Language) je poměrně složitý stylový jazyk a proto se asi neuplatní v internetových aplikacích XML. Jeho výsadní postavení však bude v oblastech s vysokými nároky na typografickou úroveň výstupu. Za pár let se s ním tedy nejspíše setkáme v různých publikačních systémech založených na XML. Na Internetu se může uplatnit speciálně podmnožina DSSSL zjednodušená právě pro potřeby elektronických dokumentů.
Novinkou je XSL (eXtensible Stylesheet Language), stylový jazyk navržený speciálně pro potřeby XML. Vytvořila jej firma Microsoft společně s několika dalšími společnostmi, které se zabývají elektronickým publikováním (např. ArborText). Nyní se čeká na to, jak se k návrhu vyjádří ostatní členové W3C konsorcia.
XSL vychází z DSSSL, ale vše je zde přizpůsobeno potřebám Internetu. Samotný styl XSL se zapisuje v jazyce XML. Zajímavé je, že v XSL lze používat skripty zapsaná v jazyce ECMAScript, což je standardizovaná verze JavaScriptu. Je to o to zajímavější, když si uvědomíme, že Microsoft jinak preferuje Visual Basic.
Přestože je XSL teprve v plenkách, již nyní existuje několik programů, které jej podporují. Jednak je to komponenta ActiveX od Microsoftu, která umožňuje zobrazení XML dokumentů zformátovaných podle XSL. Dalším příkladem může být XML Styler od ArborTextu, který umožňuje vytváření XSL stylů bez znalosti syntaxe tohoto jazyka.
Závěr
O tom, jak rychle se CSS2 stane běžně používanou technologií, rozhodne především podpora prohlížečů. Již dnes jsou některé z novinek v CSS2 podporovány Netscape Communicatorem i Internet Explorerem.
Návrh CSS2 naleznete na adrese http://www.w3.org/TR/WD-css2.