Interaktive Steuerelemente können über die Tastatur fokussiert werden

Prüfen Sie manuell, ob alle benutzerdefinierten Steuerelemente über die Tastatur fokussierbar sind und eine Fokusanzeige anzeigen lässt. Die Reihenfolge, in der Elemente fokussiert werden, sollte der DOM-Reihenfolge folgen. Wenn Sie sich nicht sicher sind, welche Elemente den Fokus erhalten sollen, sehen Sie sich das Modul „Fokus“ im Kurs „Barrierefreiheit lernen“ auf web.dev an.

Manuelles Testen

Wenn Sie testen möchten, ob das benutzerdefinierte Steuerelement fokussierbar ist und einen Fokusindikator anzeigt, navigieren Sie zuerst mit der Tabulatortaste durch Ihre Website. Verwenden Sie TAB (oder SHIFT + TAB), um zwischen Steuerelementen zu wechseln, und die Pfeiltasten sowie ENTER und SPACE, um die Werte zu ändern (siehe auch Grundlagen des Tastaturzugriffs):

Können Sie alle interaktiven Steuerelemente auf der Seite erreichen? Gibt es bei jedem interaktiven Steuerelement eine Fokusanzeige?

Lösung

Wenn Sie mit der Tabulatortaste nicht durch alle Elemente auf einer Seite wechseln können, müssen Sie möglicherweise tabindex verwenden, um die Fokussierbarkeit dieser Steuerelemente zu verbessern.

Wenn Sie ein benutzerdefiniertes Steuerelement berührbar machen möchten, fügen Sie es mit tabindex="0" in die natürliche Tabulatorreihenfolge ein (siehe auch Tabulatorindex zum Steuern des Fokus). Beispiel:

<div tabindex="0">Focus me with the TAB key</div>

Möglicherweise müssen Sie den benutzerdefinierten Steuerelementen auch die entsprechenden ARIA-Rollen hinzufügen. Weitere Informationen finden Sie unter Benutzerdefinierte Steuerelemente haben ARIA-Rollen.

Wenn Sie keinen Fokusindikator sehen, können Sie :focus verwenden, um immer einen Fokusindikator anzuzeigen. Unabhängig davon, ob Sie mit der Maus oder der Tastatur zum Tabulatorzeichen wechseln, sieht der Fokusindikator der Schaltfläche immer gleich aus (siehe auch Fokusstil).

Warum das wichtig ist

Für Nutzer, die keine Maus verwenden können oder möchten, ist die Tastaturnavigation das primäre Mittel, um alle Elemente auf dem Bildschirm zu erreichen. Eine gute Bedienung der Tastatur hängt von einer logischen Tab-Reihenfolge und einem deutlich erkennbaren Fokusstil ab. Wenn ein Tastaturnutzer nicht sehen oder lernen kann, was im Fokus ist, hat er keine Möglichkeit, mit der Seite zu interagieren.

Weitere Informationen finden Sie unter Überprüfung der Barrierefreiheit im Internet.

Ressourcen