Strona na telefonie: jak sprawdzić, czy Twoja działa dobrze

Żeby sprawdzić, czy Twoja strona dobrze działa na telefonie, nie potrzebujesz żadnych narzędzi ani wiedzy technicznej. Wystarczy telefon, kwadrans czasu i gotowość, żeby przejść przez własną stronę tak, jak zrobiłby to klient, który stoi na przystanku i szuka numeru do warsztatu. Jeśli w tym czasie zaczniesz się irytować, klient irytuje się tak samo, tylko szybciej wychodzi.

Powód jest prosty: ludzie szukają lokalnych usług głównie z telefonu, a Google ocenia strony przede wszystkim po ich wersji mobilnej. To wersja na smartfona jest dla wyszukiwarki tą „prawdziwą”. Piękna strona, która na komputerze wygląda świetnie, a na telefonie wymaga powiększania palcami, traci na obu frontach.

Zacznij od swojego telefonu, nie od narzędzi

Otwórz stronę na własnym smartfonie. Najlepiej w przeglądarce, w której nigdy jej nie oglądałeś, żeby nic nie było zapamiętane. A potem po prostu poczuj, jak to jest.

Pierwsze wrażenie liczy się najbardziej. Czy od razu widać, czym się zajmujesz i gdzie? Czy nie musisz przewijać przez trzy ekrany zdjęcia, żeby dotrzeć do pierwszego zdania? Czy tekst da się przeczytać bez powiększania? Jeśli musisz rozsuwać palce, żeby cokolwiek zobaczyć, strona nie jest dostosowana do telefonu i to jest problem, którego żadna poprawka kosmetyczna nie załatwi. Trzeba ją zbudować na nowo albo przynajmniej mocno przebudować.

Zwróć uwagę na poziome przewijanie. Jeśli strona „ucieka” na boki, gdy przesuniesz palcem, jakiś element jest szerszy niż ekran. Zwykle to tabela, duży obraz albo źle ustawiony baner. Klient tego nie nazwie, powie tylko, że strona jest jakaś dziwna.

Pięć rzeczy, które klient robi na Twojej stronie

Potem przejdź przez to, po co ludzie naprawdę wchodzą. Nie klikaj na chybił trafił, zrób to po kolei.

Najpierw menu. Na telefonie zwykle chowa się pod ikoną z trzema kreskami. Czy otwiera się za pierwszym dotknięciem? Czy da się je zamknąć? Czy po wybraniu podstrony strona rzeczywiście się zmienia, a menu nie zasłania połowy treści?

Potem numer telefonu. To jest chyba najważniejszy test. Dotknij numeru na stronie. Powinno uruchomić się wybieranie, bez kopiowania i przeklejania. Jeśli numer jest zwykłym tekstem albo, co gorsza, obrazkiem, tracisz telefony od ludzi, którzy mieli ochotę zadzwonić od razu. To jedna z najtańszych poprawek, jakie istnieją, a mimo to wiele stron ją pomija.

Trzecia sprawa to adres. Dotknięcie go powinno otwierać mapę, a jeśli nie otwiera, adres musi przynajmniej dać się łatwo skopiować. Dla lokalnej firmy to ważniejsze niż połowa rzeczy, o których zwykle dyskutuje się przy projektowaniu strony.

Czwarta to formularz kontaktowy. Wypełnij go naprawdę i wyślij. Czy klawiatura zasłania pola? Czy po dotknięciu pola ekran nie przeskakuje w dziwne miejsce? Czy na pole z numerem telefonu wyskakuje klawiatura z cyframi? Czy po wysłaniu widzisz potwierdzenie? I, co najważniejsze, czy wiadomość do Ciebie w ogóle dotarła? Zdarza się, że formularz działa na pokaz, a poczta od lat ląduje w spamie albo nigdzie.

Piąta rzecz to przyciski i linki. Palec jest grubszy od kursora myszy. Jeśli dwa linki leżą tak blisko siebie, że trafiasz w niewłaściwy, albo przycisk jest mniejszy od opuszka, klient zrezygnuje po drugiej próbie. Google zaleca, żeby elementy do dotykania miały mniej więcej 48 pikseli, czyli tyle, ile zajmuje wygodne dotknięcie kciukiem.

Szybkość: sprawdź na słabym zasięgu

Strona, która na biurowym wi-fi otwiera się błyskawicznie, na wsi albo w piwnicy sklepu może ładować się całe wieki. Wyłącz wi-fi w telefonie, zostaw samą sieć komórkową i otwórz stronę jeszcze raz. Jeśli patrzysz na pusty ekran dłużej niż kilka sekund, jest powód do niepokoju.

Do bardziej konkretnej oceny służy darmowe narzędzie Google, PageSpeed Insights (pagespeed.web.dev). Wklejasz adres, wybierasz zakładkę z wynikiem dla telefonu i dostajesz ocenę oraz listę uwag. Nie przejmuj się każdym punktem na liście, część dotyczy rzeczy, które małej firmie nic nie dają. Wynik traktuj orientacyjnie. Jeśli jest wyraźnie czerwony, a strona faktycznie wolno się wczytuje, to rozmowa z wykonawcą jest w pełni uzasadniona. Najczęstszą przyczyną są za duże zdjęcia wrzucone prosto z aparatu, prawie nigdy coś bardziej wymyślnego.

Jak to wygląda na innych telefonach

Twój telefon to tylko jeden z tysięcy modeli. Nie musisz ich kupować, ale poproś o rzut oka kogoś z rodziny albo kogoś z pracowników. Najlepiej osobę z innym systemem niż Twój (jeśli masz iPhone’a, niech sprawdzi ktoś z Androidem, i odwrotnie). Różne przeglądarki potrafią wyświetlić ten sam kod trochę inaczej i czasem coś, co u Ciebie wygląda dobrze, u kogoś innego ma ucięty przycisk.

Jeśli siedzisz przy komputerze, możesz też podejrzeć stronę w „trybie telefonu”. W przeglądarce Chrome naciśnij F12, a potem kombinację Ctrl+Shift+M. Zobaczysz stronę w ramce o rozmiarze smartfona i możesz wybrać konkretny model z listy. To przybliżenie, a nie prawdziwy telefon, więc nie zastąpi ono dotknięcia palcem, ale pozwala szybko wyłapać rzeczy, które się rozjeżdżają.

Co zrobić, gdy coś jest nie tak

Zapisz sobie, co dokładnie nie działa. „Strona jest zła na telefonie” nic wykonawcy nie mówi, a „numer telefonu w stopce nie jest klikalny, a formularz na podstronie Kontakt zasłania klawiatura” to zlecenie na godzinę pracy. Zrzuty ekranu pomagają jeszcze bardziej.

Drobne rzeczy, jak klikalny numer, przycisk za mały albo zdjęcia za ciężkie, da się zwykle poprawić szybko i niedrogo. Gorzej, gdy strona została zbudowana na starym szablonie sprzed lat i na telefonie jest po prostu rozciągniętą wersją komputerową. Wtedy łatanie dziur bywa droższe niż nowa strona, a efekt i tak słaby. Tu trzeba zdecydować, czy dalej inwestować w starą stronę, czy zacząć od nowa.

Moja rada jest prosta: powtarzaj ten kwadrans raz na pół roku i za każdym razem, gdy ktoś zmienia coś na stronie. Zmiany mają to do siebie, że psują rzeczy, o które nikt nie pytał. Jeśli planujesz nową stronę albo masz wątpliwości co do obecnej, opisz nam swoją sytuację, pierwsza konsultacja jest bezpłatna.