Wenn die Reihenfolge bei einer Liste wichtig ist (zum Beispiel eine Anleitung mit Schritten oder eine Rangliste), benutzt du statt <ul> eine geordnete Liste: <ol> ("ordered list").

<ol>: geordnete Liste

<ol>
  <li>Schuhe anziehen</li>
  <li>Zum Trainingsplatz gehen</li>
  <li>Sich aufwärmen</li>
  <li>Mit dem Training beginnen</li>
</ol>

Der Aufbau ist identisch zu <ul> - nur <li> darf direkt darin vorkommen - aber der Browser zeigt automatisch Nummern (1, 2, 3, ...) statt Punkten an, weil hier die Reihenfolge zählt.

Finns Vorbereitungsroutine

Füge eine geordnete Liste mit Finns Vorbereitung vor einem Spiel hinzu:

<h2>Meine Vorbereitung vor einem Spiel</h2>
<ol>
  <li>Ausgeschlafen aufwachen</li>
  <li>Ein gutes Frühstück essen</li>
  <li>Fußballtasche packen</li>
  <li>Rechtzeitig zum Platz fahren</li>
  <li>Sich mit der Mannschaft aufwärmen</li>
</ol>

<dl>: Beschreibungsliste

Es gibt noch eine dritte, weniger bekannte Listenart: die Beschreibungsliste <dl> ("description list"). Sie eignet sich für Begriff-Erklärung-Paare, wie in einem kleinen Lexikon. Sie benutzt zwei neue Elemente statt <li>:

• <dt> ("description term"): der Begriff
• <dd> ("description details"): die Erklärung dazu

<dl>
  <dt>Abseits</dt>
  <dd>Wenn ein Angreifer beim Zuspiel näher am gegnerischen Tor steht als
    der vorletzte Verteidiger.</dd>

  <dt>Elfmeter</dt>
  <dd>Ein Strafstoß aus 11 Metern Entfernung nach einem Foul im Strafraum.</dd>
</dl>

Füge Finns eigenes kleines Fußball-Lexikon hinzu:

<h2>Mein kleines Fußball-Lexikon</h2>
<dl>
  <dt>Abseits</dt>
  <dd>Wenn ein Angreifer beim Zuspiel näher am gegnerischen Tor steht als
    der vorletzte Verteidiger.</dd>

  <dt>Elfmeter</dt>
  <dd>Ein Strafstoß aus 11 Metern Entfernung nach einem Foul im Strafraum.</dd>
</dl>

Kurzer Rückblick: drei Listenarten

• <ul>: Reihenfolge egal, Punkte davor (zum Beispiel Hobbys)
• <ol>: Reihenfolge wichtig, Nummern davor (zum Beispiel eine Anleitung)
• <dl>: Begriff und Erklärung als Paar (zum Beispiel ein kleines Lexikon)