CSS Kaskádové styly - Kompletní průvodce

14. 3. 2003 | Vlastimil Ott | Recenze | 4889×

Recenze knihy Petra Staníčka.

Kniha, kterou jsem si nedávno koupil a jejíž recenzi vám předkládám, vyšla na počátku letošního roku v nakladatelství Computer Press. Hledal jsem nějaký titul, který by mně podrobně objasnil všechna zákoutí CSS stylů (a že jich je!) a vysvětlil mně, jak styly efektivně, a především korektně využívat. Chci, aby stránky, které vytvářím, měly stejnou hodnotu se styly i bez nich. Na tento fakt klade důraz i sám autor této příručky.

Na úvod si řekněme, jak je téma v knize zpracováno, resp. rozděleno do kapitol. Je jich celkem pět plus rejstřík, jehož absence je v tomto typu literatury nemyslitelná. Kapitoly jsou bohatě členěny do podkapitol a ty ještě hlouběji. Autor čtenáři na začátku představí ukázkovou stránku firmy Vonásek&Vocásek, která se zabývá obchodem se šroubky. Stránka je tvořena různými nestandardními konstrukcemi jazyka HTML a autor ji doslova před našima očima vnitřně přetváří pomocí kaskádových stylů. Stránka tedy zůstává vizuálně stejná, mění se však její struktura, která má - podle autora, odpovídat normě. Při tomto přepracovávání autor počítá i s nedostatky jednotlivých prohlížečů.

Nedá mi to, abych zde nevysekl poklonu: autor si dal tu práci a stránku vytvářel tak, aby vypadala v každém z nejrozšířenějších prohlížečů co možná nejlépe. Záměrně nepíšu "v každém stejně", protože Petr Staníček stránku píše tak, aby se dala korektně a čitelně prohlížet i Linksem (Lynxem). Pročtením knihy jsem došel k závěru, že autor stránku (a všechny vlastnosti CSS) testoval v prohlížečích Internet Explorer na platformě Windows (verze 4, 5, 5.5, 6) a Macintosh (4 a 5), Netscape Navigator/Mozilla (4.x, 6/1, všechny platformy), Opera (4, 5 Windows) a již zmíněném Linksu (pochopitelně jen jako kontrolu "čitelnosti" ukázkové stránky ). Oceňuji tedy například i to, že sejmuté náhledy pocházejí z Mozilly a ne jen z IE, jak bývá obvykle zvykem, zejména u autorů píšících pro Computer Press.

První kapitola

První kapitola se nečekaně jmenuje "Úvod" a zasvěcuje čtenáře do historie vývoje CSS, jejich začleněním do HTML dokumentů, problémy s implementací standardů v různých prohlížečích a také se zabývá otázkou, kterou linuxáci určitě dobře znají: A jak prosím tě udělám tohle a tohle s tím CSS?! (Podobnost situace při přechodu na Linux je čistě náhodná)

Druhá kapitola

Druhá kapitola se jmenuje "Formátování s CSS v kostce" a je vstupním seznámením s vlastnostmi CSS. Autor klade důraz na fakt, že je nutné v dokumentech odlišovat logickou strukturu od vizuálního ztvárnění, což je ostatně i principem normy HTML 4.0, XHTML, XML a CSS. V této kapitole je nastíněno základní použití stylu v dokumentech, konkrétně vytvoření tabulky stylů (včetně rozlišování mezi pravidly, prvky, selektory), aplikování vlastností textu, formátování bloků stránky a základní vlastnosti prvků.

Třetí kapitola

Ve třetí kapitole se čtenář podívá "pod kapotu CSS"; seznámí se s definicemi a použitím CSS v dokumentech HTML, XHTML a XML a úrovní podpory CSS v různých prohlížečích. Další témata jsou syntaxe CSS, hodnoty a jednotky, média v CSS (např. zvukový výstup, výstup v Braillově písmu, výstup pro kapesní počítač, tiskárnu, promítané prezentace, obrazovku počítače, televizní obrazovku a terminál). V této části autor vysvětluje (požadovanou) logickou strukturu dokumentu, dědičnost, kaskádovost (tedy důvod, proč mají styly toto slovo v názvu), vizuální formátovací model CSS (princip, jakým je výsledná stránka skládána a zobrazována) a tabulky a jejich formátování.

Čtvrtá kapitola

Následující kapitola, "Přehled funkcí a vlastností CSS", je možná nejpraktičtější ze všech. (Ne, že by ty předchozí zajímavé nebyly.) Obsahuje vyčerpávající přehled všech vlastností jednotlivých prvků. Ve zkratce: kompatibilita v prohlížečích, obecné funkce CSS, vlastnosti rámů, formátování řádkových prvků, vlastnosti pozadí, generovaný obsah a seznamy, vlastnosti tabulek, stránkování a způsob, jak je ovlivňovat, vlastnosti zvukových stylů. Jestliže se předchozí kapitoly vázaly k ukázkové stránce, je tato kapitola obecnějšího charakteru. Obsahuje cca 80 (!) tabulek dvojího druhu.

Tabulky vlastností

V prvním typu nalezne čtenář vlastnosti všech prvků, konkrétně následující informace:

• hodnota
• výchozí hodnota (snad poprvé nenacházím v odborné literatuře slovo "default" nebo "defaultní" )
• zda lze použít procenta pro stanovení rozměrů (velice praktická informace)
• zda se vlastnost dědí od rodiče
• na které prvky se vlastnost aplikuje
• na která média se vlastnost aplikuje

Podpora vlastností v konkrétních prohlížečích

