Liczba użytkowników internetu, korzystających z urządzeń mobilnych stale rośnie. Oznacza to, że strony internetowe są odwiedzane właśnie przez takie osoby, a najczęściej wykorzystują do tego swoje smartfony. Z tego też powodu każdy właściciel witryny www powinien zadbać o to, aby była ona responsywna i w pełni przyjazna dla użytkowników urządzeń mobilnych. Strony internetowe, które wyświetlają się na mobile tak samo dobrze, jak na desktop, to obecnie podstawa dzisiejszego UX designu. Czym więc jest podejście mobile first design? Jakie są jego wady i zalety?
Na czym polega mobile first design?
Wzrost popularności urządzeń mobilnych i ich wykorzystania do różnych celów, w tym także do przeglądania Internetu i robienia zakupów w sieci, sprawił, że powstał pomysł projektowania stron internetowych przyjaznych dla smartfonów. RWD, czyli Responsive Web Design, oznacza responsywny projekt witryny internetowej. Jest to proces tworzenia serwisu, który będzie działać na różnych urządzeniach mobilnych, z dowolnym rozmiarem ekranu bez konieczności powiększania i pomniejszania, aby zobaczyć znajdującą się treść na stronie. Dzięki temu jest ona dostępna praktycznie dla wszystkich użytkowników, co oczywiście przekłada się na wzrost jakości doświadczeń. Sprawy jednak posunęły się znacznie dalej w momencie, kiedy narodził się projekt mobile first design. Chodzi w tym o zaprojektowanie witryny od najmniejszych rozmiarów ekranów, a następnie przechodzenie do największych.
Czym jest mobile first index?
Wraz z rozwojem mobile first design pojawiło się mobile first index, czyli strategia od Google, która polega na tym, aby głównym punktem odniesienia przy indeksowaniu przyjmować mobilną wersję strony. Na podstawie tych danych Google określa między innymi SERPy. Należy jednak zauważyć, iż istnieje indeks o nazwie mobile first, co nie oznacza, że obejmuje on tylko i wyłącznie urządzenia mobilne. Jeśli strona www nie została w żaden sposób dostosowana do smartfonów czy tabletów, indeks będzie skupiał się jedynie na stronie dostosowanej do laptopa, czyli desktopu. Warto przy tym pamiętać, że brak obsługi urządzeń mobilnych może mieć negatywny wpływ na jej pozycję w wynikach wyszukiwania.
O sprawdzonych metodach dotyczących wersji mobilnych stron internetowych można przeczytać na https://developers.google.com/search/docs/crawling-indexing/mobile/mobile-sites-mobile-first-indexing?hl=pl
Na temat Mobile First Indexing oraz co tak naprawdę czyta Googlebot możecie znaleźć pod adresem: https://www.searchenginejournal.com/google-mobile-first-indexing/346170/
UX a mobile first
Czy mobile first może wpływać na UX? Generowanie leadów oraz współczynnik konwersji są w głównym stopniu zależne od wyglądu i treści witryny, która widoczna jest w sieci dla użytkowników. Jeśli nie ma możliwości wyjaśnienia odbiorcom, jak oferowane im usługi czy produkty mogą im pomóc lub jakie mogą dać korzyści, to nie zostaną oni dłużej na stronie sklepu internetowego, czy wizytówce firmy. Projektując witrynę, która będzie głównie skupiona na urządzeniach mobilnych można pomóc firmie w spełnieniu wszystkich wymagań i osiągnięciu celów biznesowych. User Experience jest najważniejszym aspektem w trakcie tworzenia witryny www. Jeśli można realnie poprawić doświadczenia użytkowników, którzy ją odwiedzają, z pewnością przełoży się to na zyski oraz lojalność potencjalnych klientów.
Jakie są wady i zalety podejścia mobile first design?
Mimo że tworzenie strony w duchu mobile first brzmi jak rozwiązanie wręcz idealne, to wciąż nie jest to norma dla większości firm, które zajmują się projektowaniem serwisów internetowych i sklepów. Warto więc przedstawić wady i zalety podejścia mobile-first.
Dlaczego warto postępować zgodnie z zasadą mobile first?
Rozdzielczość ekranu jest najważniejszym powodem tworzenia stron w myśl mobile first. Narzuca on jednak wiele ograniczeń, ponieważ na urządzeniach mobilnych można zamieszczać zdecydowanie mniej informacji niż w wersji desktopowej. Dlatego też projektując taki interfejs należy unikać zatłoczenia i przepełnienia danymi. Co istotne, trzeba pamiętać sposób, w jaki wchodzi się z nim w interakcję. Przez to, że na telefonie nie dysponuje się kursorem, a operuje palcem, który jest znacznie większy, powinno się odpowiednio dostosować elementy klikalne:
- minimalne wymiary 44×44 px
- umiejscowienie w łatwodostępnych obszarach,
- zapewnienie ich wystarczających odległości od siebie.
Dzięki temu możliwe będzie uniknięcie przypadkowych kliknięć, jednak jak to wygląda w praktyce? Niewielkich rozmiarów element klikalny może świetnie sprawdzać się przy klikaniu w niego myszą. Wykonanie tej samej czynności przy pomocy kciuka jest zadaniem jednak zdecydowanie trudniejszym. Dlatego też powinno się rozważać alternatywne opcje, które pozwolą na zaznaczenie tej opcji przez kliknięcie w większy obszar ekranu.
Jakie są jeszcze zalety mobile first? Wśród nich można wymienić:
- doskonałe doświadczenia użytkownika,
- koncentracja użytkowników na najważniejszej treści,
- odpowiednio dopracowana strategia i plan działania,
- szybszy czas ładowania strony.
Dlaczego nie stosować mobile first?
Postępowanie zgodnie z podejściem mobile first ma jedną wadę – łatwo wtedy zapomnieć o możliwościach, jakie dają wersje na komputer, a przecież tam także użytkownicy chcą w pełni z nich korzystać. Dlatego też bezpośrednie przenoszenie designu dla użytkowników mobilnych na większy ekran może skutkować wdrożeniem rozwiązań, które nie będą dla nich przyjazne na desktopie. Bardzo popularnym przykładem takiego błędu jest stosowanie hamburger menu, które znajduje się pod ikonką z poziomych kresek. To rozwiązanie okazuje się użyteczne na małym ekranie, ponieważ stanowi świetny sposób na zaoszczędzenie miejsca. Nie znajduje jednak uzasadnienia w wersji komputerowej.
Na co zwrócić uwagę podczas projektowania strony z uwzględnieniem mobile first?
Prawie połowa użytkowników zgodnie twierdzi, że nie poleci strony internetowej danej firmy, jeśli będzie źle zaprojektowana, a jej funkcjonalność będzie zła. Aby uniknąć takiej sytuacji, podczas projektowania witryny powinno się postępować zgodnie z poniższymi zasadami.
Skoncentrowanie się na użytkownikach
Podstawową rzeczą, jaką należy zrobić przed rozpoczęciem prac nad serwisem jest zdiagnozowanie i usunięcie problemów, na które napotykają użytkownicy. Witryna dostosowana do urządzeń mobilnych powinna pomóc odwiedzającym im wykonać określone czynności albo szybko i sprawnie rozwiązać jakieś problemy. Drugim krokiem jest określenie ścieżki, jaką muszą przebyć internauci i jej zaimplementowanie na mobile. Warto rozważyć różne scenariusze zachowań odbiorców na każdej podstronie.
Ustalenie hierarchii treści
Tworząc treści dla mobilnej wersji strony internetowej, należy zadbać o to, aby była ona treściwa i zwięzła. Daje to użytkownikom treści, których szukają. Należy pozbyć się bałaganu i tego, co może ich rozpraszać. Z racji tego, że responsywne strony internetowej mają ograniczenia dotyczące ekranu, powinno się prezentować odbiorcom treści w taki sposób, aby respektowały one wizualną hierarchię według ważności.
Postawienie na minimalizm i prostotę designu
W dzisiejszych czasach liczy się prosty i intuicyjny design. Przede wszystkim poprawia on czytelność i skupia użytkowników na najważniejszych elementach. W praktyce oznacza to, że budując stronę mobile first, powinno się zachować te elementy, których naprawdę się potrzebuje, a resztę usunąć. Nie powinno się więc obciążać internautów nadmiarem wyskakujących okienek i reklam.
Widoczne CTA
Jasna kolorystyka, proste linie i elementy topograficzne zadziałają cuda na stronach dostosowywanych do urządzeń mobilnych. Połączenie ich wszystkich w efektywny przycisk CTA jest wręcz koniecznością. Brak CTA może skutkować utratą cennych leadów oraz konwersji. Jeśli to możliwe, lepiej wykorzystać takie przyciski, aniżeli trudno klikalne linki.
Podejście mobile-first – podsumowanie
Użytkownicy mobilni stanowią w dzisiejszych czasach większość odwiedzających strony internetowe. Prowadząc firmę w sieci niezbędne będzie więc zaspokojenie ich potrzeb. Oznacza to tyle, że jeśli oni korzystają głównie ze smartfonów i tabletów, strona firmowa powinna być do nich dostosowana. Mobile first to nowe podejście do projektowania witryn www i najlepszych doświadczeń użytkowników, co oznacza, że zastosowanie tej strategii może przynieść szereg korzyści.
