WCAG-A/AA-Anforderung Priorität: Mittel

Tabellenüberschriften beschreiben keine Daten

Eine Tabelle enthält Überschriftenzellen (<th>), die mit keinen Datenzellen verbunden sind, zum Beispiel eine leere Kopfzeile in einer Größentabelle oder eine Tabelle, die <th> nur für Fettschrift verwendet.

Dieser Text wurde automatisch übersetzt und noch nicht von Muttersprachlern geprüft.

Warum das für Ihre Kunden wichtig ist

Screenreader lesen Überschriften vor, die ins Leere führen, oder können Werte nicht der richtigen Überschrift zuordnen. Blinde Kundinnen und Kunden verstehen eine Größen-, Preis- oder Versandtabelle dann womöglich falsch.

Wen es betrifft

blinde Kundinnen und Kunden
Screenreader-Nutzer

So beheben Sie es

Stellen Sie sicher, dass jedes <th> (und jedes Element mit role="columnheader" oder role="rowheader") Datenzellen in seiner Spalte oder Zeile hat. Entfernen Sie leere Überschriftenzellen oder machen Sie daraus <td>, verwenden Sie <th> nicht nur für Fettschrift und halten Sie Zeilen und Spalten vollständig. Tabellen, die nur dem Layout dienen, sollten überhaupt kein <th> enthalten.

Bei Shopify

Meist eine Größen- oder Datentabelle, die in eine Produktbeschreibung eingefügt oder von einer Größentabellen- bzw. Produkt-Tab-App erzeugt wurde. Korrigieren Sie das Tabellen-HTML in der Code-Ansicht des Editors oder wenden Sie sich an den App-Entwickler.

Bei Shoptet (CZ)

Meist eine Tabelle, die in eine Produktbeschreibung oder einen Artikel eingefügt wurde. Korrigieren Sie das Tabellen-HTML im Editor so, dass unter oder neben jeder Überschrift Daten stehen.

Bei PrestaShop

Meist eine Tabelle in einer Produktbeschreibung, auf einer CMS-Seite oder in einem Modul für Produktmerkmale oder Produktvergleich. Korrigieren Sie das HTML im Editor oder im .tpl-Template des Moduls.

Bei WooCommerce

Meist eine Tabelle aus einem Tabellen- oder Größentabellen-Plugin, ein Tabellen-Widget eines Page Builders oder HTML in einer Produktbeschreibung. Prüfen Sie die Kopfzeilen-Einstellungen des Plugins oder korrigieren Sie den Tabellencode.

Standards

Standards
Standard	Abschnitt
WCAG 2.2	1.3.1 (A) Info and Relationships
WCAG 2.1	1.3.1 (A) Info and Relationships
WCAG 2.0	1.3.1 (A) Info and Relationships
EN 301 549 4.1.1	9.1.3.1
EN 301 549 3.2.1	9.1.3.1
Section 508 2017	E205.4
ДСТУ EN 301 549 2022	9.1.3.1

Automatische Prüfung: axe-core-Regel th-has-data-cells. dequeuniversity.com, github.com, www.w3.org

Eine Liste ist fehlerhaft aufgebaut
WCAG 1.3.1 A
Selbst gebauten Bedienelementen fehlen nötige Angaben
WCAG 4.1.2 A
Barrierefreiheits-Attribute werden in der falschen Situation verwendet
WCAG 4.1.2 A
Selbst gebaute Menüs oder Listen sind fehlerhaft aufgebaut
WCAG 1.3.1 A

Alle Regeln, die wir prüfen