
Cards (Links aus Grafik und Beschriftung)
[Materialsammlung]
Links, die aus einer Kombination von meist illustrativen Bildern , Beschreibungen der Zielseite und gelegentlich Zusatztext bestehen, werden als Cards oder Tiles bezeichnet.
Beispiel: Einzelne Card
Der Kontext für das folgende Beispiel könnte eine Veranstaltung im Kongresshaus sein, auf deren Webseite der Tourismusverband in die Stadt locken will. Die Darstellung einer einzelnen Card wird folgendermaßen realisiert:
- Die Komponente besteht aus einem Link aus Bild und Bildbeschriftung und einem ergänzenden Text. Bild, Bildbeschriftung und ergänzender Text sind vertikal angeordnet.
- Die Bildbeschriftung beschreibt die Zielseite. Sie erfüllt damit die Anforderungen aus den WCAG Erfolgskriterien 2.4.4 Linkzweck im Kontext und das anspruchsvollere Erfolgskriterium 2.4.9 Linkzweck alleinstehend (Konformitätsstufe AAA).
- Das Foto des Goldenen Dachl liefert darüber hinaus keine Zusatzinformation zum Linkzweck. Es wurde daher mit einem
leeren
alt
-Attribut für Screen Reader verborgen.

Goldenes Dachl A ⟶
Das Wahrzeichen der Stadt Innsbruck befindet sich in unmittelbarer Nähe zum Kongresshaus und dem Haus der Musik.
Das Beispiel wurde ohne Scripts lediglich mit HTML und CSS realisiert.
Gruppieren von Cards
Cards werden typischerweise nicht als einzelne Komponente eingesetzt. Eine kleinere Liste von Angeboten wird mit Bildern als visuellen Illustrationen mit Cards dargestellt.