HTML und XHTML
Dieser Fehler bezieht sich auf:
Das Ziel dieser Technik ist es, einen Fehler zu beschreiben, der auftritt, wenn eine nur für das Layout benutze Tabelle entweder th
-Elemente, ein summary
-Attribut oder ein caption
-Element enthält. Dies ist ein Fehler, da strukturelles (oder semantisches) Markup nur für die Darstellung benutzt wird. Der Zweck der HTML- und XHTML-Table-Elemente ist es, Daten zu präsentieren.
Das folgende strukturelle Markup würde, auch wenn es für gewöhnlich nicht in einer Layout-Tabelle benutzt wird, ein Fehler bei Erfolgskriterium 1.3.1 sein, wenn es in einer Layout-Tabelle benutzt würde:
headers
-Attribute
scope
-Attribute
Assistierende Techniken benutzen die Struktur einer HTML- oder XHTML-Tabelle, um dem Benutzer Daten in einer logischen Art und Weise zu präsentieren. Das th
-Element wird benutzt, um die Spalten- und Reihenüberschriften der Tabelle zu kennzeichnen. Ein Screenreader benutzt die Information in den th
-Elementen, um die Überschrifteninformationen zu sprechen, die sich ändern, während der Benutzer in der Tabelle navigiert. Das summary-Attribut auf dem table
-Element stellt eine Beschreibung der Tabelle in Textform zur Verfügung, in der Zweck und Funktion der Tabelle beschrieben werden. Assistierende Techniken stellen den Benutzern die Informationen des summary
-Attributs zur Verfügung. Das caption
-Element ist Teil der Tabelle und identifiziert die Tabelle.
Obwohl die WCAG 2 die Benutzung von Layout-Tabellen nicht verbieten, werden CSS-basierte Layouts empfohlen, um die definierte, semantische Bedeutung der HTML-Tabellen-Elemente zu bewahren und konform zur Programmier-Praxis der Trennung von Präsentation und Inhalt zu sein. Wenn eine Tabelle für Layout-Zwecke benutzt wird, dann sollte das th
-Element nicht benutzt werden. Da die Tabelle keine Daten präsentiert gibt es keinen Grund, irgendwelche Zellen als Spalten- oder Zeilenüberschriften zu kennzeichnen. Ebenso ist eine zusätzliche Beschreibung einer Tabelle, die nur dazu benutzt wird, um Inhalte zu gestalten, nicht notwendig. Fügen Sie kein summary
-Attribut hinzu und benutzen Sie das summary
-Attribut nicht dazu, um die Tabelle z.B. als „Layout-Tabelle“ zu beschreiben. Diese Information bringt keinen Nutzen, wenn sie gesprochen wird und lenkt Benutzer, die den Inhalt per Screenreader navigieren, nur ab. Leere summary
-Attribute sind bei Layout-Tabellen vertretbar, sind aber nicht empfohlen.
Hier ist ein einfaches Beispiel, in dem eine Tabelle benutzt wird, um Inhalte in einem dreispaltigen Format zu gestalten. Die Navigationsleiste ist in der linken Spalte, der primäre Inhalt in der mittleren Spalte und in der rechten gibt es eine zusätzliche Seitenleiste. Oben gibt es einen Seitentitel. Das Beispiel kennzeichnet den Seitentitel als <th>
und stellt ein summary-Attribut zur Verfügung, das angibt, dass es sich bei der Tabelle um eine Layout-Tabelle handelt.
Code-Beispiel:
<table summary="layout table">
<tr>
<th colspan=3>Page Title</th>
</tr>
<tr>
<td><div>navigation content</div></td>
<td><div>main content</div></td>
<td><div>right sidebar content</div></td>
</tr>
<tr>
<td colspan=3>footer</td>
</tr>
</table>
Es gibt für diese Technik keine Ressourcen.
Durchsuchen Sie den Quelltext des HTML- oder XHTML-Dokumentes nach dem table
-Element
Wenn die Tabelle nur benutzt wird, um Elemente innerhalb des Inhalts visuell zu gestalten
Prüfen Sie, ob die Tabelle keine th
-Elemente enthält.
Prüfen Sie, ob das table
-Element kein nicht-leeres summary-Attribut enthält.
Prüfen Sie, ob das table
-Element kein caption
-Element enthält.
Wenn irgendeiner der oben genannten Tests falsch ist, dann trifft diese Fehlersituation zu und der Inhalt scheitert an diesem Erfolgskriterium.