Jak zoptymalizować sklep mobilny. Cz.2 | Blog X-Coding
jak-zoptymalizowac-sklep-mobilny-cz-2

Jak zoptymalizować sklep mobilny. Cz.2

24.03.2017 / / E-Commerce

W poprzednim wpisie starałem się odpowiedzieć na pytanie, dlaczego strona mobilna jest tak ważna oraz z czego wynikają różnice między korzystaniem z desktopowej, a mobilnej wersji. Tym razem chciałbym przejść o krok dalej i zająć się kwestią elementów do optymalizacji oraz tym. Żeby jeszcze lepiej wejść w temat, postaram się przedstawić kluczowe wskazówki w przyjaznej formie praktycznego poradnika.

Jak poprawić doświadczenia użytkownika w 8 krokach:

1. Zadbaj o interfejs

Istnieje pewna zależność między kolejnością projektowania strony na desktopową oraz mobilną wersję. Zdecydowanie najlepszym rozwiązaniem jest obranie za priorytet wersji mobilnej, a dopiero potem (na jej przykładzie) opracować koncepcję wersji na komputery stacjonarne. Powód jest prosty i powinien przekonać każdego niedowiarka — dużo łatwiej jest dodać coś do rozbudowanej desktopowej wersji, niż wyrzucić w uproszczonej mobilnej. Warto pamiętać, że pierwsza strona jest kluczowa i powinna prezentować atrakcyjne elementy Twojego sklepu oraz konkretne informacje o ofercie. Nie należy jednak przesadzać z ich ilością. Co za dużo, to niezdrowo — to właśnie prosta nawigacja jest kluczem do sukcesu w mobilnym e-Commerce.

2. Pamiętaj o specyfice mobile

Przypomnij sobie swoje ostatnie zakupy w sklepie mobilnym, a co istotniejsze, w jaki sposób doszło do ich finalizacji? Według ostatnich badań prawa dłoń jest najwygodniejszą i najczęściej używaną do trzymania smartfona. Nie utrudniaj klientowi zakupów i nie wymagaj od niego odrywania się od swoich obowiązków, by musiał angażować do swoich poszukiwań aż dwóch rąk. To stanowczo za dużo, a konieczność powiększenia okienka, by móc kliknąć „kup teraz” jest poddaniem się walkowerem w walce o finalizację transakcji. Najistotniejsze pola wymagające kliknięcia oraz wpisania powinny być na tyle duże, żeby nawet w ruchu, czy pośpiechu udało się wykonać zamierzony cel.

3. Formularz nie musi być już koszmarem

Wszyscy od Ciebie czegoś chcą, znasz ten ból? Twój klient spotyka się z tym problemem każdego dnia i ma już go zdecydowanie dosyć. Wyjdź mu naprzeciw i nie wymagaj wypełnienia koszmarnie długiego formularza, w którym często musi podać prawie tyle danych co w urzędzie. To jeden z najczęstszych powodów porzucenia koszyka, nie tylko w mobilnej wersji. Możliwość zalogowania się przez portale społecznościowe znacznie ułatwia przejście przez ten etap zakupów. Jeżeli jest to możliwe, podziel wszystkie kroki na sekcje i pomóż użytkownikowi w poprawieniu błędów, np. podświetlając je. Wymagaj jedynie niezbędnych danych, na resztę przyjdzie czas później. Dobrym rozwiązaniem jest zaznaczenie pól opcjonalnych oraz podanie klawiatury numerycznej w przypadku np. kodu pocztowego. Dobre doświadczenia na etapie formularza zapadają użytkownikowi w pamięci, dzięki czemu Twój sklep stanie się dla niego wzorem, do którego będzie chciał wracać.

4. Cierpliwość nie jest cechą mobilnych użytkowników

Użytkownicy mobilni wymagają szybszego czasu reakcji, niż korzystający z wersji desktopowej. Jest to kwestia często poruszana w poradnikach i artykułach branżowych, jednak problem prędkości ładowania się strony jest nadal istotny. Można temu zaradzić za pomocą kilku prostych rozwiązań, np. optymalizacji kodu, kompresji grafiki i filmów, poprawieniu czasu odpowiedzi serwera.

5. Wszyscy jesteśmy wzrokowcami

