Pozycjonowanie stron Strony internetowe Sklepy internetowe Studio graficzne Realizacje Klienci Blog Darmowa wycena Kontakt

Mobile first w tworzeniu stron internetowych. Dlaczego jest tak ważny?

Kategoria: Strony internetowe


Mobile first w tworzeniu stron internetowych. Dlaczego jest tak ważny?

 

Projektowanie stron internetowych w przeciągu ostatnich lat bardzo się zmieniło. Zarówno pod względem dostępnych technologii, czy rozwiązań, ale także w zakresie podejścia do tematu. Mobile first zaczął spychać z pierwszego miejsca tworzenie witryn dostosowanych do desktopów, nadając priorytet urządzeniom mobilnym.

Nasze korzystanie z internetu bardzo się zmieniło. Pojawienie się na rynku smartfonów spowodowało popularyzację mobilnego dostępu do sieci. Wraz z rozwojem tych urządzeń, zwiększaniem ich wielkości oraz możliwości technicznych, zaczęto zauważać, że ruch na stronach www jest coraz częściej generowany właśnie za ich pomocą. Smartfony dały ich właścicielom więcej możliwości. Zniknęło ograniczenie do nawiązywania połączeń głosowych oraz wysyłania wiadomości SMS. Zdjęcia, przeglądarka sieci, różnej maści komunikatory, takie jak Signal, Telegram, WhatsApp, Messenger, media społecznościowe, to wszystko nadało nowego tempa zmianom, również mentalnym. Korzystanie z komputerów do przeglądania internetu zmniejszyło swoje znaczenie. Urządzenia mobilne dla sporej liczby użytkowników stały się wygodniejsze, a przede wszystkim, dostępne w każdej chwili. Podróż autobusem do pracy, szkoły, na uczelnię, przerwa między zajęciami, oczekiwanie w kolejce, to tylko niektóre miejsca, kiedy sięgamy po smartfona. Nawet przebywając w domu i chcąc sprawdzić jakąś informację, wybieramy telefon lub tablet, zamiast włączać komputer - nie ważne, jak dobry by był i szybko się uruchamiał. Taka sytuacja znalazła swoje odzwierciedlenie w statystykach stron internetowych, gdzie urządzenia przenośne zaczęły wygrywać z desktopami. To z kolei przełożyło się na zmianę zachowań w projektowaniu witryn. Zaczęto stawiać na mobile first, zamiast desktop first.

Responsive Web Design

To wszystko oczywiście nie wydarzyło się ot, tak, od pstryknięcia palcami i nagle zmieniamy nastawienie. Wzrost ruchu na stronach internetowych z urządzeń mobilnych, spowodował najpierw rozwój Responsive Web Design. Wyszło zatem na to, że witryny zaczęto projektować i dostosowywać do wielkości ekranu, na którym jest wyświetlana. Strony zgodne z RWD mimo wszystko były i są tworzone z priorytetem desktopu, jednak po otwarciu ich na smartfonie, czy tablecie, dostosowują się do wielkości ich ekranów. Co to oznacza w praktyce? RWD to pewien sposób personalizacji witryny, gdzie jej układ, elementy graficzne, rozmiar fontów przystosowane są do mniejszych wyświetlaczy w taki sposób, aby wszystko było czytelne dla użytkownika i nie miał on problemów z korzystaniem z niej. Zachowuje się więc zasady UX/UI w miarę możliwości, na które pozwala rozmiar ekranu. Tworzenie responsywnych stron internetowych stało się koniecznością dla wszystkich projektów, których zleceniodawcom zależy na przetrwaniu ich biznesów w sieci. Dziś bowiem posiadanie witryny, która wyświetla się niepoprawnie na urządzeniach mobilnych, to spore ryzyko i w pewnym sensie wiązanie pętli na szyi firmy. Najprościej mówiąc, w ten sposób uniemożliwia się użytkownikom smartfonów i tabletów prawidłowe korzystanie ze strony, która ma zarabiać i generować zyski dla przedsiębiorstwa. Co więcej, na responsywność witryny zwracają uwagę także algorytmy Google. Brak RWD lub wykonania zgodnie z zasadą mobile first, powoduje problemy z pozycjonowaniem, a zatem odnajdywaniem, np. sklepu internetowego, w wynikach wyszukiwania. Szerzej na ten temat pisaliśmy w artykule: Dlaczego warto mieć responsywną stronę internetową?

