In vielen naturwissenschaftlichen Modellen findet man drei grundlegende mengentheoretische Konzepte immer wieder:
- Eine Menge ist eine Sammlung verschiedener Elemente, in der es keine Reihenfolge gibt.
- Ein Tupel ist eine geordnete Zusammenstellung von Elementen, wobei jedes Element mehrfach vorkommen kann.
- Eine Relation ist eine Menge von Tupeln.
Wenn man danach sucht, findet man diese Konzepte auch in XHTML wieder, und zwar in
- ungeordneten Listen,
- geordneten Listen und
- Definitionslisten.
Listen sind eine Darstellungsform für Daten in waagerechter oder (bevorzugt) senkrechter Form. Listen werden zur Organisation von Informationen verwendet.
Ungeordnete Listen: Die Elementtypen ul und li
Das Element ul
zeichnet eine ungeordnete Liste aus, das heißt, deren
Listenpunkte li
unterliegen
keiner bestimmten Ordnung, sind also gleichwertig.
<p>Wenn man danach sucht, findet man diese Konzepte auch in <acronym>XHTML</acronym> wieder, und zwar in</p> <ul> <li>ungeordneten Listen,</li> <li>geordneten Listen und</li> <li>Definitionslisten.</li> </ul>
ul
Geordnete Listen: Die Elementtypen ol und li
Das Element ol
zeichnet eine geordnete Liste aus, deren Listenpunkte li
einer bestimmten Reihenfolge unterliegen.
Listing 5.9 zeigt die Top 10 der 500 besten Alben aller Zeiten, ermittelt in einer Umfrage unter den Lesern des »Rolling Stone«-Magazins im Jahr 2003. Wie die meisten Listen kann auch diese Top-10-Liste als Tabelle ausgezeichnet werden, wie in Kapitel 5.7 in Listing 5.13 zu sehen ist.
<ol> <li>Sgt. Pepper's Lonely Hearts Club Band, The Beatles</li> <li>Pet Sounds, The Beach Boys</li> <li>Revolver, The Beatles</li> <li>Highway 61 Revisited, Bob Dylan</li> <li>Rubber Soul, The Beatles</li> <li>What's Going On, Marvin Gaye</li> <li>Exile on Main Street, The Rolling Stones</li> <li>London Calling, The Clash</li> <li>Blonde on Blonde, Bob Dylan</li> <li>The Beatles (»The White Album«), The Beatles</li> </ol>
ol
Ein weiteres Beispiel für eine geordnete Liste ist ein Ariadne-Faden. Der griechischen Mythologie zufolge ist der Ariadne-Faden ein Geschenk der Prinzessin Ariadne an Theseus. Mithilfe des Fadens fand Theseus den Weg durch das Labyrinth, in dem sich der Minotaurus befand. Im Webdesign bezeichnet der Ariadne-Faden – auch Brotkrumen-Navigation genannt – eine bestimmte Art der Navigation, die die Hierarchie widerspiegelt und dem Benutzer so eine zusätzliche Orientierungshilfe bietet. Viele Webautoren halten eine ungeordnete Liste für die beste Auszeichnung. Listing 5.10 zeigt einen Ariadne-Faden, dessen Darstellung, wie in Abbildung 5.13 zu sehen, per CSS so angepasst wurde, dass sie kaum noch an eine Liste erinnert.
<ol> <li><a href="/">Startseite</a></li> <li><a href="/wsdev/">Webentwicklung</a></li> <li><a href="/wsdev/einfuehrung/">Einführung in <acronym>XHTML</acronym>, <acronym>CSS</acronym> und Webdesign</a></li> <li><a href="/wsdev/einfuehrung/xhtml/"> <acronym>XHTML</acronym></a></li> <li title="Hier befinden Sie sich gerade.">Listen</li> </ol>
Abb. 5.13: Ariadne-Faden
Anfänger haben häufig Schwierigkeiten, Listen korrekt ineinander zu
verschachteln. Behalten Sie stets im Auge, dass die Elemente
ul
und ol
ausschließlich Elemente vom Typ li
als Kind
beinhalten dürfen. Untergeordnete Listen müssen Sie
daher korrekt innerhalb der einzelnen Listenpunkte
aufführen, wie Listing 5.11 zeigt.
<ul> <li>Ebene eins, Listenpunkt eins</li> <li>Ebene eins, Listenpunkt zwei <ul> <li>Ebene zwei, Listenpunkt eins <ol> <li>Ebene drei, Listenpunkt eins</li> <li>Ebene drei, Listenpunkt zwei</li> <li>Ebene drei, Listenpunkt drei</li> </ol> </li> <li>Ebene zwei, Listenpunkt zwei</li> <li>Ebene zwei, Listenpunkt drei</li> </ul> </li> <li>Ebene eins, Listenpunkt drei</li> </ul>
Definitionslisten: Die Elementtypen dl, dt und dd
Das Element dl
zeichnet eine Definitionsliste aus. Diese unterscheidet sich von
anderen Listenarten nur insoweit, als die Listeneinträge aus
zwei Teilen bestehen: einem Definitionsterm und einer
Beschreibung. Der Definitionsterm wird durch das dt
-Element zugewiesen und ist auf Inline-Elemente beschränkt. Die Beschreibung wird mit dem
Element dd
angegeben und kann Blockelemente enthalten. Ein Listeneintrag
kann mehrere dd
-Elemente umfassen.
Der Begriff Definitionsliste sollte Sie nicht davon abhalten, Definitionslisten überall dort einzusetzen, wo Paare aus jeweils einem Begriff oder Sachverhalt und mindestens einer Beschreibung aufgeführt werden. Ein klassisches Beispiel ist ein Glossar oder ein Literaturverzeichnis; die HTML-Empfehlung führt gar einen Dialog als Anwendungsbeispiel auf.
<dl class="literatur"> <dt id="Balzert-2004">Balzert 2004</dt> <dd>H. Balzert; »Webdesign & Web-Ergonomie«, Dortmund, W3L, 2004.</dd> <dt id="Behme-Mintert-2000">Behme, Mintert 2000</dt> <dd>H. Behme, S. Mintert; <acronym>»XML</acronym> in der Praxis – Professionelles Web-Publishing mit der Extensible Markup Language«, 2. Auflage, München, Addison-Wesley Verlag, 2000.</dd> <dt id="Berners-Lee-1999">Berners-Lee 1999</dt> <dd>T. Berners-Lee; »Der Web-Report – Der Schöpfer des World Wide Webs über das grenzenlose Potential des Internets«, München, Verlagshaus Goethestraße <acronym>GmbH</acronym> & Co. <acronym>KG</acronym>, 1999.</dd> <!-- Weitere Einträge --> </dl>