<ul> versa <dl> - weder noch

[molily]

Hallo,

Irgendwie neigt jeder dazu, alles was mehr als genau einmal vorkommt in eine "Liste" stecken zu wollen.

Listen sind erst einmal nichts anderes als (meist) geordnete Mengen von gleichartigen Informationen.

Jedes Bild "symbolisiert" jeweils eine eigene Fotogalerie und ggf. enthält die Bildunterschrift dann noch den Namen der Galerie sowie einen beschreibenden Text.

Das bedeutet, dass jeder dieser "Blöcke"

• für sich alleine stehen kann (ohne dass der Sinn & Zweck verloren geht)
• er keinerlei "Beziehung" zu etwaigen anderen Blöcken hat

Daraus ergibt sich für mich, dass eine "Zusammenfassung/ Gruppierung" hier aus semantischer Sicht nicht angebracht ist.

Dem kann ich nicht folgen. Ein anderes Beispiel:

<nav>  
  <ul>  
   <li><a href="http://forum.de.selfhtml.org">Forum</a></li>  
   <li><a href="http://de.selfhtml.org">Doku</a></li>  
   <li><a href="http://wiki.selfhtml.org">Wiki</a></li>  
   <li><a href="http://blog.selfhtml.org">Blog</a></li>  
  </ul>  
</nav>

Dies ist eine Liste von Links.

• Jeder Link kann für sich alleine stehen, ohne dass der Sinn verloren geht.
• Ein einzelner Link hat keine notwendige »Beziehung« zu den anderen Links. Es gibt auch keine bedeutungsvolle Ordnung im Sinne von Reihenfolge.

Trotzdem haben die Links etwas gemeinsam. Es sind gleichförmige Kurz-Links zu Teilen von SELFHTML. Deshalb gruppiere ich sie in eine Liste.

Wenn ich also eine Liste mit Links zu Bildergalerien habe – so können diese natürlich alleine stehen. Aber was haben sie gemeinsam?

Inhaltlich: Es sind z.B. alle Fotografien, die ich letztes Jahr geschossen habe, gruppiert in Alben nach Orten/Anlässen. Es ist in aller Regel keine willkürliche Zusammenstellung mit französischen Felszeichnungen, chinesischen Ming-Vasen, Fotos von süßen Hundebabys sowie Marlboro-Werbeplakaten.

Strukturell: Es sind alles gleichförmige Links mit gleichförmigen Cover-Bildern, einem kurzen Titel und einer optionalen Beschreibung.  Die Markup-Struktur wiederholt sich also immer wieder (siehe Gunnars Beispiel). Sinn der Sache ist, einen kurzen, eventuell chronologischen Überblick zu geben.

Es ist nützlich, diese Auflistung auch als Liste auszuzeichnen. Mit dem ul/ol markiere ich, dass hier eine Auflisung gleichartiger Informationen kommt. Mit li zeichne ich Anfang und Ende eines Eintrags aus. Das bietet nicht nur CSS-Angriffspunkte und eine klare Datenstruktur, die z.B. mit DOM Scripting eindeutig verarbeitet werden kann. Es erlaubt User-Agents auch eine komfortable Navigation zwischen den Einträgen. Ein Screenreader kann z.B. ausgeben: »Liste mit 10 Einträgen«.

Ausgehend von Gunnars Beispiel mit a, figure und figcaption: Welche Auszeichnung würdest du auf der Makro-Ebene benutzen? Direkt a-Elemente aneinander reihen? Oder sie in p-Elemente schachteln?

Mathias