Opisany niżej przebieg to obraz złożony z kilkunastu audytów sklepów średniej wielkości. Żaden pojedynczy element nie pochodzi z konkretnej firmy, a każdy widzieliśmy więcej niż raz. Test jest prosty: odkładamy myszkę i próbujemy kupić kurtkę, poruszając się klawiszem Tab, strzałkami i Enterem. Tak korzysta z sieci część osób z niepełnosprawnością ruchu, osoby po urazach, a także użytkownicy czytników ekranu.
Karta produktu: dobre pierwsze wrażenie
Początek wygląda obiecująco. Galeria zdjęć działa, wybór rozmiaru jest zwykłym selectem, przycisk dodania do koszyka reaguje na Enter. Sklep korzysta z domyślnych komponentów platformy i to widać. Problemy zaczynają się dokładnie w miejscu, w którym zespół frontendowy zaczął być kreatywny.
Mini-koszyk, który istnieje tylko dla myszki
Po dodaniu produktu w rogu ekranu pojawia się dymek z zawartością koszyka. Otwiera się po najechaniu kursorem. Fokus klawiatury nigdy do niego nie trafia, bo technicznie to warstwa pokazywana na hover, bez żadnej obsługi klawiatury. Użytkownik słyszy, że coś się zmieniło, ale nie ma jak tam wejść. Ratuje go dopiero to, że ikona koszyka jest jednocześnie linkiem do pełnego widoku. Nie każdy o tym wie i nie każdy sklep tak ma.
Dostawa: pola wyboru, które nimi nie są
Krok dostawy renderuje eleganckie kafelki: kurier, paczkomat, odbiór w salonie. Pod spodem to zwykłe divy ze zdarzeniem kliknięcia. Tab je omija, czytnik ekranu nie mówi, że cokolwiek jest zaznaczone, bo z punktu widzenia technologii asystujących te kafelki nie mają ani roli, ani stanu. Wybór paczkomatu otwiera mapę zewnętrznego dostawcy, po której klawiaturą poruszać się nie sposób, a listy punktów jako alternatywy nikt nie przewidział.
Płatność: pułapka na sam koniec
Finał należy do osadzonej ramki operatora płatności. Fokus wchodzi do formularza karty i już z niego nie wraca: kombinacja Tab i Shift+Tab krąży między polami ramki, a przycisk powrotu do sklepu pozostaje poza zasięgiem. W żargonie audytowym to pułapka fokusa, jedno z niewielu kryteriów WCAG, których naruszenie praktycznie zawsze oznacza przerwany zakup.
Rachunek dla właściciela sklepu
Każda z tych barier z osobna wygląda na detal. Razem tworzą ścieżkę, której nie ukończy nikt pozbawiony myszki. Według danych publicznych kilkanaście procent dorosłych Europejczyków żyje z niepełnosprawnością, a klawiaturą posługuje się także spora grupa użytkowników bez żadnego orzeczenia. Sklep z miesięcznym ruchem liczonym w setkach tysięcy wizyt wycina więc segment klientów porównywalny z niejedną kampanią pozyskaniową, za którą płaci co miesiąc.
Naprawa w opisanym scenariuszu nie wymagała przebudowy sklepu. Mini-koszyk dostał obsługę klawiatury, kafelki dostawy wróciły do natywnych pól radio ze stylowaniem, obok mapy pojawiła się przeszukiwalna lista punktów, a operator płatności po zgłoszeniu poprawił zarządzanie fokusem w ramce. Najdroższym elementem całości okazało się to, że przez dwa lata nikt nie zrobił testu, który zajmuje kwadrans.