Wróć do wszystkich kryteriów

2.5.1 Gesty wskaźnika (ang.) Pointer Gestures

Specjalizacje:

  • Designer
  • Deweloper

Elementy:

  • Dialogi i warstwy
  • Przyciski i kontrolki

Poziomy:

  • A

Spis treści

    Istota i cel kryterium

    To kryterium wymaga projektowania interfejsów cyfrowych w taki sposób, aby nigdy nie zmuszać użytkowników do wykonywania skomplikowanych lub wysoce precyzyjnych manewrów urządzeniem wskazującym.

    Nadrzędnym celem jest zagwarantowanie, że każda funkcjonalność aktywowana za pomocą zaawansowanych gestów może być bezproblemowo obsłużona w uproszczony sposób. Użytkownik musi mieć możliwość wywołania danej opcji za pomocą pojedynczego kliknięcia, dotknięcia lub tapnięcia. Eliminuje to sytuacje, w których bariera techniczna całkowicie odcina odbiorcę od kluczowych modułów systemu.

    Wprowadzając proste mechanizmy alternatywne, drastycznie zmniejszasz zmęczenie psychiczne oraz całkowicie eliminujesz frustrację osób, które nie są w stanie fizycznie wykonać złożonego ruchu.

    Definicja w j. angielskim

    Definicja dostępna pod adresem (link otworzy się w nowej karcie):
    https://www.w3.org/WAI/WCAG22/quickref/#pointer-gestures

    Definicja w j. polskim

    Definicja dostępna pod adresem (link otworzy się w nowej karcie):
    https://www.w3.org/Translations/WCAG21-pl/#gesty-dotykowe

    Słownik pojęć

    Gesty wielopunktowe (ang.) multipoint gestures
    –

    operacje wymagające jednoczesnego kontaktu dwóch lub więcej punktów na ekranie dotykowym, takie jak popularne rozsuwanie palców w celu przybliżenia widoku.

    Gesty ścieżkowe (ang.) path-based gestures
    –

    interakcje, w których ruch wskaźnika musi przebiegać wzdłuż ściśle określonej ścieżki lub rysować konkretny wzór, a zboczenie z wyznaczonej trasy powoduje przerwanie lub anulowanie akcji.

    Pojedynczy wskaźnik (ang.) single pointer
    –

    stan aktywnego wyróżnienia elementu interfejsu (takiego jak odnośnik, przycisk czy pole formularza), który wskazuje gotowość komponentu na przyjęcie akcji lub danych wprowadzanych przez użytkownika.

    Wpływ na dostępność (Kogo wspierasz?)

    • Osoby korzystające z technologii wspomagających: Systemy sterowania wzrokiem, wskaźniki nagłowne czy specjalistyczne emulatory myszy sterowane głosem bardzo często nie posiadają technicznej zdolności emulacji gestów wielopunktowych lub ścieżkowych.
    • Użytkownicy w niesprzyjających warunkach otoczenia: Obsługa aplikacji na małym ekranie w sytuacjach ograniczonej stabilności (np. obsługa urządzenia w jadącym pojeździe), miejscach o wysokim poziomie wibracji lub silnym nasłonecznieniu mocno ograniczają precyzję ruchów i utrudniają wykonanie złożonych gestów każdemu człowiekowi.
    • Osoby z ograniczeniami motorycznymi: Użytkownicy zmagający się z silnym drżeniem rąk, artretyzmem czy ograniczonym zakresem ruchów dłoni nie są w stanie zachować precyzji wymaganej przez gesty ścieżkowe.
    • Osoby z niepełnosprawnościami poznawczymi: Eliminacja wymogu zapamiętywania i poprawnego odtwarzania skomplikowanych sekwencji ruchowych drastycznie obniża próg wejścia i zapobiega wykluczeniu cyfrowemu.
    • Osoby w podeszłym wieku: Wraz z wiekiem u wielu osób naturalnie obniża się precyzja ruchów oraz szybkość reakcji psychomotorycznych. Uproszczenie interakcji do pojedynczych kliknięć eliminuje frustrację związaną z niedokładnością, która często powoduje „niezaliczenie” gestu przez system.
    • Osoby z czasowymi kontuzjami: Użytkownik, który złamał rękę lub przeszedł operację nadgarstka, może być zmuszony do korzystania z myszy lub ekranu dotykowego za pomocą niewiodącej dłoni. W takiej sytuacji precyzyjne gesty ścieżkowe stają się dla niego fizycznie niemożliwe do wykonania.

    Zasady wdrażania i wymagania techniczne

    Zawsze projektuj interfejsy z myślą o uniwersalności. Jeśli decydujesz się na wdrożenie zaawansowanego gestu dotyczącego myszy lub ekranu, musisz równolegle zapewnić prostą i łatwo dostępną alternatywę za pomocą pojedynczego wskaźnika.

    W przypadku mechanizmów przybliżania typu (ang.) pinch-to-zoom (gest wielopunktowy), Twoim programistycznym obowiązkiem jest dodanie widocznych kontrolek plus i minus (+ / -). Kontrolki te muszą modyfikować właściwości widoku za pomocą standardowych zdarzeń kliknięcia lub tapnięcia obsługiwanych w języku JavaScript.

    Zwróć szczególną uwagę na rozróżnienie między gestem ścieżkowym a zwykłym przeciąganiem. W tradycyjnych suwakach (ang.) input range czy karuzelach, ruch wskaźnika zazwyczaj wykorzystuje przechwytywanie wskaźnika (ang.) pointer capture. Oznacza to, że użytkownik po chwyceniu suwaka może „odjechać” myszą w bok, a wartość nadal się zmienia – jest to ruch przeciągania, który nie wymaga precyzyjnej ścieżki. Jeśli jednak Twój skrypt zrywa połączenie w momencie zboczenia z osi suwaka, tworzysz gest ścieżkowy i musisz zapewnić alternatywę (np. klikalne przyciski).

    Pamiętaj, że samo zapewnienie pełnej dostępności klawiatury – choć wymagane przez inne wytyczne – nie jest wystarczające do spełnienia tego kryterium. Osoby korzystające wyłącznie z urządzeń wskazujących (np. wskaźników nagłownych) potrzebują prostych, jedno-kliknięciowych alternatyw wskaźnikowych, aby nie być zmuszanymi do ciągłego wywoływania ekranowych klawiatur emulujących skróty klawiszowe.

    Wyjątki i sytuacje szczególne

    Kryterium dopuszcza rezygnację z alternatywnych metod sterowania wyłącznie wtedy, gdy dany gest jest uznany za niezbędny ((ang.) essential). Usunięcie tego gestu musiałoby całkowicie zniszczyć podstawową funkcję i cel aplikacji.

    Oto sytuacje wyłączone z tego obowiązku:

    • Cyfrowy podpis elektroniczny: Proces weryfikacji tożsamości wymaga od użytkownika odręcznego, unikalnego naszkicowania swojego podpisu na ekranie.
    • Programy do swobodnego rysowania i malowania: Cała istota narzędzia graficznego opiera się na unikalnym i swobodnym ruchu wskaźnika odwzorowującym pędzel lub ołówek.
    • Zaawansowane gry wideo: Sytuacje, w których specyficzny, szybki gest (np. symulacja cięcia mieczem lub precyzyjny rzut) stanowi integralną i niezbywalną część mechaniki rozgrywki.

    Zwróć uwagę, że ten wyjątek nie daje projektantom pełnej swobody. Zawsze, gdy jest to technologicznie możliwe bez zniekształcania natury funkcji, dąż do maksymalnego uproszczenia interakcji.

    Przykłady implementacji

    Najczęstsze błędy

    • F105: Niezgodność z kryterium polegająca na udostępnieniu funkcjonalności wyłącznie za pomocą gestu opartego na ścieżce bez zapewnienia prostej, jedno-wskaźnikowej alternatywy.
    • Ukrywanie lub marginalizowanie kontrolek alternatywnych: Umieszczanie przycisków pomocniczych głęboko w strukturze menu lub projektowanie ich w sposób wymagający przejścia skomplikowanej ścieżki wielokrotnych kliknięć.
    • Zgubne zakładanie idealnej sprawności użytkownika: Projektowanie systemów z fałszywym przekonaniem, że każdy odbiorca posiada perfekcyjną koordynację psychomotoryczną i odpowiednie warunki fizyczne.
    • Całkowite uwiązanie interfejsu do złożonych gestów dotykowych: Budowanie aplikacji w sposób, który wymusza stosowanie skomplikowanych gestów, bez programistycznego zapewnienia prostych metod obsługi.
    • Niewystarczająca lub zbyt skomplikowana alternatywa: Oferowanie mechanizmu zastępczego, który w praktyce okazuje się tak samo nieczytelny lub trudny w obsłudze jak pierwotny, złożony gest.

    Najlepsze praktyki

    • Zasada „Prostota przede wszystkim” ((ang.) „simplicity first”): Od pierwszych etapów makiety projektuj interakcje bazujące na najprostszych zdarzeniach, takich jak pojedyncze kliknięcia czy tapnięcia.
    • Wykorzystuj natywne komponenty HTML: Stawiaj na standardowe, wbudowane kontrolki przeglądarkowe, które fabrycznie wspierają prawidłową nawigację oraz obsługują interakcje klawiaturą oraz myszą.
    • Domyślne wdrażanie dublujących rozwiązań: Nigdy nie zakładaj, że użytkownik domyśli się skomplikowanego gestu. Równoległe, uproszczone metody sterowania powinny być widocznym i integralnym elementem widoku.
    • Przejrzyste instrukcje operacyjne: Jeśli musisz użyć gestu, zadbaj o klarowny komunikat instruktażowy. Pamiętaj jednak, że tekst nigdy nie zastąpi sprawnej alternatywy funkcjonalnej.
    • Testowanie z realnymi użytkownikami: Regularnie weryfikuj interfejs w badaniach z udziałem osób o zróżnicowanych możliwościach motorycznych oraz korzystających z technologii asystujących.

    Metody testowania

    • Narzędzie deweloperskie (ang.) Developer Tools: Przeanalizuj strukturę drzewa DOM i podpięte zdarzenia JavaScript. Upewnij się, że elementy obsługujące zaawansowane gesty mają zdublowane alternatywne kontrolki (np. przyciski) reagujące na standardowe kliknięcia, a elementy te posiadają poprawne etykiety dostępności.
    • NVDA: Uruchom czytnik ekranu i manualnie spróbuj wywołać funkcję przypisaną pierwotnie do gestu (np. powiększenie mapy), nawigując wyłącznie do alternatywnych przycisków, aby upewnić się, że operacja jest w pełni dostępna bez patrzenia na ekran.

    Sprawdź swoją wiedzę

    W linku poniżej znajduje się 5 makiet reprezentujących różne interakcje na ekranach dotykowych i urządzeniach wskazujących (myszki, touchpady). Twoim zadaniem jest ocenić, czy interfejs zmusza użytkownika do wykonania trudnego gestu, czy też oferuje prostą alternatywę.

    Jak to sprawdzić?

    1. Spójrz na interfejs danego modułu i zastanów się, jakiej akcji oczekuje on od użytkownika (np. powiększenie, przesunięcie w prawo, narysowanie znaku).
    2. Sprawdź, czy oprócz tego „gestu” widoczny jest w module interfejs działający na tzw. pojedyncze kliknięcie/tapnięcie (przyciski, strzałki, klikalne ikony).
    3. Przypomnij sobie wyjątki: czy oceniana funkcja jest z definicji rysowaniem albo generowaniem odręcznego podpisu?

    Notatka: Zanim zajrzysz do rozwiązania, przetestuj i zapisz swoje wnioski na kartce.

    Link: https://pdc.ambiscale.com/training/wcag-2-5-1/

    #1 BŁĄD

    Problem: Aplikacja mapy zmusza użytkownika do korzystania z gestu wielopunktowego (tzw. „Pinch-to-zoom” – rozsuwanie dwóch palców).
    Dlaczego: Osoby używające oprogramowania śledzącego wzrok (eye-tracking), wskaźników nagłownych (head pointers) lub osoby obsługujące ekran tylko jednym, mniej sprawnym palcem nie są w stanie wykonać polecenia wielopunktowego. Zostają całkowicie odcięte od funkcji przybliżania (niepowodzenie SC 2.5.1 – gest wielopunktowy bez alternatywy jedno-wskaźnikowej).
    Naprawa: Wdrożyć na ekranie fizyczne, klikalne przyciski [+] i [-] operowane pojedynczym wskaźnikiem.

    #2 DOBRZE

    Dlaczego: Przycisk komunikatora czatu w prawym dolnym rogu nachodzi na duży przycisk akcji i ewidentnie zasłania jego fragment. Niemniej jednak wskaźnik fokusu (niebieska ramka) jest wciąż bez problemu widoczny z lewej strony oraz na górze przycisku. Kryterium WCAG 2.4.11 (poziom AA) dopuszcza wprost takie częściowe zasłonięcie. (Dopiero rygorystyczny poziom 2.4.12 AAA uznałby ten układ za niezgodny).

    #3 BŁĄD

    Problem: Przesunięcie slajdu w karuzeli wymaga od użytkownika precyzyjnego narysowania ścieżki po ekranie (tzw. gest Swipe w lewo lub prawo).
    Dlaczego: Ludzie z poważnym drżeniem dłoni, paraliżem czy chorobą Parkinsona mogą gubić trajektorię ruchu, co anuluje akcję „Swipe” i zmusza do ponownej, frustrującej próby. Ponieważ Swipe na karuzeli to gest wprost oparty na wyznaczonej ścieżce (path-based gesture), brak innej drogi owocuje ewidentnym, dokumentacyjnym błędem – Technika F105.
    Naprawa: Poniżej karuzeli (lub na jej krawędziach) zawsze umieszczaj fizyczne strzałki „Poprzednie / Następne” reagujące na zwykłe zdarzenie onClick.

    #4 DOBRZE

    Dlaczego: Natywny <input type="range"> posiada funkcję przeciągania kropki suwaka (Drag), ale nie jest on gestem ścieżkowym! Użytkownik nie musi „ciągnąć” suwaka, aby zmienić głośność – wystarczy, że wykona pojedyncze, szybkie kliknięcie (tapnięcie) w dowolnym miejscu na osi suwaka, a kropka błyskawicznie przeskoczy w to miejsce. Funkcja posiada prostą, jedno-wskaźnikową alternatywę domyślnie wbudowaną w silnik HTML.

    #5 DOBRZE

    Dlaczego: Aplikacja do podpisu elektronicznego wymaga złożonego gestu ścieżkowego (podpisu odręcznego). WCAG robi tutaj specjalny, logiczny wyjątek (klauzula Essential). Usunięcie gestu ścieżkowego lub zamiana go na pojedyncze „kliknięcie przycisku Zgadzam się” całkowicie zmieniłaby charakterystykę prawną i sens odręcznego, biometrycznego podpisu. Wymóg prostego gestu wskaźnika zostaje tu legalnie zniesiony.

    Źródła

    Dodatkowe linki

    Wróć do wszystkich kryteriów