Jak na tabulky
Proč v souvislosti s webovou stránkou hovořit o tabulkách? Důvod je prostý - při tvorbě www stránky se tabulky využívají velice často pro formátování stránky. Je to velmi výhodné, obzvlášť pro začátečníky. Jedná se totiž o nejjednodušší způsob, jak na stránce zarovnat jednotlivé objekty a texty pěkně do sloupců, pomyslných buněk nebo pěkných okének. Tabulky je totiž možné použít tak, že jejich orámování není vidět, proto navštěvníka stránek neruší.
Zkušený webdesigner je příliš nepoužívá, přestože by se mu možná práce zjednodušila.
Tabulky totiž mají drobná úskalí:
- při jejich použití záleží na vztahu rozměrů vzhledem k velikosti stránky
- datově zatěžují stránku, ta se proto déle načítá.
Částečně se to může kompenzovat jednoduchým trikem - je lepší použít více kratších tabulek než jednu velikou (např. pro galerii fotografií). Odpůrci tabulek pro formátování stránky používají tzv. "beztabulkový layout" pomocí kaskádových stylů. I tento web je bez tabulek. Jediné tabulky jsou ve stránce o JavaScriptech (vyjížděcí text) a v ukázce využití tabulek.
Značky pro vytvoření tabulky jsou velmi jednoduché a snadno použitelné:
Umístění tabulky do webové stránky
<table border="1" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="33%" align="center">text</td>
<td width="33%" align="center">text</td>
<td width="34%" align="center">text</td>
</tr>
<tr>
<td width="33%" align="center">text</td>
<td width="33%" align="center">text</td>
<td width="34%" align="center">text</td>
</tr>
</table>
Tato tabulka bude mít 2 řádky a 3 sloupce. Šířka tabulky se přizpůsobí formátu
stránky (100%), vztahy mezi sloupci jsou dány počtem procent u každého z nich.
Tagy table - /table určují obecné vlastnosti tabulky. Řádky jsou určené značkami
tr - /tr. V každém řádku tagy td - /td sloupce (počet buněk v řádku). Je vidět,
že řádky jsou nadřazené sloupcům. Tagy jsou párové a použitelné i v jazyku XHTML,
přestože to recenzenti stránek nevidí rádi.