300 milionów dolarów obrotu więcej w ciągu roku. Tyle zyskał amerykański sklep internetowy dodając na swoją stronę… jeden przycisk. Niemożliwe? A jednak. Właśnie o tyle wzrosła wartość zamówień, kiedy zamiast wypełniać formularz na ostatnim etapie zakupów, klient od razu mógł przystąpić do płatności. Potencjał Twojego sklepu też jest blokowany przez zły projekt strony? Zainwestuj w User Experience – to Ci się opłaci!
Dlaczego UX na stronie www jest taki ważny?
Strona internetowa zaprojektowana z myślą o komforcie użytkowników, a nie tylko po to, aby była „ładna”, wpływa w znacznym stopniu na konwersje. W zależności od tego, jaki jest główny cel witryny, konwersje oznaczają różne działania:
- zakup produktu,
- wykupienie płatnej subskrypcji,
- wysłanie formularza wyceny,
- rejestrację do newslettera
Zadaniem UX jest przybliżenie użytkownika do wykonania pożądanej przez Ciebie akcji. Właśnie dlatego powinieneś zadbać, aby witryna spełniała najważniejsze założenia UX.
Poniżej znajdziesz pięć głównych obszarów UX, o które powinieneś zadbać na stronie.
Informuj użytkowników o tym, co się dzieje i dlaczego
Informowanie użytkownika, w jakim miejscu strony jest albo do jakiego momentu zakupu doszedł uchroni go przed dezorientacją oraz ograniczy możliwość popełnienia błędów. W niektórych przypadkach również skróci drogę do określonych treści na stronie oraz przybliży do konwersji.
Koniecznie zadbaj na stronie o:
- nawigację okruszkową (ang. breadcrumbs) – poza umożliwieniem szybkiego przejścia między stronami informuje o lokalizacji użytkownika w strukturze serwisu,
- sekcję ATF (ang. above the fold), czyli pierwszy ekran widoczny na urządzeniu – powinien on jednoznacznie określać tematykę strony, poprzez np. nagłówek pierwszego poziomu (znacznik HTML <h1>) lub/i grafikę (ang. hero image),
- przyjazny adres URL – najlepiej, aby miał odzwierciedlenie w architekturze strony,
- pokazanie statusu i postępów przy np. wypełnianiu formularzy czy finalizowaniu zakupu,
- okna i powiadomienia z dodatkowymi informacjami przy np. wykonaniu akcji lub wprowadzaniu błędnych danych.
Komunikaty i informacje wpływają również na poczucie kontroli użytkownika nad tym, co dzieje się na stronie i na co ma wpływ. Świadome zachowanie ograniczy jego błędy, a Tobie zaoszczędzi czas związany z naprowadzaniem go przez e-mail, chat albo telefon.
Miej na uwadze formę komunikatów. Najlepiej, aby były zgodne z tym, czego użytkownik doświadcza na innych stronach, w innych systemach czy w świecie rzeczywistym. Jeśli prowadzisz sklep internetowy z odzieżą, zadbaj o to, aby rozmiary były podane według europejskiej miary, a wymiary ubrań liczone w centymetrach. Podstawa? Owszem, ale jakże konieczna i niestety często pomijana.
Pokazuj, zamiast oczekiwać zaangażowania
Wszechobecny pośpiech przekłada się także na korzystanie z internetu. Nie czyta się teraz artykułu czy opisu „od deski do deski”, a raczej skanuje się stronę wzrokiem.
Użytkownik skupia uwagę tylko na wybranych elementach np. nagłówkach czy grafikach. Potwierdzają to dane z narzędzia HotJar, wskazujące, że przeciętnie skroluje się od 1,5 do 2 ekranów strony. Dlatego masz mało czasu, aby przekonać użytkownika do działania.
Zadbaj zatem o opracowanie hierarchii typografii, która wyróżni kilka poziomów najważniejszych informacji na Twojej stronie internetowej. Tym samym będą one bardziej widoczne dla użytkowników.
Dobrym pomysłem jest umieszczenie zdjęć czy grafik, które są łatwiejsze w odbiorze niż sam tekst. W tym przypadku sprawdza się zasada, że jeden obraz jest wart tysiąca słów. Pamiętaj jednak, aby dobrze zatytułować grafikę w tzw. opisie alternatywnym, aby nie stracić potencjału SEO.
Ułatwiaj korzystanie ze strony na różnych urządzeniach
Zapewnienie wygody korzystania ze strony nie tylko na komputerze powinno być dla Ciebie priorytetem. Ma to znaczenie dla doznań użytkownika, wykonania pożądanych działań na stronie, ale również zapewnienia widoczności w Google’u. Strony bez wersji mobilnej po prostu mogą nie być wyświetlane w wynikach wyszukiwarki.
Projektowanie w pierwszej kolejności strony mobilnej (ang. mobile first design) a potem desktopowej jest coraz częstsze w biznesie. W tym podejściu tworzy się widoki dla urządzeń mobilnych, gdzie powierzchnia strony i atencja użytkownika jest zwykle mniejsza niż w przypadku użytkowników przeglądających witrynę tradycyjnie.
Smartfon stał się elementem codzienności. Według badań IAB liczba mobilnych odsłon oraz średni czas korzystania z telefonu w 2019 roku wzrosły o jedną trzecią.
Stosowanie responsywności ugruntowało swoją pozycję w tworzeniu stron, wypierając oddzielną i zarazem dedykowaną wersję witryny dla smartfonów. Cechą rozpoznawczą takiego podejścia była subdomena m.nazwadomeny.pl lub mobile.nazwadomeny.pl.
Korzystanie z frameworków RWD (ang. Responsive Web Design) ma wiele zalet. Zapewniają one dopasowanie do różnych rozdzielczości – od najmniejszych po największe urządzenia. Rozwiązanie to jest również mniej kosztowne. Nie musisz utrzymywać dedykowanej wersji stron oddzielnie dla urządzeń mobilnych, tabletów i komputerów.
Warto wspomnieć, że pojawiają się użytkownicy SmartTV, którzy mogą również na swoich telewizorach 4K przeglądać stronę internetową.
Coraz bardziej popularny staje się tzw. dark mode, czyli stosowanie ciemnych interfejsów na smartfonach czy komputerach. Warto umożliwić użytkownikowi przełączanie między wersją ciemną a jasną także na desktopowej wersji strony.
Stwórz zrozumiałą architekturę informacji dla użytkownika
To, że Ty wiesz, jak poruszać się po swojej stronie, nie oznacza, że wiedzą to potencjalni klienci. Dlatego opracowanie struktury witryny powinno odbywać się z myślą o użytkowniku. Warto zastosować metodę sortowania kart. Na karteczkach zapisujesz nazwy stron, a później sortujesz je w tematyczne grupy.
Do zadania warto zaprosić min. 5 osób, które z myślą o swoich celach pogrupują dane tematy w odpowiednie sekcje. Przekonasz się później, jak odmienne od Twojego może być podejście innych osób – często Twoich potencjalnych klientów.
Zapewnij swobodny przepływ użytkownika między stronami
Jeżeli masz już zaprojektowaną strukturę stron i podział tematyki, pomyśl o nawigacji i połączeniach między stronami.
Miej na uwadze, że odwiedzający nie chcą pamiętać, gdzie na witrynie dokładnie się znajdują. Oczekują możliwości przejścia między tematycznie powiązanymi sekcjami, które będą w naturalny sposób odpowiadać ich chęci dalszego eksplorowania strony. Widać to na przykład w sklepach online z ubraniami. Gdy jest na karcie konkretnego produktu, zainteresowany koszulą użytkownik chętnie przejrzy podobne modele albo wybierze do niej pasujące buty.
Wykorzystanie przycisku „wstecz” w przeglądarce świadczy o problemie z nawigacją lub niespełnieniu oczekiwań użytkownika względem strony, na którą się dostał.
Warto zastosować pętlę, która w naturalny sposób przeprowadzi użytkownika między 2-4 rożnymi typami stron bez konieczności cofania. Dla przykładu w sklepie może to być powrót do kategorii lub przejście do kolejnego podobnego produktu z karty produktowej. Ograniczy to opuszczanie serwisu, a użytkownik wykorzysta ten sam schemat nawigacji do zapoznania się z kolejnymi stronami.
Innym sposobem na nawigację w witrynie jest scrollowanie, np. dla stron kategorii. Strony z mechanizmem infinite scroll mogą przyśpieszyć przeglądanie Twojej oferty. Zysk dochodzący nawet do kilkudziesięciu sekund (porównując przeglądanie strony ze standardowym podejściem paginacji) przyśpieszy potencjalny wybór produktu lub usługi, a nawet zakup.
Czy wpływ UX na użytkowników można mierzyć?
Tak. Wykorzystuje się do tego analitykę opartą o analizę dwóch typów danych – ilościowych oraz jakościowych. Informacje zebrane o użytkowniku i jego zachowaniu pozwalają odpowiedzieć na pytanie co i dlaczego się dzieje na stronie internetowej.
Dane te zbiera się za pomocą narzędzi monitorujących ruch, cele i akcje, które wykonuje użytkownik w witrynie. Służą do tego np. Google Analytics czy HotJar. Na bazie pozyskanych tam informacji możesz planować dalszą rozbudowę serwisu lub skorygować błędy, jakie pojawiły się przy pierwotnym projekcie strony.
Jednym z częstych błędów na stronie jest rozbudowany formularz. Konieczność zostawienia wielu informacji może zniechęcać internautów do jego wypełnienia. Zanim podejmiesz decyzję o zmianie wyglądu formularza, wykonaj test A/B. Sprawdź liczbę zamówień poprzedzonych koniecznością wypełnienia bardziej i mniej rozbudowanego formularza. Podejmij potem decyzję opartą o wyniki testu.
Pamiętaj – UX to podstawa udanej strony
Projektując z myślą o UX powinieneś skupiać przed wszystkim na użytkowniku oraz tym, w jaki sposób strona wpływa na ocenę Twojej marki czy produktu.
Wprowadzając zmiany czy nowe funkcjonalności, pamiętaj, że Twój odbiorca ma bardzo mocno wypracowane wzorce zachowania. Wymuszenie na nim nowych nawyków może być trudne, dlatego testuj za każdym razem zmiany, które chcesz wdrożyć.
Zorientowanie na użytkownika przyniesie korzyści, dzięki którym Twoja strona rozwinie pełnię możliwości.
