Listen

Ab und an können Listen ganz hilfreich sein. Man kann damit Zutaten eines Rezeptes oder ein Inhaltsverzeichnis für sein Dokument darstellen. HTML beinhaltet zwei unterschiedliche Arten von Listen - die unordered (ungeordnet) und die ordered (geordnet) Listen.

Die unordered Listen beginnen mit dem öffnenden Tag <ul> (ul = Abkürzung für unordered list) und jeder Unterpunkt auf der Liste wird von dem <li> Tag umrahmt (li = list item / Unterpunkt)

<ul>
	<li>List item no. 1</li>
	<li>List item no. 2</li>
	<li>List item no. 3</li>
</ul>

Obiges HTML würde eine unordered Liste erzeugen, die wie folgt aussieht:

• List item no. 1
• List item no. 2
• List item no. 3

Generell hat die unordered Liste schwarze Punkte als Aufzählungszeichen. Diese können aber mittels CSS durchaus geändert werden.

Eine ordered Liste sieht dagegen so aus:

1. First list-item
2. Second list-item
3. Third list-item

Und statt dem <ul> Tag wird das <ol> Tag verwendet (ol = Abkürzung für ordered list)

<ol>
	<li>List item no. 1</li>
	<li>List item no. 2</li>
	<li>List item no. 3</li>
</ol>

Außer wegen offensichtlicher Gründe (wenn man nämlich wirklich eine Liste erstellen möchte) verwenden viele Webdesigner Listen um ihre Menüs und die Navigation zu erstellen -da die Navigation meist eine Sammlung ähnlicher Links ist. Wenn man Listen für die Erstellung benutzt hat man ebenfalls den Vorteil, dass auch wenn CSS Styling einmal nicht funktioniert, die Links immer noch nutzbar sind und semantisch korrekt dargestellt werden.

Was wir gelernt haben

• Es gibt zwei Arten von Listen -ordered und unordered Listen
• Der Tag für eine ordered Liste ist <ol>
• Der Tag für eine unordered Liste ist <ul>
• Jeder Punkt der Liste wird mittels des <li> Elementes beschrieben
• Das Listen Element ist eine gute Wahl um Seitennavigation zu erstellen.