Wyobraź sobie, że ktoś stoi na przystanku. Ma dwie minuty. Chce sprawdzić godziny otwarcia, cennik albo po prostu znaleźć numer telefonu.

Wchodzi na stronę.

Tekst jest mały. Trochę mrużą oczy, ale może być. Szukają przycisku — jest, ale mały i przyklejony do innego elementu. Klikają nie to, co chcieli. Cofają się. Próbują znowu. Strona wygląda elegancko, ale coś nie gra. Autobus przyjeżdża. Odkładają telefon.

Tego wejścia na stronie nie ma. Nikt nie wie, że ktoś właśnie chciał się skontaktować albo coś kupić — i po prostu odpuścił.

To nie jest wymyślony scenariusz. To jest to, co dzieje się codziennie na stronach, które na desktopie wyglądają świetnie, ale na telefonie sprawiają, że używanie ich staje się zbędnym wysiłkiem.

Mobile nie wybacza tak łatwo jak desktop

Na dużym ekranie wiele rzeczy jeszcze „jakoś działa”. Tekst jest może trochę za mały, ale da się przeczytać. Przycisk jest może trochę za blisko innego elementu, ale kursor trafi. Kontrast jest może na granicy — ale monitor jest jasny i warunki dobre.

Na telefonie te same kompromisy stają się problemami. Bo użytkownik ma mniejszy ekran, mniej precyzyjny palec zamiast kursora, często gorsze warunki oświetleniowe i dużo mniej cierpliwości. Wszystko, co było „wystarczające”, przestaje wystarczać.

Właśnie dlatego mobile jest tak uczciwym testem dostępności. Nie dlatego, że jest trudniejszy technicznie. Dlatego, że nie ma w nim miejsca na udawanie.

Gdzie najczęściej się sypie

Wróćmy do osoby na przystanku. Co konkretnie sprawiło, że odpuściła?

Pewnie nie jeden błąd. Raczej kilka małych rzeczy naraz.

Tekst, który wymaga skupienia. Rozmiar fontu, który na desktopie wygląda subtelnie i nowocześnie, na telefonie często oznacza mrużenie oczu. Do tego ciasna interlinia, długie bloki bez oddechu i nagłówki, które na małym ekranie przestają prowadzić. Czytanie staje się pracą zamiast naturalnym przepływem.

Przyciski, w które trudno trafić. Palec jest mniej precyzyjny niż kursor — i to nie jest wada użytkownika. To jest fakt, który projekt powinien uwzględniać. Drobne linki obok siebie, małe checkboxy, ikony bez zapasu miejsca — wszystko to sprawia, że użytkownik klika nie to, co chciał, i traci zaufanie do strony.

Układ, który na desktopie miał sens, na telefonie przestaje prowadzić. Sekcje, które obok siebie tworzyły logiczną całość, po złożeniu w pionowy pasek zaczynają się mieszać. Ważne treści lądują za mało widocznie. Kolejność elementów przestaje odpowiadać temu, czego użytkownik szuka. To nie awaria — to brak świadomego myślenia o pionowym rytmie strony.

Tekst na obrazie, który staje się nieczytelny. Delikatne hasło w hero, cienka typografia na tle grafiki — na desktopie efektowne, na telefonie często niemożliwe do odczytania. Proporcje się zmieniają, tekst dostaje mniej miejsca, tło staje się bardziej agresywne. Wygląda dobrze w projekcie, działa słabo w praktyce.

Formularz, który walczy z klawiaturą. Otwarcie klawiatury na telefonie zmienia wszystko. Pola się przesuwają, część ekranu znika, etykiety stają się mało czytelne. Jeśli do tego formularz ma zbyt wiele pól i za małe odstępy, użytkownik po prostu go zamknie. Nie dlatego, że nie chciał wypełnić — tylko dlatego, że było za trudno.

Kontrast, który nie uwzględnia realnych warunków. Na telefonie użytkownik jest często w ruchu, w słońcu, w pośpiechu. Tekst, który w biurze na jasnym monitorze jeszcze da się przeczytać, w tych warunkach po prostu znika. Jeśli kontrast jest „na granicy”, mobile tę granicę bardzo szybko przekracza.

Za dużo rzeczy naraz na małym ekranie. Kilka wyróżnionych elementów obok siebie, nadmiar CTA, ozdobniki, które na desktopie budowały klimat — na telefonie szybciej tworzą chaos niż wartość. A chaos jest inną formą braku dostępności. Użytkownik nie wie, co jest ważne, więc nie robi nic.

Nie mniejsza wersja desktopu, tylko inna wersja strony

Tu leży główny błąd myślenia o mobile.

Strona mobilna nie powinna być tym samym projektem, tylko zmniejszonym. Powinna być świadomą decyzją o tym, co jest naprawdę ważne i w jakiej kolejności użytkownik tego potrzebuje.

Prościej, czytelniej, z większym naciskiem na pionowy rytm treści i na to, żeby każda akcja była łatwa do wykonania jedną ręką, na przystanku, w dwie minuty.

Właśnie dlatego najlepszym testem dostępności strony nie jest patrzenie na nią na dużym ekranie w wygodnym fotelu. Jest wyjście z telefonem na zewnątrz i po prostu spróbowanie jej użyć.

Szybka checklista

Kilka pytań, które warto zadać sobie przy każdej stronie:

• Czy tekst da się wygodnie przeczytać bez powiększania?
• Czy przyciski i linki łatwo kliknąć palcem?
• Czy elementy nie są zbyt blisko siebie?
• Czy kolejność sekcji nadal ma sens po złożeniu w kolumnę?
• Czy tekst na obrazach nadal jest czytelny?
• Czy formularz działa sensownie po otwarciu klawiatury?
• Czy kontrast jest wystarczający w słońcu i ruchu?
• Czy strona nie jest zbyt głośna wizualnie?

Jeśli coś budzi wątpliwość — właśnie tam zaczyna się problem.

Osoba z przystanku wróci na stronę? Może. Ale nie musi.

I to jest najuczciwszy argument za tym, żeby mobile traktować nie jako poprawkę do desktopowego projektu, tylko jako jeden z pierwszych testów tego, czy strona naprawdę działa.