Kiedy ktoś szuka twojej usługi, zwykle trzyma w ręku telefon. Google o tym wie, dlatego oceniając stronę, opiera się na jej wersji mobilnej. Jeśli twoja strona rozsypuje się na telefonie, tracisz nie tylko odwiedzających, ale też szansę na dobre pozycje w wyszukiwarce. Wyjaśnimy ci, czym jest responsywna strona, jak wiąże się z SEO i jak samodzielnie ją przetestować.
Czym jest responsywna strona
Responsywna strona automatycznie dopasowuje się do szerokości ekranu – na telefonie, tablecie i dużym monitorze. To nie są dwie osobne wersje strony, tylko jedna strona z jedną treścią i jednym adresem, której układ zmienia się w zależności od urządzenia.
W praktyce oznacza to, że kolumny na telefonie układają się jedna pod drugą, menu zwija się do ikonki, obrazy się zmniejszają, a tekst pozostaje czytelny bez powiększania palcami. Sam Google poleca responsywny projekt jako najprostszy sposób na przygotowanie strony pod urządzenia mobilne.
Jak responsywna strona wpływa na SEO
SEO (optymalizacja pod wyszukiwarki) to zestaw działań, dzięki którym twoja strona wyświetla się wyżej w wynikach Google bez płacenia za reklamę. Wersja mobilna strony wpływa na nie z kilku stron naraz.
Google indeksuje wersję mobilną
Google od kilku lat stosuje tzw. indeksowanie mobile-first. Przeszukując i oceniając stronę, patrzy przede wszystkim na jej wersję mobilną. Jeśli na telefonie brakuje treści, która jest na komputerze, Google może jej w ogóle nie wziąć pod uwagę.
Jedna strona, jeden adres
Starsze strony miały osobną wersję mobilną, na przykład pod adresem m.twojastrona.pl. Oznaczało to podwójne zarządzanie treścią i ryzyko, że z czasem wersje zaczną się od siebie różnić. Responsywna strona ma jeden adres dla wszystkich urządzeń, więc ani linki, ani treść nie dzielą się między dwie wersje.
Szybkość i Core Web Vitals
Google bierze pod uwagę także doświadczenie użytkownika na stronie, w tym wskaźniki Core Web Vitals. Mierzą one, jak szybko wyświetla się główna treść, jak szybko strona reaguje na kliknięcie i czy elementy nie przesuwają się podczas ładowania. Na telefonach z wolniejszym połączeniem słabości strony wychodzą najbardziej. Co z tym zrobić, omawiamy w artykule dlaczego strona wolno się ładuje i jak to naprawić.
Odwiedzający, którzy odchodzą
Kiedy ktoś z telefonu trafia na stronę, którą musi powiększać i przewijać na boki, zwykle wraca do wyników wyszukiwania i klika w konkurencję. Nawet gdybyś miał dobre pozycje, taka strona nie przyniesie ci klientów.
Jak sprawdzić, czy twoja strona jest naprawdę responsywna
Nie wystarczy, że strona na telefonie „jakoś” się wyświetla. Przejdź przez nią tak, jak zrobiłby to klient:
- Otwórz stronę na swoim telefonie i spróbuj bez powiększania przeczytać tekst, otworzyć menu i wysłać formularz.
- Sprawdź też inny telefon, tablet i przeglądarkę, na przykład Chrome i Safari.
- W przeglądarce Chrome otwórz narzędzia dla programistów i włącz tryb urządzeń. Przełączaj różne szerokości ekranu i obserwuj, czy coś się nie rozsypuje.
- Uruchom test w narzędziu PageSpeed Insights, który pokaże wydajność wersji mobilnej i konkretne zalecenia.
- W Google Search Console śledź raport Core Web Vitals, który opiera się na danych prawdziwych odwiedzających.
Najczęstsze błędy, które widzimy na telefonach
- Tekst jest za mały, a wiersze za długie.
- Przyciski i linki są tuż obok siebie, więc łatwo stuknąć w niewłaściwy.
- Tabele i obrazy wychodzą poza krawędź, a strona przewija się na boki.
- Wyskakujące okienko zasłania całą treść i nie da się go wygodnie zamknąć.
- Numer telefonu nie jest klikalny, więc nie da się zadzwonić jednym stuknięciem.
- Wersja mobilna ma mniej treści niż komputerowa – brakuje tekstów albo opisów produktów, których Google wtedy nie widzi.
Jak poprawić responsywność strony
Elastyczny układ
Strona powinna opierać się na siatce, która dopasowuje się do szerokości ekranu, a nie na sztywnych wymiarach w pikselach. Nowoczesne szablony i narzędzia, takie jak WordPress z Elementorem, sobie z tym radzą, ale widok mobilny zawsze trzeba sprawdzić i dopracować ręcznie.
Zoptymalizowane obrazy
Wgrywaj obrazy w rozsądnym rozmiarze i w nowoczesnym formacie, na przykład WebP. Telefon nie potrzebuje zdjęcia w rozdzielczości na duży monitor – niepotrzebnie spowolni tylko ładowanie.
Czytelny tekst i wygodna obsługa
Czcionka na telefonie powinna być na tyle duża, by dało się czytać bez powiększania, a przyciski na tyle duże, by trafić w nie kciukiem. Ważne elementy, takie jak telefon, formularz czy przycisk „Zamów”, umieść tak, żeby odwiedzający nie musiał ich szukać. Więcej praktycznych wskazówek znajdziesz w artykule jak zaprojektować UX dla użytkowników mobilnych.
Ta sama treść na wszystkich urządzeniach
Przy indeksowaniu mobile-first obowiązuje zasada: czego nie ma na telefonie, tego dla Google jakby nie było. Nagłówki, teksty, obrazy z opisami i dane strukturalne powinny być w wersji mobilnej takie same jak na komputerze.
A co z AMP?
Technologię AMP (Accelerated Mobile Pages) kiedyś polecano do przyspieszania stron mobilnych. Dziś Google jej nie wymaga, a dla zwykłej strony firmowej czy sklepu internetowego nie ma ona większego sensu. Szybka responsywna strona w zupełności wystarczy.
Responsywność wpływa nie tylko na SEO, ale też na to, ilu odwiedzających w końcu coś kupi albo wyśle zapytanie. Temu tematowi poświęcamy artykuł dlaczego responsywna strona to konieczność dla SEO i konwersji.
Najczęściej zadawane pytania
Czy responsywna strona zapewni mi lepsze pozycje w Google?
Sama w sobie nie. Google ocenia przede wszystkim, czy treść odpowiada na zadane pytanie. Strona, która nie działa na telefonie, ma jednak w walce o pozycje niepotrzebny handicap, a odwiedzający z niej uciekają.
Czy wystarczy osobna mobilna wersja strony?
Technicznie Google potrafi ją obsłużyć, ale zarządzanie dwiema wersjami jest trudniejsze i łatwo o to, że wersja mobilna zostanie w tyle. Przy nowej stronie od razu opłaca się rozwiązanie responsywne.
Jak często sprawdzać wersję mobilną?
Zawsze po większej zmianie – nowa podstrona, nowa wtyczka, zmiana szablonu. Poza tym raz na kilka miesięcy przejdź kluczowe podstrony na telefonie i zajrzyj do raportu Core Web Vitals w Search Console.
Czy starą stronę da się uczynić responsywną bez przebudowy od zera?
Czasem tak, zwłaszcza jeśli działa na nowoczesnym systemie zarządzania treścią. W przypadku bardzo starych stron przeróbka bywa tak trudna, że bardziej opłaca się nowa strona. W decyzji pomoże krótki audyt.
Chcesz strony, która działa i na telefonie, i w Google? Zobacz, jak podchodzimy do tworzenia stron internetowych, albo napisz do nas – chętnie sprawdzimy, w jakiej formie jest twoja obecna strona.