Registerkartengruppe

Synonyme: Registerkarte, Reiter, Karteireiter, Tab

Siehe auch: Akkordeon, Karussell

Registerkartengruppen dienen der Gruppierung und alternierenden Anzeige von Seitenbereichen (siehe DIN EN ISO 9241-161: 8.43).

Eine Registerkartengruppe besteht aus mehreren Registerkarten, deren Inhalt alternierend angezeigt werden. Jede Registerkarte besitzt einen Karteireiter mit Beschriftung, welcher dauerhaft angezeigt wird. Die Auswahl der einzelnen Registerkarten erfolgt über die Karteireiter. Die Karteireiter sind meist horizontal oberhalb der Registerkarten angeordnet. Karteireiter können interaktive Elemente enthalten, z. B. Schalter zum Entfernen des Karteireiters und der zugehörigen Registerkarte.

• JAWS: [Beschriftung der Registerkartenleiste] Registerkarte [Beschriftung des Karteireiters] Registerkarte [ | gewählt] [Position] von [Anzahl]
• NVDA: [Beschriftung der Registerkartenleiste] Registerkarte [Beschriftung des Karteireiters] Registerkarte [ | ausgewählt] [Position] von [Anzahl]
• Windows Sprachausgabe: [Beschriftung der Registerkartenleiste] Registerkarte [Beschriftung des Karteireiters] Registerkartenelement [Position] von [Anzahl] [ | ausgewählt]

Hinweis: Durch JAWS und NVDA erfolgt zwei Mal die Ausgabe „Registerkarte“, zuerst für die Rolle tablist und dann für die Rolle tab. Lediglich die Windows-Sprachausgabe unterscheidet zwischen den beiden Rollen. Die Ausgabe für die Rolle tab wäre ausreichend.

• JAWS: -
• NVDA: -
• Windows Sprachausgabe: [Beschriftung] Registerkartenpanel … Beende [Beschriftung] Registerkartenpanel

Hinweis: Mit JAWS und NVDA ist Beginn und Ende der Registerkarte nicht wahrnehmbar. Die Registerkarten oder Inhalte nach dieser sollten als Regionen ausgezeichnet werden, damit mit dem Screenreader wahrnehmbar ist, welche Inhalte sich innerhalb und außerhalb der Registerkarten befinden.

In HTML existiert kein Element für Registerkartengruppen. Stattdessen kann Folgendes verwendet werden:

• Aufteilung der Informationen auf verschiedene Seiten, die untereinander verlinkt werden,
• Akkordeon,
• Nutzung der entsprechenden ARIA-Rollen.

Bei Registerkartengruppen sollte Folgendes beachtet werden:

• Die Leiste der Karteireiter wird mit role=tablist ausgezeichnet, die einzelnen Karteireiter, die sich als Kindelemente innerhalb der Leiste befinden, mit role=tab.
• Die Leiste der Karteireiter darf außer den Karteireitern keine anderen Elemente enthalten.
• Enthalten die Karteireiter außer ihrer Beschriftung weitere Bedienelemente, so sollte beachtet werden, dass diese mit Assistenztechnologie nicht wahrnehmbar und bedienbar sind. Diese Elemente sollten nicht den Tastaturfokus erhalten können. Stattdessen sollte eine Bedienalternative implementiert und dokumentiert werden. Wenn die Karteireiter z. B. einen Schalter zum Entfernen einer Registerkarte enthalten, so kann z. B. das Entfernen über die ENTF-Taste ermöglicht werden.
• Die Registerkarten werden mit role=tabpanel ausgezeichnet. Die Registerkarten befinden sich im Quellcode unmittelbar nach dem Bereich, der mit role=tablist ausgezeichnet ist. Aus diesem und dem vorhergehenden Grund darf eine Registerkartengruppe nicht für Akkordeons verwendet werden.
• Der aktive Karteireiter, dessen Registerkarte sichtbar ist und der mit TAB den Fokus erhält, wird mit aria-selected=true ausgezeichnet. Alle anderen Karteireiter werden mit aria-selected=false ausgezeichnet. Per aria-controls kann vom Karteireiter auf die ID der Registerkarte verwiesen werden.
• Die Beschriftung der Karteireiter sollte per Textinhalt erfolgen. Die Leiste der Karteireiter und die Registerkarten können mit aria-label oder aria-labelledby beschriftet werden.
• Eine vom Standard abweichende vertikale Ausrichtung der Registerkartenleiste kann mit aria-orientation=vertical angegeben werden. Die Ausrichtung wird von Assistenztechnologie häufig nicht ausgegeben, so dass bei einer vertikal ausgerichteten Registerkartenleiste die Bedienung mit allen Pfeiltasten möglich sein sollte.
• Die Registerkartenleiste sollte auch visuell als solche erkennbar sein, damit sehende Tastaturnutzende die Bedienung mit den Pfeiltasten erkennen können.
• Die Registerkartengruppe sollte mindestens zwei Registerkarten enthalten.
• Karteireiter können mit aria-disabled als deaktiviert ausgezeichnet werden. Es wird empfohlen, deaktivierte Karteireiter in der Tastaturerreichbarkeit mit den Pfeiltasten zu belassen.
• Die gewählte Registerkarte (role=tabpanel) kann mit tabindex=0 ausgezeichnet werden, damit sie nach dem aktiven Karteireiter den Fokus erhält, selbst wenn es sich bei einer Registerkarte nicht um ein Bedienelement handelt.
• Die Darstellung der Registerkartengruppe sollte im Hochkontrast-Modus von Windows überprüft werden. So sollten die Karteireiter und die Registerkarten einen Rahmen besitzen und der visuelle Indikator für den aktiven Karteireiter nicht nur per Farbe vermittelt werden.
• Die sichtbaren Karteireiter und die programmatisch fokussierten Elemente sollten die gleiche Position und Größe besitzen.

Weitere Informationen: tab role - Accessible Rich Internet Applications (WAI-ARIA) 1.2 (w3.org) (Externer Link), tablist role - Accessible Rich Internet Applications (WAI-ARIA) 1.2 (w3.org) (Externer Link), tabpanel role - Accessible Rich Internet Applications (WAI-ARIA) 1.2 (w3.org) (Externer Link), Tabs Pattern | APG | WAI | W3C

Informationen zu diesem Artikel

Datum:

5.10.2023

Lizenz:

CC-BY-SA 4.0

Version:

0.5

Gerne können Sie uns Feedback per E-Mail zu unserer Handreichung senden!