Od czego musisz zacząć, aby stać się Mobile-Friendly i dlaczego jest to takie ważne?
Grafika na dole pokazuje nam, że na ten moment mamy 82 miliony użytkowników urządzeń mobilnych w Internecie, a ta liczba prawdopodobnie wzrośnie do 90 milionów w 2025 roku.
Ta liczba ciągle rośnie, tak jak liczba twoich potencjalnych klientów, których możesz pozyskać stając się przyjazny użytkownikom mobilnym.
Dlatego od marca 2021 roku, przyjazność użytkownikom mobilnym(Mobile-First indexing) stała się czynnikiem rankingowym w Google.
A strony internetowe wyświetlane w wynikach wyszukiwania zostaną pozycjonowane na podstawie treści ich wersji mobilnych.
Czynniki związane z użytkownikami mobilnymi, które będą brane przy pozycjonowaniu stron internetowych przez Google będzie ciągle rosła.
Wiele stron internetowych w dalszym ciągu dostarcza użytkownikom niskiej jakości obsługę na urządzeniach mobilnych.
Czym jest przyjazność użytkownikom mobilnym (Mobile-Friendliness)
Przyjazność użytkownikom mobilnym oznacza stronę zaprojektowaną i zoptymalizowaną pod kątem urządzeń mobilnych.
Twoja strona musi wyświetlać się użytkownikom mobilnym równie dobrze co użytkownikom korzystającym z komputerów.
Obsługa na urządzeniach mobilnych jest odrobine utrudniona między innymi ze względu na znacznie mniejszy ekran. Dlatego tekst na twojej stronie powinien być większy tak aby mógł być czytelny.
Poruszanie się po witrynie także powinno być maksymalnie uproszczone, linki które znajdują się na stronie również powinny być łatwe do kliknięcia palcem.
Strona internetowa dla urządzeń mobilnych powinna być łatwa w użyciu pod każdym względem, bez konieczności powiększania tekstu czy konfiguracji innych ustawień do których zmuszała by użytkownika.
To może wydawać się to skomplikowane dlatego na kilku przykładach pokaże ci co mam na myśli i co powinieneś zmienić na swojej swojej stronie jeżeli jeszcze tego nie zrobiłeś.
1. Responsywny wygląd - Responsive Web Design
Responsive Web Design ma na celu dostosowanie jednej strony internetowej, która dopasowuje się do wszystkich rozmiarów i rozdzielczości ekranu. Pozwala na wysokiej jakości doświadczenia użytkownika(UX – User Expirience), bez względu na to, jak duży lub mały jest rozmiar wyświetlacza.
Pisałem wcześniej o przykładach dlatego na dole znajduję się przykład OLX.pl.
Responsive Web Design zmienia twoją stronę na godną XXI wieku.
To droga do zapewnienia użytkownikom lepszych wrażeń na urządzeniu mobilnym.
Na przykładzie OLX widać że Kategorie które są jednym z najważniejszych elementów w nawigacji ich strony zmieniają całkowicie swój układ.
Na urządzeniach mobilnych można przewijać je przesuwając palcem w lewo lub prawo, pozwala to na bardziej czytelne i użyteczne rozmieszczenie elementów na mniejszych urządzeniach.
Pasek wyszukiwania zmniejsza się i ogranicza się jedynie do ogólnego pola wyszukiwania i przycisku.
Ustawienie poszczególnych ofert zmienia z 4 mieszczących się w szerokości ekranu na 2 poprawiając w ten sposób czytelność na mniejszych ekranach.
2. Design dla palców
Nie tylko mobile friendly ale też finger freindly
Wszystkie interaktywne elementy na ekranie powinny być łatwo klikalne i najlepiej w strefie kciuka. Na przykład przyciski powinny być wystarczająco duże, aby użytkownicy mogli je łatwo dotykać bez dodatkowego wysiłku.
Możesz chcieć zmniejszyć przyciski, dostosowując je do mniejszego ekranu, ale to tylko utrudnia ich klikanie.
Właściwie to powinno działać odwrotnie. Im mniejszy ekran, tym większe przyciski.
Upewnij się, że między hiperłączami jest wystarczająco dużo miejsca, aby użytkownicy nie kliknęli przypadkowo niewłaściwego.
Nie zapominajmy, że komfort dla oczu jest również kluczowy.
Tekst na ekranie powinien zawsze być wystarczająco duży, aby można go było wygodnie czytać.
Wiem, że stwierdzam oczywiste, ale uwierz mi, byłem w tak wielu witrynach mobilnych, w których musiałem powiększać aby coś przeczytać ? To frustrujące.
Dlatego chcesz mieć pewność, że treść jest naprawdę zoptymalizowana pod kątem urządzeń mobilnych i zawsze czytelna.
3. Prostota - Mniej znaczy lepiej
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
4. CTA które
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
5. Wykorzystaj funkcje mobilne
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.