Tento článok popisuje výhody použitia beztabuľkového layoutu v HTML. Ak robíte layout v tabuľkách tak je na čase prestať a byť trochu praktickejší.
Aký je to tabuľkový layout?
Tabuľkový layout je tvorený tagmi <table>, <td>, <tr>, a inými… Čo je na tom zlé? Práve to, že už z názvu je jasné že tabuľka je tabuľka a teda tabuľkový layout výhradne používať na zobrazovanie tabuľkových údajov.
Čo je na tom zlé keď to vyzerá oproti beztabuľkovému layoutu rovnako?
To, že tabuľky sa používali na tvorbu layoutu stránky je historicky dané tak ako sa web vyvíjal. Dnes to je síce ešte v hojnom počte používané i keď je to už zastaralí a v dnešnej dobe nevhodný spôsob tvorby layoutov.
Nevýhody tabuľkového layoutu sú:
- Neprehľadný zdrojový kód
- Viac zbytočného kódu = viac priestoru na chyby
- Viac zbytočného kódu = väčšia veľkosť súboru
- Pevne daná štruktúra ktorá sa ťažko mení
- Ak je layout tvorený tabuľkou pri zobrazovaní sa čaká kým sa nahrá obsah všetkých buniek (aj obrázkov) kým sa tabuľka zobrazí
Výhody beztabuľkového layoutu:
- Minimum zdrojového kódu
- štruktúra webu nieje priamo definovaná, nemusí byť daná tokom dokumentu (o zobrazenie štruktúry sa postará CSS)
- Ľahko udržateľný kód
- Pri beztabuľkovom layoute sa najprv zobrazí text a potom sa načítavajú obrázky (pri tabuľkách je to opačne)
- Menšia veľkosť súboru, rýchlejšie načítanie stránky
Tabuľkový layout iba na tabuľkové hodnoty
Keď objavíte možnosti beztabuľkového layoutu na tabuľky budete chcieť čo najskôr zabudnúť. Tabuľky však používajte aj naďalej (ťažko povedať ako to bude v novej verzii HTML5 či XHTML2) ale len pre zobrazenie tabuľkových hodnôt.
Pri beztabuľkovom layoute nahradia tabuľky tagy DIV a SPAN
No, nie že sa tabuľkový už nenosí, ale tabuľkový layout sémanticky nie je príliš v súlade s pôvodnou úlohou tagu TABLE. Veľkosť zdrojového kódu ale nemusí byť menšia. Na to treba dať pozor. Zväčša, a to skúsený webdizajnér vie, sa musia pridať rôzne wrappery a obaľovače a boxy, aby sa vzhľad aspoň k pôvodnému tabuľkovému priblížil. Komplikuje sa to však až na strane CSS.
BTW, prezývka nepochádza od slova zívať, ale nazývať