Womit lässt sich <center> bei SVG-Grafiken ersetzen?

[fietur]

semantisch heißt nicht, wo die Grafik definiert wird, sondern welche Bedeutung sie hat.

Was bekommt man denn ohne CSS oder mit einem Screenreader zu sehen? Die Symbole haben ein title-Attribut - es dürfte vom Screenreader abhängen, ob das ausgewertet wird. Die Nützlichkeit ergibt sich großenteils auf visueller Ebene. Rein auf Informationsebene sind sie entbehrlich.

„Rein auf der Informationsebene entbehrlich“ heißt, dass der Text „Abendrunde“ also dann doch schon selbsterklärend ist. Ansonsten müsste der auf jeden Fall zugänglich sein – ob ein title-Attribut reicht, oder es lieber ein aria-label oder ein span mit verstecktem Inhalt und display: inline-block sein sollte, kann ich leider nicht genau sagen.

Irgendwie reden wir da aneinander vorbei. Bei "Abendrunde" ist die Information "mit Musik" nicht enthalten, ein Notensymbol daneben ergänzt das aber und erlangt dadurch semantische Bedeutung (weißer Schimmel-Emoji).

Was ich sagen wollte: eine eindeutige Zuordnung ist bisweilen im Einzelfall unmöglich. Das Symbol Musiknote ist bei "Abdendkonzert" vom "Sängerkreis" redundant, bei "Abendrunde" aber nicht, denn damit könnte die Motorradausfahrt gemeint sein, oder das gesellige Beisammensein im Sängerkreis. Ein etwas konstruiertes Beispiel, zugegeben.

Die Auszeichnung sehe ich an dieser Stelle relativ locker: Es ist nur eine Übersicht in einer Sidebar, die platzsparend an das Wesentliche erinnern soll. An anderer Stelle - und prominent mit nur einem Klick von jeder Seite über das Menu erreichbar - gibt es auch die ausführlichen Informationen, wenn sie denn vorhanden sind oder von größerem Interesse.