UX na mobilnej wersji strony – o czym musisz pamiętać?

Ludzie otwierają strony internetowe na różnych urządzeniach. Trzeba o tym pamiętać podczas ich tworzenia. Szczególnie, kiedy jest to witryna sklepu. Ta musi być szczególnie użyteczna, aby zachęcić klienta do zakupu. Dziś poruszymy właśnie ten temat. Postaramy się opisać najważniejsze funkcjonalności mobilnej strony internetowej, o których powinno się pamiętać.

Czym jest UX strony?

Zanim przejdziemy do samych informacji, o czym należy pamiętać tworząc stronę na urządzenia mobilne postaramy się wytłumaczyć, czym jest samo UX. To skot od user experience, co można tłumaczyć jako doświadczenia użytkowników. Są to więc wszystkie odczucia jakich doznaje użytkownik podczas, w tym wypadku, korzystania ze strony internetowej sklepu. Celem każdego projektanta sklepu powinno być więc to, żeby doświadczenia było jak najbardziej pozytywne. Wszystko po to, żeby ktoś po prostu chętnie robił zakupy na stronie sklepu.

Czemu strona w wersji mobilnej musi być inaczej zaprojektowana?

Kiedy otwiera się jakąś witrynę na komputerze to na ma się po prostu znacznie większy ekran do dyspozycji. Można więc umieścić całkiem sporo informacji w jednym widoku a wszystko wciąż będzie czytelne i intuicyjne. Jeśli będzie chciało się umieścić tyle samo informacji w na wersji mobilnej stronie to będzie to po prostu fizyczne niemożliwe. Pogodzenie dużej ilości informacji z tym, aby były one czytelne. Dlatego właśnie strona mobilna powinna być zaprojektowana w odpowiedni sposób.

Czemu dopracowana wersja mobilna jest tak ważna?

Przede wszystkim dlatego, że ponad 50% całego ruchu w sieci jest oparta właśnie na urządzeniach mobilnych. Oznacza to, że średnio 50% wejść na stronę sklepu dokonuje się na smartfonie. Łatwo takich klientów zatracić bezpowrotnie jeśli zaoferuje się im niskiej jakości wersję mobilną strony. Ludzie, którzy robią zakupy w Internecie chcą, że by były one przede wszystkim wygodne. Strona sklepu powinna być więc przejrzysta i intuicyjna. Żeby tak było, trzeba ją odpowiednio zaprojektować. Zarówno w wersji mobilnej, jak i desktopowej.

Wersja mobilna strony – o czym pamiętać

Trzeba mieć na względzie to, że klienci często korzystają w różnych urządzeń w różnych sytuacjach. Przeglądanie internetu na smartfonie to przede wszystkim wszystko co dzieje się w ruchu. To znaczy użytkownicy gdzieś podróżują, przemieszczają się lub akurat maja chwilę bo na coś czekają. Wszystkie te sytuacje charakteryzują się tym, że w każdej chwili klient może zamknąć stronę. Trzeba więc pamiętać, że wersja mobilna strona nie powinna angażować klienta w czytanie nieistotnych treści, a na przynajmniej nie powinna mu ich podsuwać na początku.  Projektując stronę mobilną trzeba pamiętać że specyfika urządzenia na którym się ją przegląda jest całkiem inna. Często to inny rodzaj internetu, to znaczy wolniejszy, mniejszy ekran, brak precyzji jak w przypadku korzystania z myszki i wiele innych uproszczeń. Poniżej więc przedstawiamy kilka charakterystyk, o których powinno się pamiętać, przy tworzeniu strony mobilnej.

Prostota

Jak już wspominaliśmy, w przypadku wersji mobilnej strony na jednym ekranie mieści się znacznie mniej niż w przypadku monitora. Właśnie dlatego trzeba dobrze przefiltrować swoją stronę i na stronie głównej dać tylko to, co rzeczywiście będzie przydatne dla klienta w pierwszej chwili. Dobrze sprawdza się chociażby menu rozwijane, które pojawia się dopiero po kliknięciu na odpowiedni przycisk, wcześniej nie zasłaniając żadnego elementu strony.

Inna nawigacja

Trzeba pamiętać, że podczas korzystania z urządzenia na smartfonie nie ma się do dyspozycji myszki. Znacznie trudniejsze jest więc precyzyjne trafianie w określone przyciski. Wszystko więc powinno być po prostu większe w wersji mobilnej strony. Również sama czcionka. Oczywiście będzie można przez to pokazać znacznie mniej, ale przynajmniej będzie to czytelne.

Prędkość łącza internetowego

Z urządzeń mobilnych korzysta się nie tylko w domu czy w pracy, gdzie przeważnie ma się dostęp do szybkiego internetu. Smartfony to także użyteczność tak naprawdę wszędzie. Jednak wszędzie nie zawsze oznacza także szybki internet. Ktoś przeglądając strony w Internecie, bez względu czy robi to na komórce czy komputerze liczy przede wszystkim na wygodę użytkowania. Za nią stoi miedzy innymi prędkość. To znaczy ludzie są bardzo niecierpliwi, jeśli chodzi o przeglądanie sieci. Jeśli jakaś strona będzie ładować się z byt długo to po prostu ją opuszczą. W przypadku sklepu internetowego oznacza to brak transakcji. Co więcej taki klient raz zrażony do strony internetowej, może już nigdy na nią nie wrócić, a przynajmniej będzie trzeba zainwestować spore zasoby, aby zmienić jego zdanie i sprawić, że znowu wejdzie na stronę. Umieszczając więc cokolwiek bezpośrednio ze strony desktopowej na wersji mobilnej, powinno się pamiętać o tym, ile to wazy i jak długo się będzie ładować to na stronie. Może warto pominąć niektóre elementy, albo przynajmniej jakoś je zmniejszyć.

