weballey logo
 
left Webdesign - tables backnext right
hometoolssite mape-mail
ALGEMEEN

WERKWIJZE

BANDBREEDTE

LAYOUT

eenheid
scherm-layout
< HTML tables >
style sheets
frames
navigatie
linken is link

GRAPHICS

      De layout van een pagina wordt meestal ingevuld met blokken. Blokken in de vorm van illustraties, stukken tekst, menu's etc. Daartussen komen dan marges, veelal stukken wit horizontaal en verticaal. Om de layout constant te houden, dient dit alles op een vaste plaats op de pagina te komen. Ook dienen breedte van de kolommen en de gehele pagina constant te zijn. Normaliter verschuift de rechterkantlijn namelijk met de breedte van de het browservenster.
    Veel van deze dingen zijn goed te regelen met de tabelfunctie. Deze HTML tag is oorspronkelijk bedacht om bijvoorbeeld financiële gegevens in tabellen weer te kunnen geven. Zoals de tabel hieronder laat zien. In kale vorm is de tabel zeer flexibel. Hij past zich aan aan alles wat erin gestopt wordt. Ook zijn de lijnen duidelijk zichtbaar.

Bedrijfsresultaat 1996
periode omzet (mln Hfl.) winst/verlies (mln Hfl.)
1e kwartaal 10.240 234
2e kwartaal 23.180 430
3e kwartaal 13.300 321
4e kwartaal 18.490 -/-143

Een eenvoudige tabel.

    De tabel laat zich echter geheel naar wens aanpassen. De kolommen kunnen een vaste breedte krijgen en de uitlijning kan aangegeven worden. Hierdoor ontstaan vaste marges en gelijkmatige kolommen met een vaste breedte. De lijnen kunnen onzichtbaar worden gemaakt. Deze eigenschappen maken de tabel bijzonder geschikt om de layout van een pagina vast te leggen. De pagina's op deze site zijn gemaakt met de hieronder weergegeven tabel. De benodigde HTML code is in de tabel zelf weergegeven. De lijnen verdwijnen door 'border=1' te veranderen in 'border=0'.
 

   

<table width=600 border=1>
  <tr>
  <td width=150 valign=top>
    &nbsp;
  </td>
  <td width=50>
    &nbsp;
  </td>
  <td width=400 valign=top align=left>
    &nbsp;
  </td>
  </tr>
</table>

    Tabel gebruikt voor pagina indeling

    Door een oneigenlijk gebruik van de tabelfunctie in HTML kan dus de layout van een pagina op een zeer acceptabele manier worden vastgelegd. Door bij het schrijven van de pagina de lijnen aan te zetten (border=1), is beter zichtbaar of het geschrevene ook op de juiste plaats komt. Ook is het meteen duidelijk wanneer er iets met de tabelcode aan de hand is. Pas echter wel op, bij foutjes in de code weet de browser er geen raad mee en laat hij gewoon een witte pagina zien. Wanneer je klaar bent met de pagina, kun je de belijning uitzetten (border=0).

goto top  
leftCopyright © Gerben Hoekstra - Alle rechten voorbehouden backnext right