Navigation über Orientierungspunkte: So springen Nutzer umher
Erleben Sie mit einem Screenreader den Wechsel von Bereich zu Bereich.
Navigation über Orientierungspunkte: So springen Nutzer umher ist eine kostenlose Web Accessibility Academy-Lektion auf CoddyKit. Dies ist Lektion 4 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Web Accessibility Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Web Accessibility Academy-Kurs umfasst insgesamt 4 Lektionen.
Springen statt scrollen
Ein sehender Nutzer überblickt eine Seite. Ein Screenreader-Nutzer springt dagegen mithilfe der von Ihnen definierten Landmarks von Region zu Region.
Die Landmark-Tastenkombination
Die meisten Screenreader bieten eine Taste zum Durchlaufen der Landmarks. In NVDA springt die Taste D zur nächsten Region, ohne dass die Maus benötigt wird.
Eine Liste der Regionen
Nutzer können auch eine Liste der Landmarks öffnen – ein Menü mit jeder Region der Seite – und eine davon auswählen, um direkt dorthin zu springen.
Wiederkehrendes überspringen
Der größte Vorteil ist das Überspringen. Nutzer springen über den header und die nav hinweg, die sie bereits gehört haben, direkt zu neuen Inhalten.
VoiceOver-Rotor
Auf einem Mac öffnen VoiceOver-Nutzer den Rotor und wählen Landmarks aus, um anhand von Name und Rolle durch Ihre Regionen zu navigieren.
Warum sich Namen lohnen
In dieser Landmark-Liste werden Ihre aria-label-Werte zu den Menüpunkten. Gute Namen machen das Springen also erst wirklich nützlich.
<nav aria-label="Main">...</nav>Die Reihenfolge folgt dem DOM
Landmarks werden in der Quelltext-Reihenfolge besucht. Eine logische HTML-Reihenfolge ergibt daher für alle eine logische Sprungreihenfolge.
Zu viele Landmarks schaden
Wenn jede Box eine Region ist, wird die Liste zu Rauschen. Verwenden Sie Landmarks für echte Seitenbereiche, nicht für das allgemeine Layout.
Die gesamte Seite abdecken
Idealerweise befindet sich jeder sichtbare Inhalt innerhalb eines Landmarks. Verwaiste Inhalte außerhalb jeder Region sind durch Springen schwerer zu erreichen.
Testen Sie es selbst
Öffnen Sie einen Screenreader und drücken Sie die Landmark-Taste. Wenn Sie sauber durch Ihre Seite springen können, funktionieren Ihre Regionen. 🎧
Schneller als Tabben
Landmark-Sprünge sind schneller, als dutzende Male Tab zu drücken. Einige Tastendrücke ersetzen das lange, ermüdende Durchgehen jedes Links.
Schnelltest
Was ist der wichtigste Vorteil der Landmark-Navigation für Screenreader-Nutzer?
Zusammenfassung: Herumspringen
Sie haben gelernt, wie Nutzer mit einer Taste oder dem Rotor zwischen Landmarks wechseln, warum benannte Regionen und die DOM-Reihenfolge wichtig sind und wie Sie durch Zuhören testen. 🙌
Häufig gestellte Fragen
Ist die Lektion „Navigation über Orientierungspunkte: So springen Nutzer umher“ kostenlos?
Ja — der vollständige Text von „Navigation über Orientierungspunkte: So springen Nutzer umher“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Web Accessibility Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Web Accessibility Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Navigation über Orientierungspunkte: So springen Nutzer umher“?
Erleben Sie mit einem Screenreader den Wechsel von Bereich zu Bereich. Du übst Web Accessibility Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Web Accessibility Academy zu starten?
Keine Vorkenntnisse erforderlich. Web Accessibility Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 4 von 4.
Wie lange dauert die Lektion „Navigation über Orientierungspunkte: So springen Nutzer umher“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Web Accessibility Academy-Lektion Code schreiben und ausführen?
Ja. Jede Web Accessibility Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- header, nav, main, footer: Die großen Vier
- Inhalte in main und nur ein main einfügen
- Mehrere Bereiche mit aria-label benennen
- Navigation über Orientierungspunkte: So springen Nutzer umher