To co to jest Mobile first?

Mogłoby się wydawać, że skoro witryny są przystosowywane przy pomocy RWD do urządzeń mobilnych, to po co więcej? Otóż mobile first to właśnie zmiana nastawienia, nadawania innego nich dotychczas priorytetu dla budowania serwisów internetowych, czy też aplikacji. Zgodnie z nią najpierw projektuje i wdraża się w życie witrynę, która ma być dostosowana do smartfonów i tabletów. Towarzyszy temu podejściu zasada progressive advancement, czyli progresywne ulepszanie. Według niej tworzony projekt internetowy na urządzenia mobilne jest etapowo dostosowywany do desktopów. Przyjmujemy zatem, że smartfony, z racji mniejszych ekranów (chociaż najnowsze modele nawet z niskiej półki, mają je coraz większe) są najważniejsze dla projektu. Projektując stronę internetową designerzy, specjaliści od UX/UI starają się dostosować wygląd witryny w taki sposób, aby użytkownik mógł komfortowo z niej korzystać. Chodzi o tzw. „feeling” podczas przeglądania sklepu internetowego, czy też innego rodzaju webowego projektu, a także użyteczność. Projektanci dobierają optymalny układ elementów, a także ich wielkość, aby użytkownik mógł bez utrudnień nawigować po serwisie i klikać w niej przy użyciu kciuka. Pamiętają jednocześnie o ograniczeniach wynikających ze znacznie mniejszych ekranów. Dopiero przy stopniowym zwiększaniu dostępności strony, czyli budowania w kolejnych etapach projektu przystosowanego dla tabletów oraz laptopów, dodaje się specjalne akcje, czy też funkcje, które dopiero na większych wyświetlaczach mają jakikolwiek sens.

Desktop first

Zgoła odmienne podejście prezentuje postawa desktop first. Tutaj pierwszoplanową rolę odgrywają desktopy, a zatem urządzenia z dużymi wyświetlaczami. Zgodnie z zawierającą się w tej postawie zasadą graceful degradation designerzy na dalszy plan przesuwają tworzenie wersji mobilnej powstałego serwisu, dostosowując go do tego, co już powstało na desktopie. Niesie to za sobą duże ilości pracy. Wersje komputerowe stron internetowych dają możliwość wykorzystania znacznej ilości efektów, a także funkcji, które nadają witrynie ciekawego charakteru i niesamowitych wrażeń z przeglądania jej. Degradacja z desktopów do urządzeń mobilnych sprawia, że kastruje się serwis z takich rzeczy, łącznie ze zmniejszaniem ilości oraz jakości grafik, czy też tekstu. Porównując obydwie wersje, można zauważyć, że zdecydowanie na desktopie dzieje się więcej. Jednak mimo to, mobile króluje w statystykach urządzeń, na których użytkownicy przeglądają strony internetowe, a także dokonują zakupów. Czy zatem tworzenie witryn na komputery ma jeszcze jakiś sens? Zdecydowanie tak! To nie jest też tak, że desktopy są złe i znikają z powierzchni ziemi. Funkcjonują, mają się bardzo dobrze i raczej nic im nie grozi w ciągu najbliższych lat. Sam zaś wybór podejścia, czy desktop first, czy mobile first, zależy od projektu, który ma być zrealizowany, jego specyfiki, a także grupy docelowej.

Dlaczego mobile first jest tak ważny?

Można by zapytać, dlaczego ten mobile first jest tak ważny? Pokrótce odpowiedź na to pytanie już znalazła się w tym tekście. Zatem przejdźmy do nadania jej ładu i porządku.

Z roku na rok możemy zauważyć, jak branża urządzeń mobilnych ewoluuje. Na rynku pojawiają się modele smartfonów, których możliwości się zwiększają, podobnie, jak z ich ekranami. Mimo rozwiązania, jakim jest dual sim, wiele osób ma nadal oddzielne telefony prywatne i służbowe. Na każdym z nich korzystają z internetu. Nawet taki najprostszy przykład stanowi o zwiększeniu znaczenia urządzeń mobilnych w projektowaniu stron internetowych. Skoro użytkowników i smartfonów przybywa, to w swoich statystykach w Google Analytics zapewne widzisz, że to za ich pośrednictwem odbywa się główny ruch na Twojej witrynie. Jaki nasuwa się wniosek? Tak! Mobile first jest bardzo ważny. W łatwiejszej do konsumpcji formie na smartfonach dostarcza użytkownikowi serwis internetowy, na którym dowiedzą się o marce, jej produktach, oferowanych przez nią usługach. Co więcej, dokonana będzie konwersja, czy to w postaci zapisania się na newsletter, czy najważniejsza - dodanie produktu do koszyka i jego zakup. Posiadanie serwisu, który powstał zgodnie z postawą mobile first, niesie ze sobą jeszcze inną istotną korzyść, o której w dalszej części tekstu.