Ve druhém typu tabulek, a teď se drž, milý čtenáři, nalezneme zobrazení podpory jednotlivých vlastností včetně konkrétních (!) hodnot v daných prohlížečích s patřičným komentářem. Zní to neuvěřitelně, ale je to tak. Například vlastnost rámů Obtékání má následující úspěšnost u jednotlivých prohlížečů:

Obtékání	IE Win 4	IE Win 5	IE Win 5.5	IE Win 6	IE Mac 4	IE Mac 5	NN/Mo 4	NN/Mo 6	Opera 4	Opera 5
float	chybně	chybně	?	?	?	?	chybně	?	?	?
left	chybně!	chybně!	ok	ok	ok	ok	chybně!	ok	ok	ok
right	chybně!	chybně!	ok	ok	ok	ok	chybně!	ok	ok	ok
none	ok	ok	ok	ok	ok	ok	ok	ok	ok	ok

Legenda: "chybně" znamená, že prohlížeč funkci zpracovává s chybami, "chybně!" je na hranici zhroucení prohlížeče, "?" znamená, že prohlížeč příkaz realizuje nepředvídatelně (podle situace) a "ok" znamená, že prohlížeč funkci zpracovává správně, tj. podle standardu. Mimochodem, z tohoto srovnání nejhůře vycházejí "čtyřkové" verze prohlížečů Internet Explorer a Netscape Navigator. Mozilla se drží na špici.

Tato tabulka je pouze výsekem jedné z tabulek ve čtvrté kapitole. Vývojář tak dostává do ruky kompletní referenci a ví, jak jeho stránky budou vypadat v tom či onom prohlížeči. Divím se, že autor nenapsal na úvod, že děkuje své manželce/ přítelkyni za trpělivost (jak to dělávají "západní" autoři). Já bych u takového srovnávání dostal infarkt. 8-D

Pátá kapitola

Poslední kapitola se jmenuje Praxe. Staníček se věnuje konkrétním radám při vytváření CSS dokumentů: máme zapomenout na "čtyřky" (čili na výše zmíněné verze IE a NN), které považuje za prohlížeče neschopné korektně zobrazit dokument formátovaný CSS. Dále se zmiňuje o dynamickém HTML a, jak to tak v našich počítačích bývá, také o CSS v českém prostředí. Uvádí typická písma systémů Windows a způsob, jak dosáhnout stejného zobrazení dokumentu napříč platformami. Praktickým doplňkem je také tabulka stylů HTML 4.0 (čili přednastavených hodnot). Na poslední straně kapitoly najdeme internetové odkazy na normy a standardy nejen konsorcia W3. Všechny příklady uvedené v knize lze najít na adrese vydavatelství Computer Press.

Verdikt

Z knihy jsem nadšený. Jednak mám pocit, že jsem nevyhodil peníze z okna, ale hlavně vím, že jsem získal kvalitní, výborně zpracovanou a aktuální (!) referenční příručku. Za zmínku také stojí odkazy, které se objevují v určitých místech a směřují čtenáře k podrobnostem (včetně udání stránky). Možná to lze však místy chápat jako nevýhodu: ze začátku se mi zdál text roztříštěný. Ale praktickým používáním jsem dospěl k závěru, že pokud hledám vlastnost a její hodnotu, mám nalistovat kapitolu čtvrtou. Kniha obsahuje i několik diagramů a schémat, která pochopitelně pomáhají porozumění (zejména "skládání" prvků do výsledné podoby). Osobnost autora (webmaster vydavatelství Ringier a autor stránek blesk.cz, reflex.cz, abicko.cz, autor manifestu Dogma W4) zaručuje, že kniha má vysokou užitnou hodnotu, která je navíc umocněna ještě faktem, že jsem nenarazil na žádné gramatické chyby nebo překlepy (jak to tak v našich knihách nebývá). Neváhejte.

Autor:	Petr Staníček
Nakladatelství:	Computer Press
Cena:	197,- Kč / 295,- Sk
Datum vydání:	2003
Počet stran:	192

 

Odkazy a zdroje

Computer Press: CSS Kaskádové styly - Kompletní průvodce

       

Komentáře

[unchallenger]

Vývojář tak dostává do ruky kompletní referenci a ví, jak jeho stránky budou vypadat v tom či onom prohlížeči. Neví. Nakonec se to stejně musí vyzkoušet. Je dobře, když má člověk takové tabulky k disposici, protože těch překvapení pak ubyde, ale vyhnout se jim úplně nejde.

[Vlastimil Ott]

No jasne, ze nevi. Ale muze temer "vedet". Pochopitelne je treba videt to v prohlizeci, ale kdyz ma clovek pred sebou tabulku, kde je napsano, co ktery prohlizec (ne)umi, tak s tim uz pocita. --vo

[lukas :)]

chápu, že vytvoření knihy asi nějakou dobu trvalo, ale docela mi tam chybí moje oblibená Opera v novějších verzích, tj 6 a 7 ... podle mých zkušeností se ve většině věcí (v poslední verzi) vyrovná Mozille nebo IE. Jinak ta kniha je super, už ji mám přelouskanou, pochopil jsem z ni třeba stylování tabulek (propracované), kontextové selektory a mnoho dalšího ...

[Víťa Kápička]

Kdysi dávno jsem překládal normu jazyka CSS 1, je to k vidění tu: http://vitakappa.hyperlinx.cz/texts/html/index.html

[theo]

prehledl jsem to, nebo jste nikde neuvedl, kolik ma kniha stran a kolik stoji? myslim, ze to jsou docela zajimave/dulezite informace...

[Vlastimil Ott]

Tyto informace čtenář získá, pokud klikne na odkaz pod článkem (stránka nakladatelství). --vo

[Leoš Literák]

naprosto souhlasim. pokud tam tato tabulka chybi, jedna se o chybu a napravime ji v nejblizsim moznem terminu.