Strona responsywna – sprawdź, czy Twoja strona jest dostosowana do urządzeń mobilnych

5
(6)

“Nie korzystam z laptopa. Teraz tylko telefon.” – podobnie brzmiące zdania usłyszałam kilka razy w ostatnim tygodniu. Używanie telefonu do przeglądania różnego rodzaju witryn lub finalizowania zakupów stało się normą. Jeśli nie chcesz tracić potencjalnych klientów, Twoja witryna musi dobrze funkcjonować na ekranach o różnej rozdzielczości. Jak sprawdzić, czy strona jest responsywna?

Urządzenia mobilne przejmują Internet

W maju 2019 roku liczba internautów w Polsce wyniosła 28,3 mln, z czego 24,3 mln to użytkownicy urządzeń mobilnych (Wyniki badania Gemius/PBI za maj 2019).

Liczba internautów korzystających z poszczególnych urządzeń

Liczba internautów korzystających z poszczególnych urządzeń

W większości spośród urządzeń mobilnych Polacy wybierają smartfony (Polacy a mobile – co wiemy na początku 2019 roku?).

Kategoria urządzeń Google Analytics

Kategoria urządzeń Google Analytics

Jeśli chcesz sprawdzić, z jakich urządzeń korzystają użytkownicy odwiedzający Twoją witrynę, zerknij do Google Analytics. Przejdź do raportu “Odbiorcy”, a następnie wybierz “Ruch mobilny” i “Przegląd”

Jeśli nie chcesz tracić potencjalnych klientów, nie możesz pozwolić na to, by Twoja strona źle wyglądała i traciła niektóre funkcje na mniejszych urządzeniach.

Strona mobilna, a strona responsywna

Strona mobilna to druga wersja Twojej strony przeznaczona dla urządzeń mobilnych. Najczęściej jej adres poprzedzony jest literą m.

mobilna wersja strony

Mobilna wersja strony

Czasem klikając adres witryny, po jej załadowaniu na smartfonie, możesz zauważyć, że została uruchomiona mobilna wersja.

Strona responsywna (RWD) to strona, która dopasowuje się do ekranów różnej rozdzielczości. Jej adres nie różni się w zależności od rodzaju urządzenia. Responsywna strona to nie tylko korzyść dla użytkownika, ale także wpływ na pozycjonowanie na urządzeniach mobilnych, o czym wiadomo było już w 2015 roku.

Jak sprawdzić, czy moja strona jest dostosowana do urządzeń mobilnych

Trudno jest dysponować taką liczbą urządzeń, aby móc na każdym wpisać adres witryny, przeklikać i sprawdzać, czy jest dobrze wyświetlana. Na szczęście możesz skorzystać z narzędzi, które pomogą Ci zweryfikować poprawność wyświetlania witryny.

Test optymalizacji mobilnej

Jednym z nich jest narzędzie do testowania optymalizacji mobilnej.

Strona dostosowana do urządzeń mobilnych

Strona dostosowana do urządzeń mobilnych

Gdy wstawisz adres witryny w odpowiednie miejsce, po chwili zobaczysz wyniki testu. Oczywiście najlepiej, jeśli wyświetlony zostanie komunikat o dostosowaniu strony do komórek.

Strona niedostosowana do urządzeń mobilnych

Strona niedostosowana do urządzeń mobilnych

Może jednak okazać się, że strona wymaga poprawy. Błędy, które możesz zobaczyć to:

  • Mała czcionka utrudnia czytanie tekstu – jeśli Twoją stronę odwiedzi użytkownik urządzenia mobilnego, który czytając treści, będzie musiał powiększyć widok, w narzędziu zobaczysz ten komunikat.
    Czytanie, nawet bardzo interesującego tekstu, gdy co chwilę trzeba go powiększać, przesuwać i mrużyć oczy nie jest wygodne. Zadbaj o odbiorców witryny.
  • Elementy klikalne zbyt blisko siebie – w Twojej witrynie z pewnością znajduje się nawigacja, przyciski lub inne elementy, które użytkownik może kliknąć. W przypadku urządzeń, których rozdzielczość ekranu jest mała, ciężko trafić w odpowiedni element. W efekcie potencjalny klient może opuścić stronę, nie wykonując żadnego wartościowego działania.
  • Nieustawiony widoczny obszar – za pomocą tagu meta viewport, na stronie powinien zostać ustanowiony obszar widoczności. Dzięki temu przeglądarki są informowane o sposobie dostosowania wymiarów oraz skalowania do urządzenia.
  • Użycie niezgodnych wtyczek – niektóre wtyczki (np. Flash) nie są obsługiwane przez większość przeglądarek mobilnych.
  • Treść szersza niż ekran – gdy osoba odwiedzająca Twoją stronę, by zobaczyć całą treść lub obrazy, musi przesuwać ekran w prawo i lewo, zobaczysz ten komunikat. Ważne jest, aby cały obszar strony był widoczny.

Strona Redseo w przeglądarce Firefox

Strona Redseo w przeglądarce Firefox

Chrome/Firefox

W przeglądarce Chrome po kliknięciu prawym przyciskiem myszy i wybraniu “Zbadaj” (Ctrl+Shift+l) lub w Firefox Ctrl+Shift+m, zyskasz możliwość sprawdzenia, jak wyświetlana jest strona na różnych urządzeniach.

Testowanie wyglądu strony na różnych urządzeniach Google Chrome

Testowanie wyglądu strony na różnych urządzeniach Google Chrome

Po kliknięciu przycisku na górze strony możesz przejść do listy i wybrać dodatkowe urządzenia.

Dzięki tym prostym zabiegom szybko dowiesz się, jak wygląda Twoja witryna na różnych urządzeniach.

Google Search Console

W Google Search Console przejdź do raportu “Obsługa na urządzeniach mobilnych”.

Obsługa na urządzeniach mobilnych Google Search Console

Obsługa na urządzeniach mobilnych Google Search Console

Znajdziesz tam informacje o elementach, które mogą mieć wpływ na negatywne doświadczenia użytkowników ze stroną.

Błędy w Google Search Console

Błędy w Google Search Console

Jak widzisz komunikaty są podobne do tych, które są wyświetlane w wynikach testu optymalizacji mobilnej.

Podsumowanie

Witryna dostosowana do urządzeń mobilnych powinna być już standardem. Responsywna strona to nie tylko wygodna dla użytkowników, ale także szansa na zwiększenie konwersji.

Jeśli w Twojej witrynie są błędy, które utrudniają przeglądanie jej na telefonach lub tabletach, koniecznie wprowadź zmiany.

Foto: Designed by freepik – pl.freepik.com

Potrzebujesz pomocy z reklamą w Google?
Napisz do nas, przygotujemy bezpłatną wycenę.

Darmowa wycena

Średnia ocena: 5 / 5. Ilość ocen: 6