Mobilna wersja strony – jak sprawdzić?
Dobrze zaprojektowana strona internetowa stanowi estetyczną wizytówkę firmy w sieci. Za jej pomocą możemy opowiedzieć o naszej marce, przedstawić ofertę czy zaprosić odwiedzających do kontaktu. Dzięki odpowiednim technikom SEO jesteśmy w stanie zwiększyć ruch na naszej witrynie, dzięki czemu trafi ona do szerszego grona klientów.
Stworzenie strony internetowej przyjaznej odbiorcom, korzystającym z różnego rodzaju urządzeń, wymaga ciągłego monitorowania tego procesu. Jak donoszą statystyki, w 2021 roku ponad połowa użytkowników korzystała z Internetu na urządzeniach mobilnych, a do 2025 roku aż 83% Europejczyków będzie scrollowała swoje smartfony, przeglądając sieć. Jak kontrolować wygląd strony na “mobilkach” podczas jej tworzenia. Wszystkiego dowiesz się z naszego artykułu!
Po co sprawdzać wersję mobile strony?
W ciągu ostatnich lat tworzenie stron internetowych przeszło niemałą przemianę. Dzieje się tak właśnie za sprawą wspomnianych przez nas wcześniej statystyk – większa liczba użytkowników mobilnych wymusza dostosowanie stron, w taki sposób, aby doskonale prezentowały się na urządzeniach przenośnych.
Przeglądanie Internetu na smartfonie to nasza codzienność. Prawdopodobnie każdy z nas trafił na stronę, która nie była dostosowana do urządzeń mobilnych. Takie witryny nie tylko nie prezentują się dobrze, ale przede wszystkim utrudniają zapoznanie się z ich treścią. Większość użytkowników z pewnością porzuci stronę i nigdy więcej na nią nie wróci.
Monitorowanie wyglądu strony za pomocą podglądu wersji mobilnej pomoże Ci dostosować ją w taki sposób, aby była funkcjonalna niezależnie od tego, na jakim urządzeniu zostanie uruchomiona.
Mobilna wersja strony w Chrome
Wygląd mobilny strony w przeglądarce Chrome możesz w łatwy i szybki sposób podejrzeć za pomocą wbudowanej konsoli Chrome DevTools. Istnieje kilka sposobów, aby ją uruchomić na wybranej stronie:
- użycie prawego przycisku myszy i wybranie opcji “Zbadaj”,
- skrót klawiszowy Ctrl + Shift + I (Windows, Linux),
- skrót klawiszowy Ctrl + Shift + C,
- klawisz F12,
- skrót klawiszowy Comand + Option + C (MAC).
Po uruchomieniu konsoli Chrome DevTools z panelu po prawej stronie wybierz opcję “Przełącz pasek narzędzi urządzenia” (znajdującą się w prawym górnym rogu) lub użyj skrótu klawiszowego Ctrl + Shift + M. Następnie z menu rozwijanego znajdującego się na górze wybierz urządzenie, dla którego chcesz sprawdzić widok. Podgląd wyłączysz za pomocą “X”, znajdującego się w prawym górnym rogu.
Konsola Chrome DevTools nie tylko umożliwia Ci sprawdzenie wersji mobilnej strony, ale także daje dostęp do opcji takich jak: elementy, konsola, źródła, sieć itp.
Mobilna wersja strony w Firefox
Jeżeli jesteś użytkownikiem przeglądarki Firefox, sprawa ma się bardzo podobnie, co w przypadku Chrome. Pierwszym krokiem jest odwiedzenie strony, której wersję mobilną chcesz otworzyć.
Używając skrótu klawiszowego Ctrl + Shift + M w kilka sekund otworzysz podgląd mobilnej wersji strony. W menu rozwijanym, znajdującym się u góry okna, tak jak w przypadku Chrome, możesz wybrać interesujące Cię urządzenie. Aby wyłączyć podgląd, użyj “X” w prawym, górnym rogu.
Jeżeli z jakiegoś powodu nie uda Ci się użyć powyższego skrótu klawiszowego, możesz spróbować drugiego sposobu. Wejdź w menu przeglądarki, wybierz “Więcej narzędzi”, a następnie “Narzędzia dla twórców witryn”. W tym przypadku również możesz skorzystać ze skrótu klawiszowego Ctrl + Shift + I, a następnie wybrać ikonę smartfonu, znajdującą się w prawym dolnym rogu. Następne kroki wyglądają tak samo, jak w poprzednim przypadku.
Podgląd mobilny w WordPress
Skorzystanie z tej opcji jest możliwe, jeżeli jesteś administratorem strony. Pierwszym krokiem, jaki musisz wykonać, jest zalogowanie się do panelu WordPress. Następnie przejdź do zakładki “Wygląd” i kliknij “Dostosuj”.
Przeniesiesz się do opcji personalizowania motywu. W lewym dolnym rogu zobaczysz trzy ikony różnych urządzeń. Wybierz tę, która odpowiada Twoim potrzebom.
Mobilna wersja strony – trzymaj rękę na pulsie
W naszym artykule przedstawiliśmy sposoby na sprawdzenie wersji mobilnej strony. Dzięki temu możesz kontrolować jej wygląd na urządzeniach mobilnych z poziomu przeglądarki internetowej. Monitorowanie witryny podczas procesu jej przygotowywania sprawia, że tworzenie stron internetowych będzie przebiegało bez zbędnych komplikacji.
Źródła: