Tab Control: Accessibility

Zurück: Demo-Übersicht

Status: [Live]-Basis (einfache Link-Navigation), ARIA-Tab-Muster für den Panels-Modus [Live].

Tab-Control- Basiskontrakt bereits verstanden.

Rolle folgt Funktion: solange tabs() reine Navigation ist, trägt es bewusst kein role=„tablist“ — diese Rolle wäre für reine Navigation nicht korrekt und würde Screenreadern fälschlich ein Panel-Umschalt-Widget signalisieren. Die ARIA-Rolle ändert sich erst mit dem Panels-Modus.

Entfällt — konsolidierte Referenzseite.

Für eine Barrierefreiheits-Abnahme: Abschnitt 6 für den heutigen Navigations-Modus, Abschnitt 7 sobald der Panels-Modus umgesetzt wird.

Als Navigations-Tab-Strip sind die heutigen tabs()-Elemente gewöhnliche Links in einer Liste (<ul><li><a>) — vollständig tastatur- und screenreader-zugänglich über native Link-Semantik.

Im Panels-Modus (Content-Panel- Umschalten) gilt das WAI-ARIA-Tabs-Muster: role="tablist" am <ul>, role="tab"/ aria-selected/aria-controls je Tab-Kopf, role="tabpanel"/ aria-labelledby je Panel; Pfeiltasten (links/rechts, plus Pos1/Ende) bewegen den Fokus zwischen Tab-Köpfen mit Roving-Tabindex (scripts/tabs.js, dieselbe Mechanik wie Toolbar-Roving- Tabindex) — Tab selbst springt in das aktive Panel, nicht zum nächsten Tab-Kopf.

Entfällt — reine Referenzseite.

Das ARIA-Tab-Muster gilt nur im Panels-Modus — der Navigations-Strip bleibt bewusst rollenfrei (Abschnitt 6).

Diese Seite ist der Accessibility-Überblick.

Entfällt — kein beobachtbarer Fehlerfall.

• Demo-Übersicht — alle Kategorien
• Toolbar: Accessibility — verwandtes Roving-Tabindex-Muster