Czy moja strona internetowa dobrze wygląda na telefonie?

Większość odwiedzających ogląda Państwa stronę na telefonie. Google robi to samo: Google wykorzystuje wersję mobilną Państwa stron do ich indeksowania i rankingowania. To, czego nie widać na telefonie, Google również nie widzi. W tym artykule dowiedzą się Państwo, jak samodzielnie sprawdzić, czy strona działa dobrze na małym ekranie.

Reguła viewport

Telefon nie wie automatycznie, że Państwa strona została stworzona z myślą o małym ekranie. Bez odpowiedniej instrukcji przeglądarka zakłada, że ekran jest znacznie szerszy i pomniejsza całą stronę. W efekcie powstaje maleńki tekst, który trzeba powiększać. Rozwiązaniem jest jedna linijka w sekcji <head> każdej strony:

<meta name="viewport" content="width=device-width, initial-scale=1">

• Brak stałej szerokości, na przykład width=1024: wtedy telefon ponownie zakłada, że ekran jest szeroki.
• Nie blokować powiększania: prosimy nie używać user-scalable=no ani maximum-scale=1. Osoby słabo widzące muszą mieć możliwość powiększenia tekstu.

AI Bouwer, motywy WordPress i większość innych kreatorów stron samodzielnie umieszczają tę regułę na każdej stronie. W przypadku strony tworzonej samodzielnie lub starszej strony warto to sprawdzić: proszę otworzyć stronę, kliknąć prawym przyciskiem myszy, wybrać Wyświetl źródło strony (lub Ctrl+U) i wyszukać za pomocą Ctrl+F frazę viewport.

Samodzielne testowanie

1. Proszę otworzyć swoją stronę na własnym telefonie i przejrzeć najważniejsze podstrony.
2. Lub na komputerze: proszę otworzyć stronę w Chrome lub Firefox, nacisnąć F12 i kliknąć ikonę telefonu i tabletu. Proszę wybrać wąskie urządzenie.
3. Proszę zwrócić uwagę na tekst wychodzący poza ekran, stronę, którą trzeba przesuwać w bok, zbyt małe lub nachodzące na siebie przyciski oraz fragmenty, których brakuje w wersji mobilnej.
4. Następnie proszę przetestować stronę w PageSpeed Insights na karcie Mobile. Jak odczytać ten raport, opisano w artykule Odczytywanie PageSpeed Insights: Core Web Vitals w prostym języku.

Osobny test zgodności z urządzeniami mobilnymi Google oraz raport Użyteczność mobilna w Search Console przestały istnieć od 1 grudnia 2023 roku. Jeśli natkną się Państwo na nie w starszym artykule, proszę skorzystać z kroków opisanych powyżej.

Ta sama treść na urządzeniach mobilnych i na komputerze

W przypadku strony responsywnej (jeden adres i jedna strona, która dostosowuje się do szerokości ekranu) treść jest automatycznie taka sama. Google zaleca takie rozwiązanie. Jeśli posiadają Państwo osobną stronę mobilną, na przykład m.example.com, lub system, który wysyła telefonom inne strony, proszę sprawdzić:

• czy tekst jest taki sam, również jeśli na urządzeniach mobilnych znajduje się w rozwijanym bloku;
• czy tytuł i opis są takie same;
• czy obrazy i ich teksty alternatywne są takie same;
• czy nie ma treści, które ładują się dopiero po przesunięciu, kliknięciu lub wpisaniu czegoś przez odwiedzającego: Google tego nie robi.

Dalsza lektura

• Google: zalecane praktyki dotyczące indeksowania mobile-first (w języku angielskim)
• MDN: reguła viewport (w języku angielskim)