Interaktywne elementy sterujące można zaznaczyć za pomocą klawiatury

Ręcznie sprawdź, czy wszystkie niestandardowe elementy sterujące można zaznaczyć za pomocą klawiatury i czy mają wskaźnik zaznaczenia. Kolejność, w jakiej zaznaczone są elementy, powinna być zgodna z kolejnością DOM. Jeśli nie wiesz, które elementy należy zaznaczyć, przeczytaj wprowadzenie do skupienia.

Testowanie ręczne

Aby sprawdzić, czy ten element sterujący jest aktywny i czy jest wyświetlany wskaźnik fokusu, zacznij od poruszania się klawiszem Tab w witrynie. Użyj TAB (lub SHIFT + TAB), aby przechodzić między elementami sterującymi, a klawisze strzałek oraz ENTER i SPACE do zmieniania ich wartości (zobacz też Podstawy dostępu z klawiatury):

Czy masz dostęp do wszystkich interaktywnych elementów sterujących na stronie? Czy na każdym interaktywnym elemencie sterującym znajduje się wskaźnik zaznaczenia?

Rozwiązanie

Jeśli nie możesz przechodzić między wszystkimi elementami strony za pomocą klawisza Tab, prawdopodobnie musisz użyć elementu tabindex, aby zwiększyć zaznaczenie tych elementów.

Aby niestandardowe elementy sterujące można było zaznaczyć, wstaw własny element sterujący w naturalnej kolejności kart za pomocą tabindex="0" (zobacz też Sterowanie fokusem za pomocą indeksu tabulacji). Na przykład:

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

Może być też konieczne dodanie do niestandardowych elementów sterujących odpowiednimi rolami ARIA. Zobacz Opcje niestandardowe mają role ARIA.

Jeśli nie widzisz wskaźnika ostrości, spróbuj użyć :focus, aby zawsze go pokazywać. Niezależnie od tego, czy dotykasz klawiszem Tab za pomocą myszy czy klawiatury, wskaźnik zaznaczenia przycisku zawsze wygląda tak samo (zobacz też Skupienie na stylu).

Dlaczego to jest ważne

W przypadku użytkowników, którzy nie mogą lub nie chcą korzystać z myszy, nawigacja za pomocą klawiatury jest podstawowym sposobem na dotarcie do wszystkich elementów na ekranie. Prawidłowe działanie klawiatury zależy od logicznej kolejności kart i łatwego do rozpoznania stylów zaznaczenia. Jeśli użytkownik klawiatury nie widzi zaznaczonego elementu, nie może wchodzić ze stroną w interakcję.

Więcej informacji znajdziesz w artykule Jak przeprowadzić weryfikację ułatwień dostępu.

Zasoby