Odpowiedni rozmiar grafiki

To co zawsze najdłużej ładuje się na stronie, niezależnie od tego, czy jest to strona mobilna czy desktopowa, to grafika. Trzeba o tym szczególnie pamiętać podczas przygotowywania wersji mobilnej strony. Powinno się pozbyć wszystkich tych elementów graficznych, które nie są niezbędne. Z kolei, te które mają zostać także na stronie mobilnej powinno się odpowiednio zmniejszyć. Grafiki w przypadku ekranów smartfonów mogą mieć mniejsza rozdzielczość w porównaniu do tych dekstopowych, nawet jeśli mają wizualnie prezentować się na stronie tak samo dobrze.

Stwórz odpowiednią ilość pustych przestrzeni na stronie

Całkiem inaczej przegląda się stronę na smartfonie w porównaniu do komputera. Wspominaliśmy już też o tym, że precyzja jest całkiem inna. W końcu używa się swojego palca a nie kursora myszki. Dlatego ułożenie i ściśnięcie treści powinno być nieco inne w przypadku wersji mobilnej. Przede wszystkim nie powinno się niczego układać ciasno. Takie coś może powodować, że ktoś po prostu nie będzie klikał w to co chce, bo poszczególne elementy będą po prostu za blisko siebie. Druga rzecz to ciasno ułożone elementy są po prostu nieczytelne. Zdecydowanie przyjemniej, a zatem i wygodniej się czyta

Pop-up

To ten element, który denerwuje zarówno użytkowników na wersji desktopowej, jak i mobilnej. Jednak w tym pierwszym przypadku można jeszcze jakoś się z nimi pogodzić. Nie zajmują całej powierzchni i można je szybko zamknąć. Różnego rodzaju reklamy w wersji mobilnej często ładują się znacznie dłużej i nie można ich wcześniej zamknąć, a dodatkowo zajmują cały ekran. Mogą więc być na tyle irytujące, ze ktoś po prostu przestanie przeglądać stronę. Podobnie jest zresztą ze wszystkimi innymi reklamami i trzeba o nich pamiętać. Powinny być one zaprojektowane tak, aby strona mimo to była czytelna i wygodna  w użytkowaniu.

Formularze

Oczywiście jest to element, którego nie da się pominąć, jeśli chce się aby ktoś dokonał zakupu, albo zapisał się do newsletteru. Można jednak postarać się aby możliwe je uprościć. Przede wszystkim użytkownicy powinny być zmuszeni tylko do odpowiedzenia na te pytania i wątpliwości, które są naprawdę niezbędne do dokonania danej akcji. Dobrze jest dać możliwość ich wypełniania za pośrednictwem kont na innych portalach, np. Google czy Facebook.

Niezbędne informacje w jednym miejscu

Warto pamiętać o tym, bez względu na to czy to mobilna wersja strony czy desktopowa, ze wszystkie najważniejsze informacje powinny być w jednym miejscu, a przynajmniej powinien być do nich dostęp z jednego miejsca. Świetnie sprawdzi się np. stopka. To w niej powinny być linki do wszystkich istotnych informacji, takich jak o sposobach wysyłki, metodach płatności i innych.

Dodatkowe CTA

W przypadku strony sklepu CTA będzie dodanie do koszyka lub tak zwane „kup teraz”. W przypadku wersji mobilnej, kiedy na ekranie ma się możliwość wyświetlenia całej strony produktowej można je wyświetlać cały czas na ekranie użytkownika. W przypadku stron mobilnych, strona produktowa podzielna jest przeważnie na kilka widoków. Dobrym pomysłem jest, aby cały czas klient miał dostęp do dodania produktu do koszyka. Będzie to dla niego po prostu wygodne, a nigdy nie wiadomo, na jakim etapie czytania o produkcie zdecyduje się on na zakup.

Pomyśl o PWA

Nie każdy sklep musi mieć dedykowaną aplikację, ale warto pomyśleć o czymś pomiędzy zwykłą stroną internetową, a aplikacją mobilną. Tym właśnie jest PWA. Jest to aplikacja webowa pomyślana przede wszystkim z myślą o korzystaniu z niej przez smartfony. Daje duże korzyści dla samego użytkownika, przeglądanie jej może być dużo szybsze a więc i wygodniejsze. Z drugiej strony można na przykład wysyłać klientom notyfikacje w formie powiadomień, co znacznie zwiększa zdolności marketingowe takiej strony. Warto więc pomyśleć o takim rozwiązaniu, jeśli posiada się na stronę sklepu i myśli nad jej unowocześnieniem, Być może warto iść właśnie w tę stronę.

Przeczytaj także:

Potrzebujesz pomocy w stworzeniu sklepu internetowego do sprzedaży hurtowej lub detalicznej?
Potrzebujesz profesjonalnego doradztwa przy uruchomieniu platformy do sprzedaży hurtowej?
Umów bezpłatną konsultację