Funkcjonalność · Poziom A

2.5.1 Gesty wskaźnika

Gest złożony nie może być jedyną drogą wykonania funkcji.

Krótko

Jeśli funkcja wymaga szczypania, gestu dwoma palcami, rysowania ścieżki albo przesunięcia po określonym torze, zapewnij prostszą alternatywę, na przykład przycisk, pojedyncze stuknięcie albo pole wartości.

Problem w praktyce

Mapa w aplikacji pozwala powiększyć widok tylko gestem szczypania dwoma palcami. Użytkownik, który używa wskaźnika głowy, rysika albo ma ograniczoną sprawność dłoni, może kliknąć przycisk, ale nie wykona gestu wielopunktowego.

To kryterium nie jest tym samym co 2.5.7 Ruch przeciągania. Tutaj chodzi o gesty wielopunktowe albo oparte na ścieżce, a nie o samo przeciąganie elementu.

Kogo to dotyczy

  • Osób z ograniczoną precyzją ruchu dłoni.
  • Osób używających rysika, wskaźnika głowy, przełączników albo sterowania wzrokiem.
  • Użytkowników czytników ekranu na urządzeniach dotykowych, gdzie gesty mogą mieć inne znaczenie.
  • Osób korzystających z urządzenia jedną ręką albo w ruchu.

Dobry przykład

  • Mapa obsługuje szczypanie, ale ma też przyciski „Powiększ” i „Pomniejsz”.
  • Karuzelę można przesunąć gestem, ale ma też przyciski „Poprzedni” i „Następny”.
  • Podpis można narysować, ale dostępna jest alternatywa, np. wpisanie imienia i nazwiska, jeśli podpis odręczny nie jest istotą procesu.
  • Suwak ma też przyciski albo pole wartości.

Zły przykład

  • Powiększenie mapy działa tylko przez szczypanie.
  • Karuzela zmienia slajd wyłącznie po przesunięciu palcem po ekranie.
  • Użytkownik musi narysować wzór po ścieżce, żeby przejść dalej.
  • Funkcja wymaga gestu dwoma palcami, bez przycisku lub prostszej alternatywy.

Przykłady kodu

Dobry przykład: alternatywne przyciski

Gest może istnieć, ale nie jest jedyną metodą obsługi.

Kod — HTML

<section>
  <h2>Mapa punktów odbioru</h2>
  <div class="map-preview">Mapa</div>
  <button type="button">Powiększ mapę</button>
  <button type="button">Pomniejsz mapę</button>
</section>

Dobry przykład: karuzela z przyciskami

Przesunięcie palcem może być dodatkiem do zwykłych kontrolek.

Kod — HTML

<div class="carousel">
  <button type="button">Poprzedni slajd</button>
  <p>Slajd 1 z 4</p>
  <button type="button">Następny slajd</button>
</div>

Przykład graficzny

Źle

Szczypnij mapę dwoma palcami

Gest wielopunktowy jest jedyną metodą.

Dobrze

Szczypanie albo przyciski + / -

Ta sama funkcja ma prostszą alternatywę.

Schemat pokazuje, że gest może zostać, ale nie może być jedyną drogą.

Jak sprawdzić

  1. Znajdź funkcje obsługiwane gestami: mapy, galerie, suwaki, karuzele, podpisy, rysowanie.
  2. Sprawdź, czy gest wymaga kilku punktów dotyku albo ruchu po określonej ścieżce.
  3. Wykonaj tę samą funkcję pojedynczym kliknięciem, stuknięciem, przyciskiem albo polem wartości.
  4. Sprawdź, czy alternatywa daje ten sam efekt, nie tylko podobny opis.
  5. Nie mieszaj tego z przeciąganiem elementów ocenianym w 2.5.7.

Co sprawdzi automat, a czego nie

Automat może wykryć

  • część obsługi zdarzeń dotykowych i gestów,
  • brak widocznych przycisków przy mapie albo karuzeli,
  • komponenty znane z używania gestów.

Automat nie oceni pewnie

  • czy alternatywa wykonuje dokładnie tę samą funkcję,
  • czy gest jest istotą funkcji,
  • czy użytkownik może wykonać zadanie jednym punktem wskazania.

Typowe błędy

  • Mapa bez przycisków powiększania.
  • Karuzela obsługiwana tylko gestem swipe.
  • Suwak bez pola wartości lub przycisków.
  • Podpis odręczny wymagany tam, gdzie wystarczyłaby alternatywa tekstowa.