Mobilne i responsywne wersje strony

Urządzenia mobilne pomimo dość dużego nasycenia rynku wciąż zyskują na popularności i znaczeniu. Z tej przyczyny, aby skutecznie przyciągnąć i zatrzymać uwagę użytkownika przeglądającego www czy e-sklep, witryny powinny dobrze się prezentować na ekranach tabletów – w sposób czytelny, przejrzysty i intuicyjny w nawigacji. Warto pamiętać, że również Google preferuje (i wyświetla wyżej w wynikach wyszukiwania) strony, które są mobile-friendly.

Jak dostosować stronę internetową do urządzeń mobilnych?

Aby strona na urządzeniu mobilnym została uznana za przyjazną zarówno przez użytkowników, jak i wyszukiwarkę, należy przygotować wersję serwisu dedykowaną smartfonom i tabletom. Do wyboru mamy albo stronę mobilną, albo RWD (responsywną). Obie wersje mają swoje zalety, od nas więc zależy, którą z nich wybierzemy i zdecydujemy się wdrożyć.

Różnice między stroną responsywną a mobilną

Responsywna wersja polega na dostosowaniu całej strony (w tym przede wszystkim treści, fotografii, formularzy i danych kontaktowych) do ekranów o różnej wielkości – laptopów, desktopów, jak również smartfonów i tabletów. Zazwyczaj niektóre elementy widoczne na urządzeniach stacjonarnych, na urządzeniach mobilnych zostaną ukryte lub zaprezentowane w innej formie. Najczęściej w wersji RWD na telefonach i tabletach elementy menu, zdjęcia i treści wyświetlane są jedno pod drugim. Strona automatycznie przelicza swój rozmiar i dostosowuje się praktycznie do każdego ekranu.

Do zalet tego rodzaju strony mobile-friendly należy przede wszystkim obecność jednego CMS-a do zarządzania treścią oraz jednego adresu URL wpisywanego w adres przeglądarki zarówno na urządzeniach mobilnych, jak i komputerach. Strona responsywna jest również bardziej przyjazna SEO i wystarczy zapisać w niej jeden kod śledzenia Google Analytics. Minusem, niestety, może się okazać wyższy koszt przygotowania oraz zwykle też dłuższy czas ładowania się strony w stosunku do wersji mobile.

Strony mobilne z kolei dysponują własną strukturą i odrębnym adresem URL (zazwyczaj jest to m.nazwa.pl albo nazwa.pl/mobile). Nie zawierają ciężkich, graficznych elementów, dzięki czemu szybciej się ładują. Są zazwyczaj zbudowane na osobnym CMS-ie, dlatego też podczas aktualizacji treści na stronie, należy pamiętać także o odświeżeniu wersji mobilnej. Chcąc zbierać dane i śledzić ruch na stronie, należy zaimplementować osobne kody śledzenia w wersji komputerowej oraz na komórki.

Jak przejść ze strony mobilnej na responsywną?

Jeśli posiadamy już wersję mobilną strony, polecaną praktyką jest przejście na wersję responsywną. W jaki sposób to zrobić? Przede wszystkim najpierw należy przygotować wersję RWD, wyposażoną we wszystkie elementy pozwalające użytkownikowi na łatwe i szybkie poruszanie się po stronie  – menu, widoczne dane i formularze kontaktowe, przyciski call to action itp. Trzeba również pamiętać o ustawieniu przekierowania 301 dla każdej podstrony w wersji mobile, konfiguracji przekierowań kanonicznych (rel=canonical) na responsywnych adresach URL oraz o usunięciu charakterystycznych dla wersji mobilnej ustawień URL, takich jak np. przekierowania warunkowe czy też zawierające protokół HTTP.