Poradnik: Lepiej nie mieć wersji mobilnej niż mieć ją źle prowadzoną
Czytasz niemal wszędzie, że mobile to dzisiaj bardzo istotny trend w e-handlu. Zachęcony dostępnością rozwiązań mobile w IAI-Shop.com uruchamiasz drugą mobilną wersję sklepu lub maskę RWD. Ale niewłaściwie zarządzana strona mobilna lub RWD zmniejszy Twoją sprzedaż. O ile? Nawet o 50%! Pisaliśmy o tym równo rok temu w poradniku "3 najczęstsze błędy jakie popełniają sklepy internetowe przy wersjach mobilnych sklepów. Ale wraz ze wzrostem popularności sklepów mobilnych, a szczególnie RWD, błędy opisane poniżej stały się dosłownie plagą. Jeżeli posiadasz sklep mobilny, zostanie on otwarty nawet przez 50% odwiedzających na smartfonie. W przypadku gdy uniemożliwisz nawigowanie, klient stwierdzi, że sklep jest uszkodzony i nie będzie odwiedzał więcej strony, tracąc tego klienta na długi czas.
Przyczyną problemu, jest brak zrozumienia przez osoby odpowiedzialne za kreacje, że samo uruchomienie strony responsywnej, nie oznacza, że gdy strona otwiera się poprawnie w rozdzielczości komputera (tzw. desktopowej) to nie trzeba jej testować np. na smartwonie, na którym zawsze otworzy się poprawnie. Wykonując maskę reponsywną lub mobilną, nasi webmasterzy przygotowuje jej silnik: nawigację, obsługę klienta itp. Ale wypełnienie maski opisami długimi towarów, kategorii, podstronami HTML, dodatkami itp. należy już do Ciebie. Szczególnie dotyczy to Toplayerów (wyświetlanych w górnej warstwie ponad sklepem) oraz Widgetów (wyświetlanych na krawędzi ekranu) . Niestety, ale często zlecając je niedoświadczonym webmasterom lub najtaniej, przygotowywane są one najprostszą techniką czyli nieresponsywnie.
Jeżeli nie masz wersji reponsywnej lub mobilnej, zostanie otwarty normalny sklep, co sprawi, że kupujący wykona zakupy lub otworzy sklep desktopowo. Poniżej przykład toplayera, który ma dużą, stałą wielkość, przez co zasłania całą stronę i nawigację. Efektem jest brak możliwości korzystania ze sklepu. Ilustruje to doskonale poniższy zrzut ekranowy z rzeczywistego sklepu, do którego w żaden sposób nie można było dotrzeć poprzez błędny toplayer. Jeżeli więc wysyłasz np. newsletter i nawet 60% e-maili jest czytanych mobilnie, czyli klienci wchodzą na Twój sklep mobilny. Jeżeli nie mogą po nim nawigować, tracisz co najmniej 60% pieniędzy na marketing, bez względu na to czy korzystasz z Marketing Automation, Newsletterów czy SMS.
Obok Toplayerów, na drugim miejscu plasujemy widgety, których nie można wcale zamknąć przez to, że aktywny obszar jest poza ekranem, albo ich wyświetlanie zasłania ważne elementy nawigacyjne. W poniższym przykładzie widać, że jeden widget zasłania koszyk, drugi po rozwinięciu nie może zostać zwinięty. A nie każdy klient, wpadnie na pomysł aby przeładować stronę. I drugą kwestią jest to, ile razy zrobi to przypadkowo otwierając widget i nie mogąc go zwinąć. Czy tak wygląda użyteczna strona?
Co należy zrobić?
Musisz regularnie i obszernie testować swój sklep mobilny lub wyłączyć funkcję strony mobilnej. Jeżeli zdecydowałeś się na maskę reponsywną to albo będziesz testować sklep na smartfonie, tablecie i desktopie, albo poproś o wyłączenie skalowania sklepu do rozdzielczości mobilnych. Jeżeli nie masz serca do strony mobilnej, lepiej ją wyłącz. Przyniesie to mniejszą stratę Twojej firmie niż źle działająca strona mobilna lub responsywna (tzw. RWD).
W IAI-Shop.com zadbaliśmy o prostotę wyłączania toplayerów i widgetów w wersji mobilnej. Służy do tego opcja:
Generalnie w ogóle należy się zastanowić, czy jakiekolwiek toplayery i widgety są w ogóle potrzebne użytkownikom chcącym zrobić zakupy szybko, w drodze? W niektórych przypadkach jest to konieczne (np. toplayer w celu potwierdzenia pełnoletności). Ale w 99% przypadków należy po prostu wszelkie dodatki wyłączyć.
Bardziej skomplikowana sytuacja jest w wersji RWD. Nie rozumiejąc technologii RWD, wiele osób myśli, że strona wczytuje się w wersji odpowiedniej na urządzenia mobilne. Nie jest to prawdą. Takie działanie wykonuje "Druga mobilna wersja sklepu". Natomiast strona RWD ładuje się zawsze ta sama, a dopiero przeglądarka na podstawie szerokości ekranu wczytuje odpowiedni arkusz styli CSS, rozkładając elementy tej samej strony na różne sposoby. Nie można więc zastosować elementu konfiguracyjnego jak powyżej. W przypadku zastosowania toplayera, który poprawnie wygląda w rozdzielczości desktop, nie testując i nie zapewniając mu responsywności lub nie ukrywając go w CSS w małej rozdzielczości, prowadzą Państwo wprost do katastrofy użytecznościowej - odcięcia klientom mobilnym możliwości złożenia zamówienia. W przypadku gdy wyłączą Państwo rozdzielczość mobilną, strona wyświetli się jako szeroka, przez co klient będzie mógł powiększać i przesuwać ją na małym ekranie docierając np. do krzyżyka zamykającego toplayer.
Podsumowanie
Brak testowania, świadomości technicznej i dostosowywania treści dodawanych nie przez kogo innego jak przez Ciebie, prowadzi do utraty znacznej ilości klientów i przychodów. Mamy nadzieję, że obszerne wytłumaczenie problemu od strony technicznej i pokazanie rzeczywistych błędów naszych klientów doprowadzi do tego, że zaczną Państwo testować swoje sklepy na smartfonach i dodawać elementy wyłącznie dostosowane do wersji mobilnej.
Autorem tekstu jest Paweł Fornalski, założyciel i główny architekt IAI-Shop.com (IdoSell Shop)