Gunther: <ul> versa <dl> - weder noch

Beitrag lesen

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.

Das sehe ich anders, und zwar in dem Punkt, dass es eben nicht um "gleichartig", sondern vielmehr um "zusammengehörend" geht.

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>

  
Genau auf dieses Beispiel habe ich gewartet, bzw. damit gerechnet, dass es kommt. ;-)  
  
Mal davon abgesehen, dass es imho eine bis heute andauernde Unzulänglichkeit von HTML ist, dass es kein "vernünftiges/ brauchbares" Element dafür gibt (Stichwort <menu>), ist die Verwendung einer ungeordneten Liste für diesen Zweck also eher eine "historisch gewachsene Behelfslösung", als eine semantisch korrekte Auszeichnung.  
  

> 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.  
  
Das kannst du ja auch gerne machen. Deshalb muss es aber semantisch gesehen noch lange nicht "die (einzig) richtige" Variante sein.  
  
Denn nach dieser Argumentation könntest/ müsstest die ja bspw. auch die Artikelübersicht auf der Blog Startseite (<http://blog.selfhtml.org/>) in eine Liste packen!  
  
Da jeder dieser Links zu einem "eigenständigen" Teil von SELFHTML verlinkt, sie also keine hierarchische Reihe bilden, wäre die Anordnung der Links ohne Listenelement innerhalb des Nav Elements aus meiner Sicht genauso möglich.  
  

> 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.  
  
Kleine Anmerkung: Bei einer "chronologischen" Reihenfolge wäre eine ungeordnete Liste aber eh verkehrt, da die Spec eindeutig aussagt:"The ul element represents a list of items, where the order of the items is not important" (Quelle: <http://www.w3.org/TR/2010/WD-html5-20100624/grouping-content.html#the-ul-element>)  
  

> 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«.  
  
Die Argumente mit dem "CSS-Angriffspunkt" und dem "DOM Scripting" greifen ja nicht wirklich. Beides ist in jedem anderen Fall genauso möglich (und selbst wenn nicht, gäbe es dafür die "inhaltslosen" Elemente <div> und <span>).  
  
Auch der Punkt mit der "komfortablen Navigation" ist weder ein Grund, noch ein Argument für die Verwendung einer Liste! Denn über Links ließ sich schon immer sehr komfortabel bspw. per Tastatur navigieren.  
  
Und auch der letzte Punkt, assoziative Techniken betreffend, ist kein Argument. Hier gibt es durchaus andere Möglichkeiten (Stichwort: "visually hidden").  
  
Wenn ich keinen Punkt übersehen habe, dann waren das alle. Und keiner rechtfertigt aus meiner Sicht die Verwendung einer Liste.  
  

> Ausgehend von [Gunnars Beispiel](https://forum.selfhtml.org/?t=216350&m=1483274) 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?  
  
Das kommt wie immer "darauf an".  
Wenn ich Tom richtig verstanden habe in seinem Ausgangsposting, dann ist diese Galerie-Übersicht quasi der Hauptinhalt (der einzige Inhalt?) dieser Seite.  
  
Dann wäre bspw. auch die Verwendung von <section> für jede Fotogalerie denkbar (ggf. jeweils mit <header> und <footer>. Und wenn z.B. auch noch Meta-Daten zu der jeweiligen Galerie mit hinzukommen sollen, dann kann dafür wiederum eine <dl> durchaus semnatisch korrekt und angebracht sein.  
  
Denn mal von der Präsentation abgesehen, könnte man nach deiner Ansicht/ Argumentation ja auch gleich eine Tabelle (für jede Galerie eine Zeile) nehmen.  
  
Natürlich ist es bei mehrfachem Vorliegen "gleichartiger" "Objekte/Elemente" immer schwierig \_gegen\_die Verwendung einer (ungeordneten) Liste zu argumentieren, weil es leicht ist, Begründungen dafür zu finden, warum eine Liste angebracht sei.  
  
Und dennoch halte ich oftmals die Verwendung einer solchen Liste zumindest für "überflüssig" und semantisch eher für falsch, da dadurch eine "Verbindung" zwischen "Objekten/Elementen" hergestellt wird, die tatsächlich gar nicht gegeben ist.  
  
Im konkreten Fall kommt es also maßgeblich darauf an, als für wie "einzelständig" man die Galerien ansieht?  
  
Und ich sehe die halt als vollkommen unabhängig voneinander an, und somit auch von der Semantik her keinerlei Notwendigkeit, diese in irgendeiner Form als "zusammengehörig" zu kennzeichnen.  
  
  
Gruß Gunther