In HTML gibt es 3 grundsätzlich verschiedene Listentypen. <ol> geordnete Listen <ul> ungeordnete Listen <dl> Beschreibungslisten Jeder einzelne Listeneintrag wird durch <li> eingeleitet.

Zur strukturierten Darstellung von Text kann man Tabellen einsetzen. Eine Tabelle besteht aus Zeilen, Spalten und einzelnen Zellen.

Die Tabelle

wird in HTML wie folgt beschrieben:

<table border="1px">
   <tr>
      <th>Fach</th>
      <th>Lehrer</th>
      <th>Note</th>
   </tr>     
   <tr>
      <td>Informatik</td>
      <td>Herr Zerr</td>
      <td>15 Punkte</td>
   </tr>
   <tr>       
      <td>Englisch</td>
      <td>Mr Meater </td>
      <td>05Punkte</td>
   </tr>   
</table> 

<table> leitet eine Tabelle ein. Wenn die Tabelle sichtbare Gitternetzlinien enthalten soll, muss man das Attribut border angeben. <tr> (table row) leitet eine neue Tabellenzeile ein. Im Anschluss daran werden die Zellen (Spalten) der betreffenden Reihe definiert. Am Ende einer Tabellenzeile wird die Kennung </tr> notiert. Eine Tabelle kann Kopfzellen und gewöhnliche Datenzellen enthalten: <th> (table head) definiert eine Kopfzelle (fett, zentriert) und <td> (table data) eine normale Datenzelle. In einer Zelle können beliebige Elemente stehen, d.h. außer normalem Text z.B. auch Verweise oder Grafiken.

Schachtelung ist ein wesentliches Prinzip, mit dem aus einfachen Teillösungen komplexere Gesamtlösungen aufgebaut werden können. Das Schachtelungsprinzip kann in großem Umfang bei HTML-Elementen eingesetzt werden. Nachfolgende werden Listen in eine Tabelle geschachtelt.

<table border=”1”>
  <tr>
   <th>Schule</th>
   <th>Hochschule</th>
 </tr>
 <tr>
 <td>
   <ul>
     <li>Grundschule</li>
     <li>weiterführende Schule
      <ul>
        <li>Realschule</li>
        <li>Gymnasium</li>
      </ul>
     </li>
     <li>Gesamtschule</li>
   </ul>
 </td>
 <td>
  <ol>
    <li>Fachhochschule</li>
    <li>Universität</li>
    <li>Kunstakademie</li>
  </ol>
 </td>
 </tr>
</table>

Hier werden Tabellen in eine Liste geschachtelt.

 <ol>
  <li>
   <table border=”1”>
   <tr>
    <td>Sek I</td>
    <td>Sek II</td>
   </tr>
   </table>
  </li>
  <li>
   <table border=”1”>
  <tr>
   <td>Mittlere Reife</td>
   <td>Abitur</td>
  </tr>
  </table>
 </li>
</ol>

1. Sek I

   Sek II

2. Mittlere Reife

   Abitur