Czym jest użyteczność strony — bez żargonu
Norma ISO 9241-11 opisuje użyteczność jako stopień, w jakim określeni użytkownicy mogą osiągnąć określone cele skutecznie, efektywnie i z satysfakcją w określonym kontekście. W języku strony firmowej oznacza to trzy pytania: czy klient znajdzie to, czego szuka, czy zrobi to szybko i czy po drodze się nie zirytuje.
UX, czyli doświadczenie użytkownika, to pojęcie szersze. Obejmuje całą drogę klienta — od wyniku w wyszukiwarce, przez stronę, aż po odpowiedź na zapytanie. Na stronie firmowej rozmawiamy jednak głównie o użyteczności, bo to ją najłatwiej poprawić i zmierzyć.
Ważne rozróżnienie: użyteczność to nie to samo co ładny wygląd. Strona może być piękna i męcząca albo skromna i bardzo wygodna. Dobry projekt łączy oba światy, ale gdy trzeba wybierać, wygrywa to, co pomaga klientowi wykonać następny krok.
Siedem zasad UX, które widać w wynikach
1. Pierwszy ekran odpowiada na trzy pytania
Co robisz, dla kogo lub gdzie działasz i co klient ma zrobić dalej. Jeśli po kilku sekundach tego nie wie, wraca do wyników wyszukiwania. Ogólne hasło w rodzaju „Jakość i pasja” nie odpowiada na żadne z tych pytań. Zdanie „Remonty łazienek w Lublinie i okolicach — wycena po oględzinach” odpowiada na wszystkie.
Unikaj też karuzeli z kilkoma slajdami w tym miejscu. Wiele osób zobaczy tylko pierwszy slajd, a pozostałe odciągają uwagę od najważniejszego komunikatu.
2. Nawigacja w języku klienta
Menu powinno mówić słowami, którymi klient myśli: „Cennik”, „Realizacje”, „Dojazd”, „Kontakt”. Nazwy wymyślone w firmie — „Rozwiązania”, „Strefa wiedzy”, „Nasze DNA” — każą zgadywać. Menu jest w tym samym miejscu na każdej podstronie, logo prowadzi na stronę główną, a na telefonie najważniejsza akcja, na przykład telefon, jest widoczna bez otwierania menu.
3. To, co klikalne, wygląda na klikalne
Przyciski wyglądają jak przyciski, linki w tekście są podkreślone, a ten sam typ akcji ma zawsze ten sam wygląd. Jeśli raz przycisk jest zielony i prostokątny, a raz szary i okrągły, klient zaczyna się zastanawiać, zamiast działać. Opisy przycisków mówią, co się stanie: „Umów pomiar” zamiast „Kliknij tutaj”.
4. Tekst do przeglądania, nie tylko do czytania
Na stronie mało kto czyta od pierwszego do ostatniego słowa. Ludzie przebiegają wzrokiem nagłówki i szukają swojego pytania. Pomagają śródtytuły będące odpowiedziami, krótkie akapity, listy i konkrety: ceny „od”, obszar działania, terminy. Czytelność to także dobrze dobrane kolory i kroje pisma — z wyraźnym kontrastem tekstu i tła.
5. Formularz krótki i przewidywalny
Tylko pola, których naprawdę potrzebujesz. Etykieta widoczna nad polem, a nie tylko szary tekst w środku, który znika przy pisaniu. Błąd opisany słowami przy konkretnym polu, nie samym czerwonym kolorem. Po wysłaniu jasne potwierdzenie i informacja, kiedy możesz spodziewać się odpowiedzi. Szczegóły rozpisuję w artykule o tym, jak zrobić formularz kontaktowy, który ludzie wypełniają.
6. Najpierw telefon
Google indeksuje i ocenia strony na podstawie ich wersji mobilnej, a wiele osób zobaczy Twoją stronę właśnie na telefonie. Liczy się więc wygoda kciuka. Wytyczne WCAG 2.2 na poziomie AA wymagają, by cele dotyku miały co najmniej 24 × 24 piksele albo odpowiedni odstęp od sąsiednich, z wyjątkami takimi jak linki w tekście. Poziom AAA mówi o 44 × 44 pikselach. W praktyce główne przyciski warto robić wygodnie duże, a numer telefonu — klikalny, żeby połączenie ruszało jednym dotknięciem. Zasady dobrze opisuje W3C w objaśnieniu kryterium rozmiaru celu.
7. Szybko i bez przeskakiwania
Strona, która długo się ładuje albo przesuwa treść w chwili, gdy chcesz kliknąć, irytuje bardziej niż nijaki wygląd. Najważniejsza treść i przycisk powinny pojawić się od razu, a reszta może się doczytać. Tę część doświadczenia mierzą wskaźniki Core Web Vitals: szybkość wyświetlenia głównej treści, reakcja na kliknięcie i stabilność układu.
UX a Google: co naprawdę wiadomo
Wokół UX i pozycji w Google narosło sporo mitów, więc trzymam się tego, co Google pisze w swojej dokumentacji o doświadczeniu na stronie:
- nie istnieje jeden sygnał „doświadczenia strony” — to zbiór różnych aspektów,
- wskaźniki Core Web Vitals są używane przez systemy rankingowe Google,
- pozostałe aspekty doświadczenia nie podnoszą bezpośrednio pozycji,
- Google zawsze stara się pokazać najbardziej trafne treści, nawet jeśli doświadczenie na stronie jest słabsze — dobre doświadczenie pomaga przede wszystkim wtedy, gdy wiele stron jest podobnie pomocnych.
W pytaniach do samodzielnej oceny Google wymienia między innymi: dobre Core Web Vitals, bezpieczne połączenie, poprawne wyświetlanie na telefonie, brak nadmiaru reklam zasłaniających treść, brak natrętnych okienek i łatwe odróżnienie głównej treści od reszty. Całość znajdziesz w dokumentacji Google o doświadczeniu na stronie.
O okienkach warto pamiętać szczególnie. Google odradza nakładki, które zasłaniają całą stronę, a za w porządku uznaje banery zajmujące niewielką część ekranu. Okno zapisu do newslettera wyskakujące dwie sekundy po wejściu to dokładnie to, czego nie chce ani Google, ani klient.
Wniosek: UX nie zastąpi dobrych treści, ale słaba użyteczność potrafi zmarnować dobre treści. A najważniejszy efekt i tak jest poza Google — ten sam ruch na stronie zamienia się w więcej telefonów i zapytań, gdy klient bez wysiłku znajduje odpowiedź.
Jak sprawdzić użyteczność bez dużego budżetu
- Test z kilkoma osobami. Poproś kilka osób spoza firmy, żeby na swoim telefonie wykonały konkretne zadania: „Sprawdź, ile kosztuje usługa X”, „Umów się na sobotę”, „Sprawdź, czy dojeżdżamy do Twojej miejscowości”. Patrz i nie podpowiadaj. Każde zawahanie to wskazówka.
- Pytania od klientów. Jeśli przez telefon ciągle słyszysz te same pytania, odpowiedzi brakuje na stronie albo są źle schowane. Zapisuj je przez tydzień.
- Analityka. Sprawdź, z których podstron ludzie przechodzą do kontaktu, a na których kończą wizytę, i ile osób klika w numer telefonu czy adres e-mail. Do tego potrzebne jest poprawne mierzenie zdarzeń i zgoda użytkownika tam, gdzie wymagają jej przepisy.
- Search Console. Zobacz, po jakich frazach ludzie trafiają na stronę. Jeśli szukają „cena”, a na stronie nie ma ani słowa o cenach, to problem jednocześnie z treścią i z użytecznością.
- Mapy kliknięć i nagrania sesji. Pokazują, gdzie ludzie klikają i dokąd przewijają. Używaj ich z umiarem i zgodnie z zasadami zgód na pliki cookies.
Chcesz zacząć jeszcze prościej? Opisałem szybki test strony w 15 minut, który przejdziesz sam, z telefonem i kartką.
Najczęstsze błędy UX na stronach małych firm
- Karuzela zdjęć zamiast jasnego komunikatu na pierwszym ekranie.
- Numer telefonu tylko w stopce albo jako obrazek, którego nie da się kliknąć ani skopiować.
- Cennik lub menu w pliku PDF, który na telefonie trzeba powiększać palcami.
- Formularz z kilkunastoma obowiązkowymi polami i bez potwierdzenia wysyłki.
- Wyskakujące okno zasłaniające treść, zanim klient zdążył cokolwiek przeczytać.
- Jasnoszary tekst na białym tle i drobny druk na telefonie.
- Linki „Czytaj więcej” bez informacji, dokąd prowadzą.
- Strona sprawdzana tylko na dużym monitorze w biurze.
Większość z tych błędów da się naprawić bez budowania strony od nowa. Jeśli jednak problemów jest dużo, a sama strona jest trudna w edycji, zwykle taniej wychodzi odświeżenie strony niż łatanie każdej rzeczy osobno.
Jak podchodzę do UX przy projekcie strony
Zaczynam od pytań, które klient zadaje, zanim się zgłosi, i układam stronę w tej kolejności. Dobrze to widać w moich autorskich koncepcjach dla fikcyjnych marek, które pokazuję w realizacjach. W koncepcji gabinetu najpierw odpowiadam na pytania pacjenta: jak wygląda pierwsza wizyta, kto przyjmie, jak się przygotować — i dopiero potem prowadzę do kontaktu z recepcją. W koncepcji zakładu przemysłowego strona prowadzi do przesłania dokumentacji i rozmowy o konkretnym elemencie, zamiast do kolejnego ogólnego „czytaj więcej”.
Podstawy użyteczności są w standardzie każdej strony, którą robię: responsywność, szybkie działanie, sprawdzone formularze, panel CMS do samodzielnej edycji i podstawowa analityka, żeby było widać, co działa. Odświeżenie istniejącej strony zaczyna się od 3 490 zł netto, a strona od zera z 5–8 widokami — od 5 990 zł netto. Zanim cokolwiek podpiszesz, zobaczysz propozycję z kierunkiem, zakresem i ceną.