Logiczna kolejność kart jest ważna dla zapewnienia płynności obsługi klawiatury. Czytniki ekranu i inne technologie wspomagające poruszają się po stronie w kolejności DOM. Przepływ informacji powinien być logiczny.
Jak przeprowadzić test ręczny
Aby sprawdzić, czy kolejność kart w aplikacji jest logiczna, przejdź przez karty. Ogólnie zaznaczenie powinno znajdować się w kolejności czytania, od góry do dołu strony. W większości języków kierunek czytania jest od lewej do prawej. W niektórych, np. arabskim i hebrajskim, kolejność czytania przesuwa się od prawej do lewej.
Podczas oceny kolejności kart należy pamiętać o 2 głównych kwestiach:
- Czy elementy w DOM są rozmieszczone w logicznej kolejności?
- Czy treści poza ekranem są prawidłowo ukryte na pasku nawigacyjnym?
Zwróć uwagę na dziwne przeskakiwanie w nawigacji. Zwróć też uwagę na to, czy nie występują jakieś przeskakiwania poza ekran, gdy przewijanie do przodu powoduje wyświetlenie treści, które nie powinny być widoczne.
Więcej informacji znajdziesz w artykule Podstawy dostępu za pomocą klawiatury.
Rozwiązanie
Jeśli kolejność zaznaczenia wydaje się nieprawidłowa, zmień kolejność elementów w DOM, aby kolejność kart była bardziej naturalna.
Unikaj używania CSS do wizualnej zmiany pozycji elementów, ponieważ użytkownicy korzystający z technologii wspomagających osoby z niepełnosprawnością będą mieli niezrozumiałą nawigację. Zamiast używać CSS, przenieś element do wcześniejszej pozycji w DOM.
Jeśli klawisze sterujące nadal mają dostęp do treści poza ekranem, rozważ ich usunięcie za pomocą tabindex="-1".
Więcej informacji znajdziesz w artykule Zarządzanie fokusem za pomocą indeksu tabulacji.
Zasoby
Kod źródłowy dotyczący kolejności elementów na stronie zgodnej z kolejnością w DOM