Optymalizacja strony pod urządzenia mobilne w 6 krokach
Autor: Joanna Kulik
Optymalizacja strony pod urządzenia mobilne to konieczność wobec trendu Mobile First. Przeczytaj nasz poradnik Mobile SEO i dostosuj stronę w 6 krokach.
Jeszcze kilka lat temu (gdzieś tak do 2011 roku) mało kto łamał sobie głowę nad tym, czy strona jest przyjazna urządzeniom mobilnym, czy nie. Można powiedzieć, że nawet internet „w komórce” (tj. mobilny) był usługą albo dla biznesmenów, albo na komputerowych geeków, albo dla ludzi których było na to po prostu stać. O zakupach dokonywanych za pośrednictwem smartfona nie wspominając. Ale już rok później świat internetu zapowiedział przyjście mobilnej rewolucji.
Według badań Morgan Stanley Research, przytoczonych w raporcie „Mobile Online w Polsce 2015”, w 2007 na świecie było 1100 mln użytkowników internetu korzystających z desktopu wobec 400 mln internautów przeglądających sieć na urządzeniach mobilnych. Osiem lat później (2015) stosunek ten się odwrócił – użytkownicy sieci na urządzeniach mobilnych przeważyli nad tymi, którzy korzystają z desktopu w stosunku 1900 mln do 1700 mln.
Dynamicznie rosnąca liczba posiadaczy smartfonów ze stałym dostępem do internetu wymusiła nową jakość. I tak w 2012 roku pojawiły się pierwsze wzmianki o tym, że strony dostosowane do urządzeń mobilnych są wyżej oceniane przez Google i że ten trend będzie jednym z wiodących w branży digital – web developementu czy UX. Było to także pokłosie różnorodnych badań przeprowadzonych przez Google. Oczywiście mówię tutaj o rynku USA, ponieważ do Kraju Nad Wisłą trendy docierają nieco opieszale.
Google preferuje strony zoptymalizowane pod mobile
Obecnie, w 2016 roku, powszechne jest dostosowywanie stron internetowych pod urządzenia mobilne. Trend mobile-friendly sites już kilka lat temu został określony przez Google jako jeden z ważniejszych czynników podnoszących ranking strony w wyszukiwarce. Obecnie większość stron wykorzystuje rozwiązania techniczne stanowiące ukłon w stronę użytkowników przeglądających witryny na smartfonach, tabletach czy laptopach.
Jak przystosować stronę pod urządzenia mobilne? Poznaj 7 prostych kroków
Jak dostosować stronę internetową do urządzeń przenośnych? Najpierw warto wykonać test zgodności strony z wymaganiami urządzeń mobilnych. Google stworzyło w tym celu specjalne narzędzie, które znajdziecie tutaj. Jeśli strona wciąż nie spełnia wymogów giganta – przeczytajcie przygotowany przeze mnie niżej poradnik optymalizacji witryny pod urządzenia mobilne. I wykonajcie test ponownie J
Optymalizacja stron pod urządzenia mobilne - Poradnik
- Strona responsywna lub mobilna
Na samym początku warto przemyśleć, czy wolimy mieć stronę responsywną czy raczej stworzyć dwie wersje tej samej strony (na desktopy i na urządzenia przenośne) lub może tylko wersję mobilną. Strony responsywne (inaczej RWD) to witryny, które dopasowują wszystkie swoje widoczne elementy do rozdzielczości ekranu, na którym są przeglądane. Można powiedzieć, że są elastyczne i uniwersalne – dobrze przegląda się je zarówno na ekranie komputera stacjonarnego, jak i na dużo mniejszym wyświetlaczu smartfona.
Od jakiegoś czasu pierwsze rozwiązania zdecydowanie wiedzie prym. Dlaczego? Jest mniej czasochłonne, a przez to tańsze. Co jednak najważniejsze - w kwietniu 2015 roku Google oficjalnie wprowadziło responsywność stron jako czynnik rankingujący, o czym poinformowało na swoim blogu. Nie masz strony RWD? Spadasz w rankingu w wyszukiwarce mobilnej.
Strony mobilne to z kolei serwisy tworzone tylko dla urządzeń mobilnych. Często mają zupełnie inny wygląd i nawigację niż jej wersja na desktopy. Ich zaletą jest możliwość szybszego wykonania – opcja dobra, jeśli planujemy posiadać tylko mobilną wersję strony. To samo z czasochłonnością – samą stronę mobilną wykonamy szybciej i taniej, niż analogiczną stronę responsywną. Wszystko zmienia się oczywiście w przypadku, gdy wdrażamy jednocześnie wersją mobilną i desktopową. Z kolei do wad można zaliczyć konieczność stworzenia np. zupełnie innych przekierować dla strony mobilnej i desktopowej czy konieczność odrębnego śledzenia statystyk w Google Analytics (oddzielny kod).
- Zadbaj o szybkie wczytywanie strony
Szybkość ładowania strony na urządzeniach mobilnych jest kluczowa dla użytkowników – wystarczy o jedną sekundę za długo, aby stracić spory ruch i konwersję. Optymalna długość to zaledwie 2-3 sekundy – po nich użytkownik zaczyna się niecierpliwić i wychodzi ze strony. Według wyników badań opublikowanych przez wpengine.com jedna sekunda za długo powoduje spadek niezadowolenie użytkowników o 16%, spadek konwersji o 7% oraz liczby odsłon o 11%. A mówimy o jednej sekundzie – co jeśli strona ładuje się za długo o 3-4 sekundy?
Aby polepszyć prędkość ładowania strony najpierw trzeba wykonać speed test (test prędkości ładowania strony) za pomocą dostępnych darmowych narzędzi. Jeśli wynik jest niezadowalający – pora na wdrożenie rozwiązań przyspieszających ładowanie. W tym celu twórcy zarówno mobilnych, jak i responsywnych stron starają się usprawnić kod. Na przykład w przypadku stron RWD można wykorzystać funkcję WordPressa o nazwie wp_is_mobile, która pomija wczytywanie dużych elementów, jak filmów w tle, dużych zdjęć, animacji czy innych. Warto pamiętać o zmniejszaniu ciężaru grafik i filmików już na etapie ich tworzenia. W tym celu trzeb wykorzystać funkcję kompresji zdjęć w programach graficznych.
- Pozbądź się ciężkich elementów
Obok wspomnianej już przeze mnie konieczności kompresji zdjęć oraz możliwości zastosowania specjalnej blokady wczytywania filmików na urządzeniach mobilnych (strony RWD), musimy zoptymalizować także inne elementy. Pozbądźmy się zbędnych wtyczek i skryptów oraz stosujmy zasadę ładnego pisania kodu (konieczne jest zmniejszenie jego objętość do niezbędnego minimum i uproszczenie). Polecam poczytać także o rozwijającym się projekcie Accelerated Mobile Pages (AMP) wspieranym m.in. przez Google i WordPress. Jest to projekt typu open source (programiście z niego korzystający mogą go modyfikować i udoskonalać; powstałe narzędzia są darmowe), którego celem jest udostępnienie narzędzi pozwalających na przygotowanie strony przyjaznej urządzeniom mobilnym. Standard AMP ma zatem podobną misję, co strony RWD.
4.Zrezygnuj z agresywnych reklam
Niedawny komunikat Google (23 sierpnia 2016 roku) mówi wprost o tym, że strony internetowe z wyskakującymi reklamami, które przysłaniają treść podczas ich przeglądania na urządzeniach mobilnych, będą niżej oceniane w rankingu wyszukiwania. Tendencja jest taka, aby użytkownik klikając w link w SERP przechodził od razu do treści, która go zainteresowała i nie musiał wcześniej szukać krzyżyka do wyłączenia ogromnej, często pełnoekranowej reklamy. Zatem jeśli planujesz wyświetlać reklamy mobilne na swojej stronie mobilnej lub responsywnej pamiętaj, aby zoptymalizować je pod kątem zgodności z wytycznymi Google.
5.Nie zapominaj o User Experience
Sposób korzystania z Twojej strony, jej nawigacja, kompozycja elementów klikalnych to kolejne kluczowe sprawy. Trzeba pamiętać, że urządzenia mobilne posiadają ograniczenia w postaci niewielkiej rozdzielczości ekranu, przez co trudniej jest o precyzję klikania, szczególnie za pomocą palców. Tworząc stronę dostosowaną do urządzeń przenośnych warto o tym pamiętać i zadbać o projekt dostosowany do zachowań użytkowników urządzeń mobilnych – liczą się duże, czytelne elementy klikalne, minimalizacja efektu przypadkowego kliknięcia, podziały na sekcje i czytelna czcionka. Zlecając wykonanie strony responsywnej czy mobilnej postaraj się o możliwość testowania strony także pod tym kątem.
- Zoptymalizuj objętość i treść tekstów
Strony mobilne mają być szybkie pod każdym względem – także warstwy treści. Przez ograniczone miejsce i widoczność tekstu nagłówki zoptymalizowane pod urządzenia mobilne powinny być krótkie (3-4 słowa to max). Dobrym rozwiązaniem jest podzielenie treści na mniejsze akapity, stosowanie krótkich podpunktów. Należy pamiętać także o dobrze widocznej czcionce – aby tekstu nie trzeba było przybliżać. Z kolei elementy klikalne, butony CTA czy inne powinny być duże.
W przypadku technicznej optymalizacji tekstów należy skupić się na metatagach, metadescription i oczywiście nagłówkach. Wszystkie elementy powinny zawierać potrzebne frazy kluczowe, ale nie należy pakować ich wszędzie, gdzie się da. Wystarczy jednokrotne jej użycie w każdym z elementów.
Podsumowanie
Według najnowszych danych podanych przez Google aż 85% stron zaindeksowanych w ich zasobach jest dostosowana do urządzeń mobilnych. Oznacza to, że korporacja dopięła swego, a my – jako użytkownicy smartfonów czy tabletów – łatwiej przeglądamy strony internetowe na telefonie, drobimy zakupy w sklepach internetowych czy korzystamy z dedykowanych aplikacji. Warto zatem podjąć nieco więcej wysiłku i dostosować stronę pod urządzenia przenośne.
Joanna Kulik
blog.wiwi.pl
Licencjonowane artykuły dostarcza Artelis.pl.