BITV Reloaded – Anforderung 5
Bedingung 5.6: Verknüpfung von Datenzellen und Überschriften (Prio. 2)
»Für Überschriftenzellen sind unter Verwendung der hierfür vorgesehenen Elemente der genutzten Markup-Sprache Abkürzungen bereitzustellen.«
Was heißt das?
Für diesen Einsatzzweck sieht HTML das Attribut abbr
vor (nicht zu verwechseln mit dem Element ABBR
). Mit ihm können Sie zusätzliche Informationen hinterlegen, die zum Beispiel in einem nicht-visuellen Medium zusätzlich zu den Inhalten der zugehörigen Datenzellen ausgegeben werden. Ohne diese zusätzlichen Informationen ist es in alternativen Zugangsformen kaum möglich, in großen Tabellen die Daten in Zeile 29, Spalte 5 noch den entsprechenden Überschriften der Spalte oder Zeile zuzuordnen.
Wenn Ihre Zeilen- oder Spaltenüberschriften relativ lange Texte enthalten werden diese von einem Screenreader unter Umständen vor den Inhalten der dazugehörigen Zellen erneut vorgelesen. Im abbr
-Attribut von TH
können sie eine Kurzfassung hinterlegen, um Ermüdungserscheinungen beim Nutzer vorzubeugen.
Auch der umgedrehte Weg ist möglich: es könnte sein, dass die Inhalte von Überschriftenzellen nur in visuellen Ausgabeformen sinnbildend sind. Dies kann zum Beispiel der Fall sein, wenn in den Zellen Icons statt echter Texte stehen, wie dies häufig in der tabellarischen Ansicht von Daten in Web-basierten Anwendungen der Fall ist. Hier kann es sinnvoll sein, zusätzliche Informationen zu Inhalt und Funktion der TH
per abbr-Attribut zu hinterlegen.
Beispiele:
Ein simples Beispiel für die Bereitstellung von Abkürzungen ist die folgende Tabelle mit der Ansicht eines Kalendermonats. Ziel ist es zu verhindern, dass eine Sprachausgabe bei jedem Datum den jeweiligen Wochentag (Montag, Dienstag, …) vorliest, gleichzeitig soll Nutzern aber trotzdem ein Minimum an Orientierung gegeben werden, ob der 7. des Monats nun ein Samstag oder ein Sonntag ist.
Diese Tabelle besteht aus mehreren Teilen, nämlich dem Kopf der Tabelle mit thead>
und th>
(Anforderung 5.1) sowie den Datenzellen im tbody>
mit td>
Zusätzlich sind die Wochentage und das Wochenende in Colgroups gruppiert. Die Überschriftenzellen sind hier wie folgt angelegt:th abbr="Mo." scope="col"><abbr title="Montag">Mo.</abbr></th>
Den vollständigen Quelltext finden Sie in einer Beispieldatei.
Januar | ||||||
---|---|---|---|---|---|---|
Mo. | Di. | Mi. | Do. | Fr. | Sa. | So. |
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Wie können Sie das testen?
Die Web Developer Toolbar bietet im Menü Information den Befehl ›Display Table Information‹. Mit dieser werden die im obigen Beispiel angeführten Attribute und Elemente unmittelbar im Kontext dargestellt, sodaß Sie die korrekten Verknüpfungen visuell überprüfen können: