Oversigt over modellerne Layouteksempel 1 Layouteksempel 1a Layouteksempel 2 Layouteksempel 2a Layouteksempel 3 Layouteksempel 3a Layouteksempel 4 Layouteksempel 4a

 

Det simpleste layout

Dette er nok det simplest tænkelige websidelayout, en tabel med to celler. Cellen til venstre indeholder menuen, mens cellen til højre skal rumme indholdet. Koden til dette layout ser således ud:

<table width="100%" 
  align="center" cellspacing="0" cellpadding="5" border="1">
<tr valign="top">
    <tr>
        <td width="20%">
          [ Menu ]
        </td>
        <td width="1">
          [ Tom celle ]
       </td>
        <td>
          [ Indhold ]
        </td>
    </tr>
</table>

Dokumentets indhold formateres vha. et stylesheet, der ser således ud:

  <style type="text/css">
  <!--
    body,td { 
      background:#eee; 
      font-family:arial,sans-serif; 
    }
    a { 
      display:block;
      margin-bottom:5px;
    }
    .red { 
      color:#c00;
      font-weight:bold;  
    }
  -->
  </style>

Den tomme celle har til formål at skabe lidt luft mellem de to kolonner. Med en venstrejusteret menutekst kan denne celle som regel undværes.