BlogBlooooog

Małe ekrany, wielkie wyzwania

2025-05-31

Dostępność cyfrowa przestaje być luksusem, a staje się, choć powoli, standardem, którego oczekują zarówno użytkownicy, jak i regulatorzy. Gdy tworzycie stronę internetową, nie możecie zapominać, że coraz więcej osób korzysta z niej za pomocą urządzeń mobilnych. Smartfony i tablety to obecnie podstawowe narzędzia do przeglądania internetu – i to niezależnie od systemu operacyjnego. Wg danych z roku 2024, 76% czasu użytkownicy spędzają w sieci korzystając ze smartfonów.

Dlaczego testować na Androidzie i iOS?

Choć oba systemy oferują podobny zestaw funkcji ułatwień dostępu, to różnią się detalami implementacji. Różnice mogą dotyczyć np. działania czytników ekranu (VoiceOver w iOS, TalkBack na Androidzie), gestów nawigacyjnych czy obsługi powiadomień. To, co na jednym systemie działa bez zarzutu, na drugim może powodować problemy. Warto więc sprawdzić działanie kluczowych elementów – menu, formularzy, przycisków czy komunikatów systemowych – na obu platformach.

Jak testować?

Testowanie dostępności na urządzeniach mobilnych nie wymaga zakupu specjalistycznego sprzętu czy drogiego oprogramowania. Obecnie każdy system operacyjny wyposażony jest w czytnik ekranu. Jedne są gorsze, inne lepsze, jedne bardziej dokładne, inne mniej, z jednych wygodniej będzie wam korzystać, inne sprawią problemy - ale wszystkie wystarczą do tego, aby stronę przetestować.

Urządzenia spod znaku nadgryzionego jabłka mają doskonały VoiceOver, który można uruchomić zarówno na komputerach, jak i na tabletach oraz telefonach tej firmy. Na Windows użytkownicy mają nieco większy wybór. W systemie do dyspozycji jest TalkBack, a po krótkiej instalacji można też wykorzystać choćby NVDA czy JAWS.

Kiedy już czytnik gotowy, wystarczy go uruchomić i przejść przez najważniejsze ścieżki na stronie: od wejścia na stronę główną, przez formularze kontaktowe, po składanie zamówień. Sprawdzić należy, czy czytnik ekranu poprawnie odczytuje treść, czy przyciski i linki mają sensowne opisy i czy można przejść całą ścieżkę bez dotykania ekranu.

Praktyczne tipy

Skróty i gesty dla VoiceOver (iOS): stuknijcie trzykrotnie trzema palcami, aby włączyć/wyłączyć VoiceOver. Przeciągajcie jednym palcem, aby przesuwać fokus, stuknijcie dwukrotnie, aby aktywować element.

Skróty i gesty dla TalkBack (Android): włączcie TalkBack z menu ułatwień dostępu, a potem przesuwajcie palcem w lewo/prawo, aby przechodzić między elementami. Stukajcie dwukrotnie, aby aktywować.

Test kontrastu i czytelności: ustawcie w systemie tryb dużego kontrastu i większy font – pozwoli to wychwycić słabe punkty w projekcie strony. Zobaczycie, jak strona reaguje na powiększenie elementów dbając jednocześnie o swoją funkcjonalność.

Przegląd elementów interaktywnych: przy włączonym czytniku ekranu przejdźcie po stronie tylko za pomocą gestów lub klawiatury (jeśli podłączycie np. fizyczną klawiaturę Bluetooth do telefonu) – sprawdźcie, czy wszystkie elementy są dostępne.

Sprawdźcie zachowanie strony przy rotacji ekranu: niektóre elementy mogą się przemieszczać, nachodzić na siebie lub znikać w trybie poziomym.

Testujcie także bezpośrednio w przeglądarce mobilnej: np. Safari lub Chrome, ale pamiętajcie, że nie zastąpi to testów na fizycznym urządzeniu, nawet jeśli pomniejszyliście ekran, na którym oglądacie stronę.

Testujcie na dwa sposoby: uruchomcie czytnik, aby przeczytał całą zawartość strony. Jeśli zrobi to prawidłowo, przetestujcie poruszanie się po stronie klawiaturą, co doprowadzi przeglądania jedynie elementów interaktywnych. Strona powinna "czytać się" w każdej z tych form dobrze.

Najczęstsze błędy – na co zwracać uwagę?

Podczas testów często okazuje się, że strona nie spełnia podstawowych wymagań dostępności, nawet jeśli na komputerze wygląda i działa bez zarzutu. Jednym z najczęstszych błędów jest brak odpowiednich etykiet dla elementów interaktywnych – na przykład przycisków czy ikon. Zamiast opisu „Zamknij” użytkownik słyszy „Przycisk”, co nie daje żadnej informacji o jego działaniu.

Kolejny problem to zbyt małe przyciski – na ekranie dotykowym to szczególnie ważne, bo trudno je obsłużyć.
Warto też pamiętać o odpowiednim kontraście – często w jasnym świetle elementy stają się niemal niewidoczne, szczególnie jeśli tryb ciemny nie został uwzględniony.

Na liście problemów są także elementy, które nie reagują na gesty czy skróty i nie da się ich uruchomić za pomocą czytnika ekranu. Wreszcie, spotyka się strony, które nie pozwalają na powiększanie tekstu, a to dla wielu użytkowników jest podstawową funkcją ułatwiającą czytanie.

Podsumowując

Testowanie strony pod kątem dostępności mobilnej powinno być jednym z elementów jakie musicie zrobić, aby z czystym sumieniem powiedzieć, że strona jest dostępna. Warto testowanie przeprowadzać na obu systemach (Android/iOS) – bo tylko wtedy macie pewność, że strona będzie przyjazna i funkcjonalna dla ogromnej większości użytkowników. Nawet jeśli nie jesteście specjalistami od dostępności, wprowadzenie kilku prostych zasad i wykorzystanie wbudowanych narzędzi systemowych to krok we właściwym kierunku.