search

ilifau / ili-fau-templates

Landing Page Template for FAU.de
1 stars 1 forks source link

Unnötige Klassen in der Box und ARIA Nutzung #9

Closed xwolfde closed 6 years ago

xwolfde commented 6 years ago

Bei den Boxen sollte die Class drumherum reichen. Absatz und Überschrift ergeben sich aus der darüberliegenden Klasse.

Bitte vergleiche den HTML Code auch von der Blogroll und übernehme das was ich dort hinsichtlich der ARIA-Label etc gemacht hab auch für die Boxen. Das geht auf eine "episch" lange Diskussion und Ausarbeitung mit der A11Y Szene zurück :)

Auch die Metatags für strukturierte Daten sind sehr wichtig, da diese von Suchmaschinen berücksichtigt werden.

SebastianHonert commented 6 years ago

Hab ich versucht zu übernehmen, kannst Du das bitte überprüfen? Danke Dir.

xwolfde commented 6 years ago

Hm... Fast.

Leider ist die Überschrift in dem Presentation-Bereich. SOmit würde sie für Screenreader ebenfalls unsichtbar sein und das wäre in dem Moment falsch.

Zwei Möglichkeiten: Entweder tust du oben im 

<div class="ilifautpl-topic-box">

ein aria-label ein mit dem Titel oder ein arialabelledby="id", wobei du dann aber unten nochmal eine einmalige Id in der <h3> definieren musst.

Oder du tust das <h3> ausserhalb des Divs mit dem Bild und musst dafür ggf. den Link doppeln.

SebastianHonert commented 6 years ago

Ich habe das <h3> verschoben und mit itemprop="title" und separatem Link ausgestattet.