Synonyme: Table
Siehe auch: Liste, Hierarchische Tabelle
Eine Tabelle dient der strukturierten Anzeige von Daten (siehe DIN EN ISO 9241-161: 8.44).
Eine Tabelle besteht aus Zellen, die in Spalten und Zeilen angeordnet sind. Meist befinden sich in der ersten Zeile die Spaltenüberschriften und häufig in der ersten Spalte die Zeilenüberschriften. Darüber hinaus können Tabellen verschiedene Funktionalitäten enthalten, z. B.
- Sortieren und Filtern der Zellinhalte (z. B. über die Spaltenüberschriften),
- Skalieren der Spalten- und Zeilengröße,
- Ein- und Ausblenden von Spalten bzw. Änderung der Reihenfolge der Spalten,
- Ein- und Ausblenden untergeordneter Tabellenzeilen (siehe: Hierarchische Tabelle),
- Anzeige von Summenzeilen am Tabellenende,
- Inline-Bearbeiten der Zellinhalte (im Folgenden als Bearbeitungsmodus bezeichnet),
- externes Bearbeiten der Zellinhalte, z. B. über eine Werkzeugleiste oberhalb der Tabelle oder Schalter innerhalb der Tabellenzellen,
- Auswählen von Tabellenzeilen, z. B. per Checkboxen (Mehrfach-Auswahl) oder Radiobutton (Einfach-Auswahl),
- Auswählen von Tabellenzellen, z. B. per Markieren mit der Maus oder Tastatur,
- Blättern oder Scrollen durch die Datensätze, ggf. mit einer Paginierung.
Die Anforderungen an die einzelnen Bedienelemente innerhalb der Tabelle werden beim jeweiligen Bedienelement beschrieben. Hier werden nur zusätzliche Anforderungen für das gesamte Element beschrieben.
Darstellung
Permalink "Darstellung"Nr. | Eigenschaft | Beschreibung | Klassifizierung | Referenz |
---|---|---|---|---|
390 | Kontrast | Die Textinhalte der Tabellenzellen müssen zum Hintergrund ein Kontrastverhältnis von mindestens 4,5:1 aufweisen. | Muss | EN 301 549: 9.1.4.3, 11.1.4.3 |
391 | Kontrast | Die grafischen Inhalte der Tabellenzellen müssen zum Hintergrund ein Kontrastverhältnis von mindestens 3:1 aufweisen. | Muss | EN 301 549: 9.1.4.11, 11.1.4.11 |
392 | Kontrast | Grafisch übermittelte Statusunterschiede zwischen den Tabellenzellen müssen zum Hintergrund bzw. zu den Zellen mit einem anderen Status ein Kontrastverhältnis von mindestens 3:1 aufweisen. Hinweis: Das gilt z. B. für den Status „gewählt“, „sortiert“ oder „bearbeitbar“. | Soll | EN 301 549: 9.1.4.1, 11.1.4.1, 9.1.4.11, 11.1.4.11 |
393 | Kontrast | Sind die Tabellenzellen ausschließlich aufgrund ihrer farblichen Gestaltung als solche zu erkennen, muss diese Farbe zu benachbarten Farben ein Kontrastverhältnis von mindestens 3:1 aufweisen. Hinweis 1: Eine Zelle kann z. B. aufgrund ihres Rahmens oder ihrer Hintergrundfarbe als solche erkennbar sein. Hinweis 2: Die Anforderung gilt nicht, wenn die Zellen z. B. aufgrund der Abstände untereinander eindeutig als solche zu erkennen sind. | Soll | EN 301 549: 9.1.4.11, 11.1.4.11 |
394 | Beschriftung | Die Spalten und Zeilen müssen über Spalten- und Zeilenüberschriften beschriftet werden. Hinweis: Die gesamte Tabelle kann ebenfalls beschriftet werden. | Muss | EN 301 549: 11.5.2.6 |
395 | Wert | Tabellen sollen keine Zeilen oder Spalten besitzen, die nur leere Zellen besitzen. | Soll | EN 301 549: 11.5.2.7 |
396 | Vergrößerung | Keine Tabellenzelle darf bei 400% Zoom breiter als 320 px sein, damit deren Inhalte ohne horizontales Scrollen wahrnehmbar sind. | Muss | EN 301 549: 9.1.4.10, 11.1.4.10 |
397 | Fokussichtbarkeit | Erhält eine Tabellenzelle oder ein Element in dieser den Tastaturfokus, dann muss der Fokusindikator sichtbar sein (siehe Fokusindikator). | Muss | EN 301 549: 9.2.4.7, 11.2.4.7 |
Bedienung
Permalink "Bedienung"Nr. | Eigenschaft | Beschreibung | Klassifizierung | Referenz |
---|---|---|---|---|
398 | Tastaturbedienung | Alle Bedienelemente innerhalb der Tabelle müssen mit der Tastatur erreicht, bedient und verlassen werden können (siehe folgende Tabelle Tastaturbedienung). Hinweis 1: Dies gilt auch für Funktionen, die über die Spaltenüberschriften aufgerufen werden können, wie z. B. das Sortieren der Zellinhalte oder das Anpassen der Spaltenbreite über die Bereichstrenner zwischen den Spaltenüberschriften. Hinweis 2: Alternativ können Bedienelemente außerhalb der Tabelle verwendet werden, um Tabellenfunktionalitäten zu ermöglichen. Hinweis 3: Werden Tastaturkürzel eingesetzt, um die Tastaturbedienung zu ermöglichen, müssen diese in der Anwendung und Hilfe beschrieben werden. Hinweis 4: Die Bedienung der Elemente darf nicht in den Konflikt mit der Navigation durch die Tabelle geraten. Wenn z. B. mit den Pfeiltasten durch die Tabelle navigiert werden kann, darf die Tabelle keine Bedienelemente enthalten, die mit den Pfeiltasten bedient werden, außer es kann in den Bearbeitungsmodus gewechselt werden. | Muss | EN 301 549: 9.2.1.1, 11.2.1.1, 9.2.1.2, 11.2.1.2 |
399 | Klickbereich | Der Klickbereich der Bedienelemente innerhalb der Tabelle soll mindestens 24 x 24 px betragen (siehe Zeigeinstrumentbedienung). | Soll | WCAG 2.2 |
Tastaturbedienung Tabelle (in einer Anwendung, die den virtuellen Cursor unterstützt)
Permalink "Tastaturbedienung Tabelle (in einer Anwendung, die den virtuellen Cursor unterstützt)"Bei Anwendungen, die den virtuellen Cursor unterstützen, erhalten die Tabellen und deren Zellen nicht den Tastaturfokus. Lediglich interaktive Elemente innerhalb der Tabellenzellen sollen mit der Tastatur erreicht und bedient werden können. Dies gilt nur, sofern die Tabelle nicht mit role=grid
ausgezeichnet ist. Tabellen mit role=grid
werden wie Tabellen in Anwendungen ohne virtuellen Cursor bedient (siehe folgenden Abschnitt).
Aktion | Taste | Klassifizierung |
---|---|---|
Fokussieren interaktiver Elemente in der Tabelle | TAB | Erforderlich |
Verlassen interaktiver Elemente in der Tabelle | TAB | Erforderlich |
Bedienung interaktiver Elemente in der Tabelle | Entsprechend des jeweiligen Elements | Erforderlich |
Tastaturbedienung Tabelle (in einer Anwendung, die den virtuellen Cursor nicht unterstützt)
Permalink "Tastaturbedienung Tabelle (in einer Anwendung, die den virtuellen Cursor nicht unterstützt)"Bei Anwendungen, die den virtuellen Cursor nicht unterstützen, sowie bei Tabellen, die mit role=grid
ausgezeichnet wurden, muss jede Tabellenzelle den Fokus erhalten können, damit deren Inhalte mit Assistenztechnologie (z. B. Screenreader) wahrnehmbar sind. Es ist nicht ausreichend, wenn z. B. nur zeilenweise durch die Tabelle navigiert werden kann.
Bei Tabellen in Anwendungen, die den virtuellen Cursor nicht unterstützen, wird zwischen dem Navigations- und Bearbeitungsmodus unterschieden:
- In Navigationsmodus kann mit den Pfeiltasten zwischen den Zellen navigiert werden.
- Im Bearbeitungsmodus können die interaktiven Elemente innerhalb einer Zelle bedient werden. Sofern die Zelle mehrere interaktiven Elemente enthält, so kann im Bearbeitungsmodus zwischen den Elementen navigiert werden.
Aktion | Taste | Klassifizierung |
---|---|---|
Fokussieren der Tabelle | TAB | Erforderlich |
Verlassen der Tabelle | TAB | Erforderlich |
Zellenweise Navigation innerhalb der Tabelle im Navigationsmodus | PFEIL AUF/AB/LINKS/RECHTS | Erforderlich |
Horizontale Schnellnavigation im Navigationsmodus (Navigation zur ersten bzw. letzten Zelle in der aktuellen Zeile) | POS 1, ENDE | Erforderlich bei vielen Spalten |
Vertikale Schnellnavigation im Navigationsmodus (mit einer fest definierten Schrittweite) | BILD AUF/AB Hinweis: Die Schrittweite soll mit der Anzahl der sichtbaren Zeilen übereinstimmen. | Erforderlich bei vielen Zeilen |
Schnellnavigation im Navigationsmodus (Navigation zur ersten bzw. letzten Zelle in der aktuellen Zeile) | STRG+POS 1, STRG+ENDE | Erforderlich bei vielen Zeilen und Spalten |
Schnellnavigation im Navigationsmodus (Navigation zur ersten bzw. letzten Zelle in der Tabelle) | STRG+POS 1, STRG+ENDE | Empfohlen |
Wechsel in den Bearbeitungsmodus | F2, EINGABE, [Texteingabe bei Eingabefeldern] | Erforderlich, wenn Bearbeitungsmodus vorhanden |
Wechsel in den Navigationsmodus | F2, EINGABE, ESC Hinweis: Bei ESC sollen die vorgenommenen Änderungen in der Tabellenzelle verworfen werden. | Erforderlich, wenn Bearbeitungsmodus vorhanden |
Navigation innerhalb der Zelle im Bearbeitungsmodus | Tab | Erforderlich, wenn Bearbeitungsmodus vorhanden |
Bedienung interaktiver Elemente im Bearbeitungsmodus | Entsprechend des jeweiligen Elements | Erforderlich, wenn Bearbeitungsmodus vorhanden |
Bedienung eines interaktiven Elements im Navigationsmodus (sofern die Zelle nur dieses Element enthält und das Element nicht mit den Pfeiltasten bedient wird) | Entsprechend des jeweiligen Elements (z. B. EINGABE für Links und LEER für Schalter oder Checkboxen) Hinweis: Elemente, die mit den Pfeiltasten bedient werden, dürfen sich nicht in Tabellen ohne Bearbeitungsmodus befinden, da die Pfeiltasten zur Navigation durch die Tabelle genutzt werden. | Erforderlich, wenn kein Bearbeitungsmodus vorhanden |
Bedienung eines interaktiven Elements im Navigationsmodus (sofern die Zelle nur dieses Element enthält und das Element nicht mit den Pfeiltasten bedient wird) | Entsprechend des jeweiligen Elements (z. B. EINGABE für Links und LEER für Schalter oder Checkboxen) | Empfohlen, wenn Bearbeitungsmodus vorhanden |
Auswählen von Tabellenzellen, -zeilen, -spalten |
Hinweis: Die Auswahl benachbarter und nicht-benachbarter Zellen, Zeilen oder Spalten erfolgt wie beim Element Mehrfach-Auswahlliste beschrieben. | Erforderlich, wenn Auswählen möglich ist |
Tabelle 1: Zeigeinstrumentbedienung Tabelle
Permalink "Tabelle 1: Zeigeinstrumentbedienung Tabelle"Aktion | Taste | Klassifizierung |
---|---|---|
Bedienung interaktiver Elemente | Entsprechend des jeweiligen Elements | Erforderlich |
Auswählen von Tabellenzellen, -zeilen, -spalten |
Hinweis: Die Auswahl benachbarter und nicht-benachbarter Zellen, Zeilen oder Spalten erfolgt wie beim Element Mehrfach-Auswahlliste beschrieben. | Erforderlich wenn Auswählen möglich ist |
Programmierung/Schnittstellen
Permalink "Programmierung/Schnittstellen"Nr. | Eigenschaft | Beschreibung | Klassifizierung | Referenz |
---|---|---|---|---|
400 | Rolle | Die Rollen Tabelle, Tabellenbeschriftung, Tabellenzeile, Spaltenüberschrift, Zeilenüberschrift und Tabellenzelle müssen an die Accessibility API übermittelt werden (siehe Accessibility API). | Muss | EN 301 549: 9.1.3.1, 11.1.3.1, 9.4.1.2, 11.4.1.2, 11.5.2.5 |
401 | Rolle | Die einzelnen Rollen für Tabellen dürfen nur für Datentabellen verwendet werden. Layouttabellen, die lediglich der visuellen Gestaltung und nicht der Anzeige tabellarischer Daten dienen, dürfen nicht mit diesen Rollen ausgezeichnet werden. | Muss | EN 301 549: 9.1.3.1, 11.1.3.1 |
402 | Rolle | Inhalte, die mit der Tabelle assoziiert sind, aber keine tabellarischen Daten enthalten (wie z. B. die Paginierung), dürfen sich nicht innerhalb der Tabelle befinden. | Muss | EN 301 549: 9.1.3.1, 11.1.3.1 |
403 | Name | Die Tabelle muss einen knappen und aussagekräftigen Accessible Name besitzen. | Muss | EN 301 549: 9.2.4.6, 11.2.4.6, 9.4.1.2, 11.4.1.2, 11.5.2.5 |
404 | Name | Sofern die Tabelle eine Beschreibung besitzt, muss diese als Accessible Description übermittelt werden. | Muss | EN 301 549: 9.4.1.2, 11.4.1.2, 11.5.2.5 |
405 | Status | Der Status der Tabelle muss an die Accessibility API übermittelt werden (siehe Elementstatus). Hinweis: Das gilt z. B. für den Status „bearbeitbar“, „sortierbar“ oder „auswählbar“, sofern diese Funktionen nicht explizit über fokussierbare Bedienelemente wahrnehmbar ist. | Muss | EN 301 549: 9.4.1.2, 11.4.1.2, 11.5.2.5 |
406 | Status | Der Status der Tabellenzellen muss an die Accessibility API übermittelt werden (siehe Elementstatus). Hinweis: Das gilt z. B. für den Status „gewählt“, „sortiert“ oder „deaktiviert“. | Muss | EN 301 549: 9.4.1.2, 11.4.1.2, 11.5.2.5 |
407 | Wert | Der Inhalt der Tabellenzellen muss an die Accessibility API übermittelt werden (siehe Accessibility API). | Muss | EN 301 549: 9.4.1.2, 11.4.1.2, 11.5.2.7 |
408 | Spalten- und Zeilenüberschriften | Wenn die Tabelle Spalten- und Zeilenüberschriften besitzt, so müssen diese für jede Zelle an die Accessibility API übermittelt werden. | Muss | EN 301 549: 9.1.3.1, 11.1.3.1, 11.5.2.6 |
409 | Desktop: Elementhierarchie | Die Eltern-Kind-Beziehungen der Elemente innerhalb der Tabelle müssen an die Accessibility API übermittelt werden. | Muss | EN 301 549: 11.5.2.9 |
410 | Bedienung | Die Tabelle bzw. die darin enthaltenen interaktiven Elemente müssen mit Assistenztechnologie erreicht, bedient und verlassen werden können (siehe Accessibility API). | Muss | EN 301 549: 9.4.1.2, 11.4.1.2, 11.5.2.12, 11.5.2.17 |
411 | Aktualisierung | Aktualisierungen hinsichtlich der Tabelleninhalte und dem Status der Tabellenzellen müssen an die Accessibility API übermittelt werden (siehe Accessibility API). | Muss | EN 301 549: 9.4.1.2, 11.4.1.2, 11.5.2.15 |
412 | Desktop: Position | Größe und Position der Tabellenzellen und der darin befindlichen interaktiven Elemente müssen an die Accessibility API übermittelt werden (siehe Fokusindikator). | Muss | EN 301 549: 11.5.2.5 |
Praxistipp Tabellen in Desktop-Anwendungen
Permalink "Praxistipp Tabellen in Desktop-Anwendungen"Tabellen in Listenform
Permalink "Tabellen in Listenform"Einige Programmiersprachen für Desktop-Anwendungen ermöglichen nicht die Erstellung von Tabellen, welche die Anforderungen an die Navigation innerhalb der Tabelle (mit den Pfeiltasten) erfüllen. Stattdessen kann durch die Tabelle nur zeilenweise navigiert werden. Somit kann z. B. mit einem Screenreader die Tabelle nicht strukturiert wahrgenommen werden (weil die gesamte Zeile, ggf. ohne die dazugehörigen Spaltenüberschriften) ausgegeben werden. Darüber hinaus können dann meist auch die Bedienelemente in der Tabelle nicht mit der Tastatur bedient werden.
In folgenden Ausnahmefällen ist die Verwendung dieser Tabellen akzeptabel, sofern die verwendete Technologie keine Alternative anbietet:
- Die Tabelle enthält nur zwei Spalten oder
- die Tabelle enthält maximal fünf Spalten und die Spaltenüberschriften und Zellinhalte sind kurz (maximal ein bis zwei Worte oder Zahlen) und
- die Spaltenüberschriften werden bei der Navigation durch die Zeilen mit ausgegeben oder die Ausgabe ist nicht notwendig, weil sich der Zweck der Spalten aus dem Kontext (z. B. dem Zellinhalt) ergibt und
- die Zeilen und Spaltenüberschriften enthalten keine Bedienelemente bzw. alle Bedienelemente sind mit Assistenztechnologie wahrnehmbar (Rolle, Zweck, Status) sowie mit der Tastatur bzw. Assistenztechnologie bedienbar.
Sofern diese Anforderungen nicht erfüllt werden können, muss eine andere Darstellungsform für die Daten gewählt werden.
Interaktive Elemente in der Tabelle
Permalink "Interaktive Elemente in der Tabelle"Einige Programmiersprachen für Software ermöglichen nicht die Erstellung von Tabellen, welche die hier genannten Anforderungen an die Bedienung interaktiver Elemente innerhalb von Tabellen erfüllen. In diesem Fall sollen interaktive Elemente innerhalb der Tabellen vermieden werden. Stattdessen sollen die Tabellen dann nur zur Anzeige von Daten verwendet werden und die zugehörigen interaktiven Elemente sollen sich außerhalb der Tabelle befinden. Beispiele:
- So können vor der Tabelle ein oder mehrere Bedienelemente eingefügt werden, mit denen die Sortierung der Tabelleninhalte gesteuert wird.
- Oberhalb der Tabelle kann ein Formular zum Filtern der Tabelleninhalte eingefügt werden.
- Oberhalb der Tabelle kann ein Schalter eingefügt werden, über den sich ein modaler Dialog öffnen lässt. Im modalen Dialog kann die Tabelle vollständig mit der Tastatur konfiguriert werden (z. B. Anpassen der Spaltenbreiten).
- Oberhalb der Tabelle befindet sich eine Werkzeugleiste, mit der ausgewählte Tabellenzeilen bearbeitet oder gelöscht werden können.
Alternativ können Tastaturkürzel oder Kontextmenüs verwendet werden, um die Tastaturbedienung zu ermöglichen. In diesem Fall muss auf diese Bedienalternative in der Anwendung und Hilfe hingewiesen werden.
Eine weitere Möglichkeit besteht darin, zusätzlich zu den ggf. nicht barrierefreien Bedienelementen in der Tabelle die barrierefreie Bedienung über Bedienelemente außerhalb der Tabelle zu gewährleisten.
Informationen zu diesem Artikel
Gerne können Sie uns Feedback per E-Mail zu unserer Handreichung senden!