Naučit se psát rozvržení CSS může být obtížné, zvláště pokud jste obeznámeni s použitím tabulek, abyste vytvořili rozvržení webových stránek. Ale zatímco HTML5 umožňuje tabulky pro rozložení, není to dobrý nápad.
Tabulky nejsou přístupné
Stejně jako vyhledávače většina čteček obrazovky čte webové stránky v pořadí, v jakém jsou zobrazeny v HTML, a tabulky mohou být pro čtečky obrazovky velmi těžké analyzovat. Je to proto, že obsah v tabulkovém uspořádání, ačkoli lineární, nemá vždy smysl, když se čte zleva doprava a zhora dolů. Navíc se vnořenými tabulkami a různými rozpětím na stole mohou buňky velmi těžko zjistit.
To je důvod, proč specifikace HTML5 doporučuje proti rozložení tabulek a proč to HTML 4.01 nepovoluje. Dostupné webové stránky umožňují více lidí, aby je používaly, a jsou známkou profesionálního designéra.
Se službou CSS můžete definovat část jako součást levé strany stránky, ale poslední místo ji umístit do HTML. Potom budou čtenáři obrazovky a vyhledávací stroje číst nejdůležitější části (obsah) nejdříve a méně důležité části (navigace) naposledy.
Tabulky jsou obtížné
Dokonce i když vytvoříte tabulku s webovým editorem, vaše webové stránky budou stále velmi komplikované a obtížně udržitelné. Kromě nejjednodušších návrhů webových stránek vyžaduje většina rozložení tabulek použití mnoha atributů a vnořených tabulek.
Vytváření tabulky se může zdát snadné, když to děláte, ale jakmile to bude hotovo, musíte ji udržet. O šest měsíců po řadě nemusí být tak snadné si vzpomenout, proč jste vnořili tabulky nebo kolik buněk bylo v řadě a tak dále. Nemluvě o tom, pokud udržujete webové stránky jako člen týmu, musíte vysvětlit všem zúčastněným, jak fungují tabulky, nebo očekávat, že budou potřebovat další čas, když budou muset provést změny.
CSS může být také komplikované, ale udržuje prezentaci odděleně od HTML a usnadňuje její údržbu v dlouhodobém horizontu. Navíc pomocí rozvržení CSS můžete napsat jeden soubor CSS a stylovat všechny vaše stránky tak, aby vypadaly takto. Poté, kdy chcete změnit rozvržení svých stránek, jednoduše změníte jeden soubor CSS a změní se celý web - nebudete muset procházet každou stránku najednou aktualizovat tabulky a aktualizovat rozvržení.
Tabulky jsou nepružné
I když je možné vytvářet rozvržení tabulky s procento šířky, jsou často pomalejší k načtení a mohou dramaticky změnit způsob, jak vypadá vaše rozložení. Ale pokud použijete specifické šířky pro vaše tabulky, skončíte s velmi tuhým rozložením, které nebude vypadat dobře na monitorech, které jsou dimenzovány jinak než vaše vlastní.
Vytváření flexibilních rozvržení, které vypadají dobře na mnoha monitorech, prohlížečích a rozlišeních, je relativně snadné. Ve skutečnosti, s dotazy médií CSS, můžete vytvořit samostatné návrhy pro různé obrazovky velikosti.
Vnořené tabulky se načítají pomaleji než CSS pro stejný návrh
Nejčastějším způsobem, jak vytvořit fantazii s tabulkami, je tabulka "hnízdo". To znamená, že jedna (nebo více) tabulka je umístěna uvnitř jiného. Čím více tabulek jsou vnořeny, tím déle trvá, než webový prohlížeč vykreslí stránku.
Ve většině případů rozložení tabulky používá více znaků než návrh CSS. A méně znaků znamená méně stahování.
Stoly mohou ublížit Search Engine Optimization
Nejčastějším uspořádáním tabulky je navigační lišta na levé straně stránky a hlavní obsah vpravo. Při použití tabulek toto (obecně) vyžaduje, aby první obsah, který se v HTML zobrazuje, byl levý navigační panel. Vyhledávače kategorizují stránky na základě obsahu a mnoho motorů určuje, že obsah zobrazený v horní části stránky je důležitější než jiný obsah. Takže stránka s levou navigací nejprve bude mít obsah, který je méně důležitý než navigace.
Pomocí CSS můžete nejdříve vkládat důležitý obsah do vašeho HTML a pak pomocí CSS určit, kde by měl být umístěn v návrhu. To znamená, že vyhledávače uvidí nejdůležitější obsah, a to i v případě, že návrh umístí dolů na stránku.
Tabulky ne vždy tisknout dobře
Mnoho návrhů stolů nevytiskne dobře, protože jsou pro tiskárnu příliš široké. Aby se tak stalo, prohlížeče budou tabulky vypínat a tisknout níže, což vede k velmi nesourodým stránkám. Někdy skončíte se stránkami, které vypadají dobře, ale chybí celá pravá strana. Jiné stránky budou tisknout oddíly na různých listech.
Pomocí služby CSS můžete vytvořit samostatný stylový list pouze pro tisk stránky.
Tabulky pro rozložení jsou neplatné v HTML 4.01
Specifikace HTML 4 uvádí: "Tabulky by neměly být používány čistě jako prostředek k rozvržení obsahu dokumentu, protože to může představovat problémy při vykreslování na neviditelná média."
Takže pokud chcete napsat platný HTML 4.01, nemůžete použít tabulky pro rozložení. Měli byste používat tabulky pouze pro tabulková data a tabulková data obecně vypadají jako něco, co byste mohli zobrazit v tabulce nebo případně v databázi.
Nicméně HTML5 změnila pravidla a nyní tabulky pro rozvržení, ačkoli se nedoporučuje, jsou nyní považovány za platné HTML. Specifikace HTML5 uvádí: "Tabulky by se neměly používat jako pomůcky pro rozvržení." Je to proto, že tabulky pro rozvržení jsou pro čtečky obrazovky obtížné rozlišovat, jak bylo zmíněno výše.
Použití CSS k pozici a rozvržení vašich stránek je jediným platným způsobem HTML 4.01, jak získat návrhy, které jste použili při vytváření tabulek, a HTML5 důrazně doporučuje tuto metodu také.
Tabulky pro rozvržení mohou ovlivnit vaše pracovní vyhlídky
Jak se stále více nových návrhářů naučí HTML a CSS, vaše dovednosti při sestavování tabulek budou stále méně a méně náročné. Ano, je pravda, že zákazníci obvykle neříkají přesnou technologii, kterou byste měli používat k vytváření svých webových stránek, ale požadují věci jako:
- Dostupné webové stránky: návrhy, které lze prohlížet čtenáři obrazovky, jsou pověřovány mnoha zeměmi a podniky každodenně vyhledávají dostupnost stále důležitější.
- Údržitelné webové stránky: návrhy, které mohou s sebou vzít, i když nebudete v budoucnu udržovat.
- Flexibilní konstrukce: návrhy, které fungují v mnoha prohlížečích, rozlišeních a zařízeních.
- Rychlé stahování stránek: rychlost je čím dál důležitější, dokonce i pro SEO.
- Tisknutelné návrhy: stránky, které tisknou bez zvláštních skriptů nebo dalších stránek.
Nemůžete-li doručit to, co zákazníci požadují, přestanou na vás přicházet za designy - období. Můžete opravdu dovolit nechat své podnikání trpět, protože nejste ochotni se učit a začlenit techniku, která byla používána od konce devadesátých lét?
The Moral: Naučte se používat CSS
CSS může být obtížné se učit, nicméně stojí za to úsilí. Nesnažte se stagnovat. Naučte se CSS a vytvořte své webové stránky tak, jak byly navrženy - pomocí CSS pro rozložení.
