Synonyme: Tab-Reihenfolge, Focus order
Siehe auch: Tastaturbedienung, Kontextänderungen, Zeitbegrenzungen
Die Navigationsreihenfolge bestimmt, in welcher Reihenfolge mit der Tastatur fokussierbare Elemente und Bereiche den Fokus erhalten. Typischerweise betrifft dies die folgenden Navigationsmethoden:
- Navigation zwischen den Elementen mit der Tabulatortaste,
- Navigation innerhalb der Elemente mit den Pfeiltasten,
- Navigation zwischen den Bereichen (z. B. mit der F6-Taste),
- Schnellnavigation (z. B. mit BILD AB, ENDE).
Bedienung
Permalink "Bedienung"| Nr. | Eigenschaft | Beschreibung | Klassifizierung | Referenz |
|---|---|---|---|---|
| 64 | Navigationsreihenfolge | Die Navigationsreihenfolge muss so erfolgen, dass die Inhalte in einer sinnvollen Reihenfolge wahrgenommen werden können und die Bedienelemente gemäß ihrer aufgabenangemessenen Abarbeitungsreihenfolge erreicht werden. Hinweis: Dies wird z. B. erreicht, indem
| Muss | EN 301 549: 11.2.4.3 |
| 65 | Navigationsreihenfolge | Bei Elementen, die mit den Pfeiltasten bedient werden, muss bei Pfeiltastenbedienung die Navigation auf das Element beschränkt bleiben. Hinweis: Das betrifft z. B. Radiobuttongruppen, Auswahllisten, Registerkarten, Menüs, Werkzeugleisten. | Muss | EN 301 549: 9.2.4.3, 11.2.4.3 |
| 66 | Navigationsreihenfolge | Nach Seitenaktualisierungen, die einen Fokuswechsel erforderlich machen, muss der Fokus so gesetzt werden, dass die Arbeit schlüssig fortgesetzt werden kann. Beispiel: Nach dem Löschen eines Elements soll der Fokus auf das vorhergehende oder folgende Element gesetzt werden. | Muss | EN 301 549: 9.2.4.3, 11.2.4.3 |
| 67 | Navigationsreihenfolge | Bei modalen Dialogen muss die Navigation auf den Dialog beschränkt bleiben. Hinweis: Die restliche Anwendung kann erst fokussiert und bedient werden, wenn der modale Dialog geschlossen wird. | Muss | EN 301 549: 9.2.4.3, 11.2.4.3 |
| 68 | Navigationsreihenfolge | Die Navigationsreihenfolge soll für die Arbeitsaufgabe angemessen sein. Hinweis 1: Für deutschsprachige Anwendungen bedeutet dies meist, dass die Navigation der Lesereihenfolge entsprechen und von links oben nach rechts unten erfolgen soll. Hinweis 2: Die Navigationsreihenfolge soll in beide Navigationsrichtungen (vorwärts und rückwärts) übereinstimmen. Hinweis 3: Ggf. muss die visuelle Reihenfolge angepasst werden, um dies Anforderung zu erfüllen. | Soll | DIN EN ISO 9241-171: 9.3.18 |
| 69 | Web: Anzahl der Navigationsschritte | Inhaltsbereiche, die auf mehreren Seiten vorkommen, müssen übersprungen werden können (siehe Praxistipp Effiziente Tastaturnavigation). | Muss | EN 301 549: 9.2.4.1 |
| 70 | Kontextänderung | Bei der Tastaturnavigation darf kein Fokusverlust erfolgen. | Muss | EN 301 549: 9.3.2.1, 11.3.2.1 |
| 71 | Kontextänderung | Bei der Wertänderung von Formularelementen darf kein unerwarteter Fokusverlust erfolgen (siehe Kontextänderung). | Muss | EN 301 549: 9.3.2.2, 11.3.2.2 |
| 72 | Kontextänderung | Bei der Bedienung mit der Tastatur muss der Fokus korrekt gesetzt werden, wenn eine erwartete Kontextänderung erfolgt, die bedient werden muss. Alternativ muss die Kontextänderung nach der aktuellen Fokusposition den Tastaturfokus erhalten (siehe Kontextänderung). | Muss | EN 301 549: 9.2.4.3, 11.2.4.3 |
| 73 | Web: Konsistenz | Navigationselemente müssen innerhalb der Anwendung auf jeder Seite in der gleichen relativen Reihenfolge dargestellt werden und den Tastaturfokus erhalten (siehe Konsistenz). | Muss | EN 301 549: 9.3.2.3 |
| 74 | Desktop: Konsistenz | Navigationselemente sollen innerhalb der Anwendung auf jeder Maske in der gleichen relativen Reihenfolge dargestellt werden und den Tastaturfokus erhalten (siehe Konsistenz). | Soll | WCAG 2.1: 3.2.3 (AA) |
Praxistipp Navigationsreihenfolge in Web-Anwendungen
Permalink "Praxistipp Navigationsreihenfolge in Web-Anwendungen"HTML
Permalink "HTML"Die korrekte Navigationsreihenfolge sollte über die Reihenfolge der Elemente im Quellcode gesteuert werden. Das Attribut tabindex sollte nicht verwendet werden.
Das Attribut autofocus sollte nur mit Bedacht verwendet werden, weil dadurch ggf. für sehbeeinträchtigte und blinde Menschen die Inhalte vor dem automatisch fokussierten Element schwer wahrnehmbar sind. Es gibt jedoch Anwendungsfälle, bei denen autofocus sinnvoll eingesetzt werden kann, z. B. auf einer Login-Seite, um das erste Eingabefeld zu fokussieren.
Weitere Informationen: 6.6.3 The tabindex attribute - HTML Standard (whatwg.org), 6.6.7 The autofocus attribute - HTML Standard (whatwg.org)
ARIA
Permalink "ARIA"Die korrekte Navigationsreihenfolge sollte über die Reihenfolge der Elemente im Quellcode gesteuert werden. Das Attribut tabindex=0 muss für Bedienelemente verwendet werden, die andernfalls nicht den Tastaturfokus erhalten würden.
Elemente, die per JavaScript fokussierbar sein sollen, sich jedoch nicht automatisch im TAB-Kreislauf befinden, werden mit tabindex=-1 ausgezeichnet. Dies gilt z. B. für Schalter in Werkzeugleisten, Einträge in Auswahllisten oder Radiobuttons innerhalb einer Radiobuttongruppe. In diesen Fällen wird lediglich jeweils ein Schalter, ein Listeneintrag bzw. ein Radiobutton mit tabindex=0 ausgezeichnet und alle anderen mit tabindex=-1.
Weitere Informationen: Developing a Keyboard Interface | APG | WAI | W3C
Praxistipp Effiziente Navigation in Anwendungen
Permalink "Praxistipp Effiziente Navigation in Anwendungen"Enthält das aktuelle Fenster der Anwendung viele fokussierbare Elemente, können Nutzende, die auf Tastaturbenutzung angewiesen sind, nicht effizient durch das Fenster navigieren, da sie mit der TAB-Taste diese Elemente durchlaufen müssen. Um eine effiziente Navigation mit der Tastatur zu ermöglichen, wird empfohlen, eine oder mehrere der folgenden Methoden zu implementieren und in der Hilfe zu dokumentieren:
- Bereichsnavigation (z. B. mit F6),
- Sprunglinks am Anfang des Fensters bzw. vor Bereichen mit vielen Navigationsschritten,
- Tastaturkürzel für häufig benötigte Funktionen bzw. Bedienelemente,
- Bereiche mit vielen Navigationsschritten ein- und ausblendbar gestalten (z. B. Menü mit Untermenü, Registerkarten, Akkordeon),
- Auslagern von Inhalten mit vielen Navigationsschritten auf sekundäre Masken (z. B. in Dialogfenster, die separat aufgerufen werden können),
- Verwenden von gruppierenden Elementen, innerhalb derer mit den Pfeiltasten anstelle der TAB-Taste navigiert wird (z. B. Werkzeugleiste, Menü),
- bei Anwendungen, die den virtuellen Cursor nicht unterstützen: Modus bei dem nur Bedienelemente den Fokus erhalten.
Informationen zu diesem Artikel
Gerne können Sie uns Feedback per E-Mail zu unserer Handreichung senden!