Możemy dywagować nad wieloma aspektami, ale bez wątpienia atrakcyjne zdjęcia produktów pozostają kluczowym czynnikiem decydującym o zakupie i to się raczej nie zmieni. Niedocenienie wizualnej prezentacji swoich produktów na stronie sklepu może nas słono kosztować — wtedy konkurencyjna oferta na nic się nie przyda.

Musimy ciągle pamiętać o specyfice mniejszego ekranu, jednak pomocne jest wprowadzenie zmiennej orientacji powiększonego zdjęcia, która będzie sygnalizowana odpowiednią ikoną. Użytkownik co prawda musi obrócić telefon, jednak nie wpływa to znacząco na jego wygodę, a z pewnością zwiększa jakość zdjęcia.

6. Zakupy to nie podchody

Poszukując produktu, często poruszamy się po wielu zakładkach, przez co tracimy orientację, gdzie tak naprawdę aktualnie jesteśmy. Takie szukanie może przywoływać nam na myśl zakupy w ogromnym centrum handlowym — o irytacje wówczas nie trudno. Powinniśmy poinformować użytkownika o dalszych krokach, prowadzących do finalizacji zakupu. Warto rozróżnić kolorami kolejne etapy oraz pozwolić użytkownikowi w prosty sposób edytować dane. Doskonałym rozwiązaniem jest pokazanie w nawigacji, gdzie klient się znajduje, skąd przyszedł i jak może wrócić do poprzedniego okienka. Z takimi ułatwieniami poruszanie się po naszym sklepie będzie płynne jak jazda na łyżwach, a zakupy dla staną się jeszcze prostsze.

7. Usprawniaj zakupy

Wejście na stronę produktu to jeden z kluczowych momentów zakupowych, Najlepszym rozwiązaniem jest pokazanie od razu, gdzie może dodać produkty do koszyka, zmienić ich ilość oraz parametry. Niedopuszczalne w e-Commerce jest zmuszanie użytkownika do szukania tych funkcjonalności. Must-have to wyróżniony kolorem przycisk „dodaj do koszyka”. Może wydawać się to oczywiste, jednak wiele sklepów jeszcze o tym zapomina.

Kolejnym etapem w usprawnieniu zakupu jest przeanalizowanie powiadomień, bowiem brak reakcji strony na produkty w koszyku może spowodować jego porzucenie. To wtedy jest odpowiedni moment na pokazaniu klientowi korzyści wynikających z zakupu oraz zachęcenie go odpowiednimi rabatami do sfinalizowania transakcji w określonym czasie. Nie pozwalajmy klientowi uciec w tak strategicznym momencie.

8. A może tak posortować…

Nie każdy użytkownik, który odwiedza naszą stronę, wie, czego szuka. Funkcja sortowania produktów, umieszczona w odpowiednich miejscach oszczędza użytkownikom przeglądania oferty i nawet jeżeli nie dokonają oni zakupu w tym momencie, to istnieje duże prawdopodobieństwo, że zrobią to kolejnym razem albo po powrocie do domu.

Nie domyślaj się, przetestuj

Aby uniknąć niepotrzebnego zastanawiania się i domysłów na temat przyjazności naszej mobilnej wersji, dobrze jest skorzystać z darmowego narzędzia Google Developers. W szybki sposób uzyskamy informację, które elementy naszej strony należy zoptymalizować i poprawić.

Nie domyślaj się Testowanie to podstawa

Podsumowanie

Podsumowując już temat optymalizacji mobilnej wersji strony internetowej, chciałbym zwrócić uwagę na szereg elementów, które irytują użytkowników mobilnych, szczególnie gdy traktuje się ich tak samo, jak użytkowników desktopowych. Nie da się ukryć, że czynniki zewnętrzne, które towarzyszą użytkownikom mobilnym, mają ogromny wpływ na ich wymagania — sama specyfika mobile wyklucza wiele rozwiązań, które występują w wersjach stacjonarnych. Nie każdy jest na tyle zdeterminowany, żeby powiększyć ekran strony albo szukać przycisku „Kup teraz”. Jeżeli zastanawiamy się nad uruchomieniem naszego wymarzonego sklepu internetowego, warto zadbać o wersję mobilną w pierwszej kolejności. Jeśli jeszcze tego nie zrobiliśmy, zalecane jest natychmiastowe zajęcie się tą kwestią.