Mobile first index

Jest nią priorytet w indeksowaniu w wyszukiwarce Google - mobile first index. Wiele zmieniło się na przestrzeni ostatnich lat, także w algorytmach związanych z wynikami wyszukiwania. Już od jakiegoś czasu Google podawało informacje, a także podejmowało kroki w celu promowania w SERP-ach stron, które są przyjazne dla urządzeń mobilnych. Wzrost zainteresowania i wykorzystywania podejścia mobile first, jeszcze bardziej ten proces pogłębia oraz przyspiesza. Google podjęło decyzję, że to właśnie dostosowanie strony do smartfonów i tabletów będzie priorytetem w procesie indeksacji, a dopiero potem kontrola wersji desktopowej. Jakie to rodzi konsekwencje dla właścicieli witryn? Otóż brak wersji mobilnej strony spowoduje, że osiąganie pierwszych pozycji w wynikach wyszukiwania będzie jeszcze trudniejsze do osiągnięcia lub nawet niemożliwe. Dlatego też należy dbać o to, aby posiadać witrynę, która będzie w pełni przyjazna urządzeniom mobilnym i zwracać na to uwagę tworząc nowe ich wersje lub całkowicie świeże projekty.

AMP, czyli Accelerated Mobile Pages

Wzrost znaczenia ruchu na stronach internetowych z urządzeń mobilnych, spowodował pojawienie się technologii ułatwiających dostosowanie witryn do smartfonów. Jedną z nich jest AMP, czyli Accelerated Mobile Pages. To sposób budowania i wyświetlania stron, które opierają się na statycznej zawartości, a jednocześnie ograniczając kod, eliminując z niego wykonywanie skomplikowanych akcji. Ich renderowanie przy użyciu AMP jest znacznie szybsze, co pozwala użytkownikowi otrzymać poszukiwaną treść w błyskawiczny sposób. Accelerated Mobile Pages znalazł swoje odzwierciedlenie w wynikach wyszukiwania Google. Po znalezieniu w nich interesującej nas treści, wyszukiwarka automatycznie przekierowuje na wersję AMP strony, jeśli taka istnieje.

PWA, czyli Progressive Web App

Inną technologią, która powstała na kanwie skupienia się na mobile first jest Progressive Web App. Jej istotą jest budowanie witryn, które na smartfonach do złudzenia przypominają aplikacje mobilne. Kiedy użytkownik na nią trafi, jego urządzenie pobierze niezbędną zawartość, co pozwoli na korzystanie z witryny nawet bez połączenia z internetem (oczywiście będzie ono niezbędne do zrealizowania procesu zakupowego). PWA chętnie wykorzystują właściciele serwisów, którzy rezygnują z tworzenia dedykowanych aplikacji mobilnych. Bardzo ważną zaletą tej technologii jest możliwość zbudowania strony, która w ramach jednego przedsięwzięcia będzie wyglądać i funkcjonować na wszystkich urządzeniach mobilnych tak samo - bez względu na system operacyjny.

Podsumowanie

Rozwój rynku urządzeń mobilnych oraz sposobu ich wykorzystania zmienił podejście do tworzenia stron internetowych. Mobile first zaczął w większości przypadków dominować nad desktop first. Założenie, według którego najpierw projektuje się serwis webowy do wyświetlania na smartfonach i tabletach, a dopiero potem rozbudowuje się go na desktopy, stało się codziennością. Użytkownicy bowiem chętniej sięgają po urządzenia mobilne, żeby przeglądać strony internetowe, robić zakupy, niż siadać przed komputerem. Zwłaszcza że mogą to zrobić w każdej chwili i miejscu. Ze względu na ten fakt, ilość użytkowników, sprzętu, a nawet indeksowanie, mobile first jest bardzo ważny w tworzeniu nowoczesnych stron internetowych.


Tagi: Marketing