Strategie použití CSS - 2. část
(Ukázka z knihy CSS Kaskádové styly pro webdesignéry)
Veškeré formátování s výjimkou rozmístění (layoutu) prvků
Jedná se o zajímavou strategii, která umožňuje velmi efektivní využití kaskádových stylů již nyní, kdy ještě část používaných prohlížečů (IE4/Win, NN4) nenabízí dostatečnou podporu CSS. Základní princip spočívá v rozvržení prvků na stránce pomocí jednoduché tabulky, zatímco veškeré ostatní formátování je řízeno externím stylovým předpisem.
V ideálním případě nedochází ke vnořování tabulek. Například, pro rozdělení stránky na tři sloupce se použije jediná tabulka s jedním řádkem a třemi buňkami. Tyto buňky pak již mohou obsahovat strukturálně čistý HTML kód, podle potřeby případně doplněný prvky DIV v roli kontejnerů funkčně a strukturálně vymezených částí obsahu. Občas se sice vnořování tabulek nelze vyhnout, mělo by však být používáno spíše výjimečně a pouze tehdy, když neexistuje jiné řešení.
Poznámka: Z důvodů vyšší kompatibility se staršími prohlížeči, zejména NN4, se někdy doporučuje automaticky vkládat <div> do každé buňky tabulky a styly pak prostřednictvím tříd či ID vázat na tyto DIVy místy prvky <td>.
Při důsledné aplikaci této metody již obvykle nic nebrání tomu, aby byl zdrojový HTML kód plně validní, tj. respektoval platné standardy. K dosažení širší kompatibility, resp. vyšší shody vzhledu v různých prohlížečích je vhodnější volit některé z přechodných norem, tj. HTML 4.0 Transitional, nebo XHTML 1.0 Transitional.
Výhody
Oproti předchozí koncepci dochází k výrazným úsporám délky zdrojového kódu HTML dokumentu, a tedy k rychlejšímu načítání stránek i při pomalém připojení k Internetu.
Zdrojový kód HTML dokumentu je ve srovnání s předchozí koncepcí mnohem přehlednější a logicky strukturovanější. Úpravy kódu jsou snazší, bez rizika náhodných chyb.
V tomto modelu již lze uplatnit i logické strukturování stylových předpisů pomocí kontextových selektorů. Samotný stylový předpis se tím stává přehlednější a snáze modifikovatelný.
Na celém webu lze snadno udržovat a měnit formátování prvků řízené stylovým předpisem, tj. např. typ písma běžného textu, nadpisů, zvýrazněného textu atd. Pouze stylovým předpisem lze kontrolovat i barvu písma a pozadí funkčně vymezených ploch (např. sloupců, zvýrazněných boxů atd.).
Do určité míry již lze využít alternativních stylových předpisů např. pro tisk či pro personalizaci vzhledu stránek.
Při úsporném využití tabulek bez většího vnořování dochází ke zvýšení přístupnosti dokumentů pro zrakově postižené uživatele a stránky dosahují lepších výsledků ve fulltextových vyhledavačích.
Nevýhody
Při pevných šířkách tabulek tvořících základní rozvržení dokumentu přetrvává snížená přístupnost dokumentu zařízeními s malým displejem (palmtopy, mobilní telefony).
Pomocí alternativních stylových předpisů nelze příliš měnit rozmístění a zobrazení prvků dokumentu, takže např. v tisku většinou nelze vypustit zbytečné části obsahu.
Ve srovnání s předešlou koncepcí nelze vždy dosáhnout shodného vzhledu ve všech běžných prohlížečích. V NN4 např. může chybět orámování částí stránky a mohou se lišit svislé i vodorovné odstupy prvků (odstavců, nadpisů, sloupců).
Tato strategie od webdesignéra vyžaduje rozsáhlejší znalosti CSS a velmi pečlivé testování stránek v různých prohlížečích, včetně starších verzích.
Toto je ukázka z knihy Marka Prokopa CSS Kaskádové styly pro webdesignéry, kterou vydalo nakladatelství Mobil Media a.s. v roce 2003. Knihu si od nás můžete objednat za 280 Kč.
- O knize CSS Kaskádové styly pro webdesignéry
-
Ukázky z knihy
- Obsah knihy
-
Strategie použití CSS - úvod
- obohacení formátovacích možností
- veškeré formátování s výjimkou rozmístění (layoutu) prvků
- formátování jen pomocí CSS, včetně rozmístění prvků
- Vlastnost
float - Vlastnost
padding
- Objednávka
