WCAG 1.3.1: Info und Beziehungen von Tabellenzellen
Zurück zu allen WCAG-KriterienÜBERBLICK
Umsetzbarkeit:
- Komplexität:Einfach
- Dauer:Schnell
Wichtig für Rolle:
Entwicklung
Worum gehts?
Die Köpfe von Tabellen müssen als th ausgezeichnet werden. Für komplexere Tabellen brauchst du außerdem das scope-Attribut.
Umsetzung
Mindestens eine der folgenden Möglichkeiten muss umgesetzt werden, um das Kriterium zu erfüllen. Nähere Informationen dazu findest du in den jeweils verlinkten WCAG-Techniken.
Verknüpfe Tabellen-Header richtig mit den Inhalten
Wenn eine Tabelle zwei Header hat (links und oben), dann muss das “scope”-Attribut eingesetzt werden, um Tabellen-Header mit Datenzellen zu verbinden. “Scope” zeigt an, ob die Zelle eine Kopfzeile für eine Zeile (row), Spalte (col) oder Gruppe von Zeilen (rowgroup), oder Spalten (colgroup) ist.
Bei komplexeren Tabellen mit mehreren Zwischenheadern brauchten die Header-Elemente auch eine ID, um sie mit den einzelnen Tabellenzellen zu verknüpfen.
Sehr gute Beispiele für das barrierefreie Implementieren von Tabellen findet man auf der Seite des W3C: https://www.w3.org/WAI/tutorials/tables/
DAs Accessbility-Center
Teste selbstständig auf digitale Barrierefreiheit!
Mit unserem manuellen Test-Tool prüfst du deine Website selbstständig, schnell und effizient auf digitale Barrierefreiheit!
- Alle Prüfschritte leicht erklärt
- Teile und exportiere Prüfberichte
- Teste direkt auf der Live-Webseite!
