Responsywna strona internetowa - dlaczego jest to takie ważne?


RWD to akronim od responsive web design. Nie doczekaliśmy się jeszcze polskiego odpowiednika tego terminu, dlatego najczęściej posiłkujemy się anglicyzmem i mówimy o responsywnych stronach internetowych. Jeśli jeszcze nie wiesz, co to właściwie oznacza, koniecznie przeczytaj nasz poradnik. Dowiesz się z niego, czym jest RWD i dlaczego nie wolno pominąć tego aspektu w procesie projektowania strony internetowej.


Responsywna strona www: o co w tym chodzi?

Z raportu „Digital in 2018” wynika, że już nieco ponad połowa wszystkich wizyt na stronach internetowych odbywa się z poziomu urządzeń mobilnych, przede wszystkim smartfonów. Są to dane dla całego świata, ale w Polsce wygląda to podobnie. Tym samym promowane przez lata hasło „mobile first” właśnie się urzeczywistniło.

Żaden właściciel strony internetowej, a tym bardziej projektant nowej witryny, nie może lekceważyć faktu, że coraz chętniej surfujemy po sieci korzystając ze smartfonów i tabletów. Robimy to głównie po pracy i w weekendy, a więc w czasie, gdy podejmujemy najwięcej decyzji zakupowych. Wniosek? Każda współczesna strona internetowa MUSI się poprawnie wyświetlać na małym ekranie.

I tutaj dochodzimy do definicji RWD. Strona responsywna nie wymaga:
• Szczypania ekranu, by powiększyć tekst;
• Męczenia się z trafianiem w maleńkie linki;
• Długiego oczekiwania, aż wyświetli się cała zawartość witryny;

Czyli: jest przyjazna użytkownikom mobilnym. Taką stronę o wiele wygodniej przegląda się na małym ekranie, co oczywiście sprzyja konwersji – użytkownik jest zadowolony, łatwiej może odnaleźć interesujące go treści, a więc chętniej dokona zakupu lub wypełni formularz kontaktowy.

Unikalną cechą strony responsywnej jest to, że automatycznie dopasowuje się ona do typu ekranu. Gdy uruchomimy ją na komputerze, będzie wyglądać jak „normalna” witryna. Po odpaleniu na smartfonie będzie natomiast znacznie okrojona z elementów graficznych, w zamian jednak oferując maksymalną wygodę.


Responsywna czy mobilna?

Tych pojęć nie należy ze sobą utożsamiać. Mobilna strona internetowa to zupełnie osobna wersja witryny, przygotowana stricte pod kątem małych ekranów. Można ją łatwo rozpoznać po literze „m” umieszczonej w adresie w pasku przeglądarki. Stworzenie strony mobilnej jest bardzo kosztowne i de facto oznacza posiadanie dwóch serwisów www. W przypadku większości firm nie ma takiej potrzeby.

Standardową witrynę wizerunkową czy nawet sklep internetowy, spokojnie wystarczy zaprojektować w technologii RWD, aby zaspokoić potrzeby użytkowników. Jest to rozwiązanie tańsze, mniej kłopotliwe, no i adres domeny się nie zmienia.


Dlaczego strona RWD to konieczność?

Powodów jest co najmniej kilka. Zacznijmy od tego najbardziej oczywistego: strony responsywne są promowane przez Google, dlatego łatwiej jest na nie trafić w wynikach wyszukiwania.

Przede wszystkim jednak responsywność to ukłon w stronę użytkowników, a więc potencjalnych klientów. Przypomnij sobie, gdy ostatni raz wszedłeś na jakąś stronę z poziomu smartfona i musiałeś szczypać ekran, by móc cokolwiek odczytać. To było strasznie irytujące, prawda? Zdaj więc sobie sprawę, że większość użytkowników w takiej sytuacji po prostu opuści stronę i przejdzie do konkurencji, co wiążę się z oczywistą stratą – zarówno finansową, jak i wizerunkową.


Najważniejsze zasady projektowania responsywnych stron www

Jest ich oczywiście bardzo dużo, ale skupmy się na tych najistotniejszych. Aby móc mówić o w pełni funkcjonalnej stronie typu RWD, należy zastosować się do tych kilku kluczowych zasad:
• Wszystkie elementy strony, zwłaszcza tekst, muszą się automatycznie dopasowywać do rozdzielczości ekranu;
• Przewijanie strony może się odbywać wyłącznie w pionie;
• Menu powinno być skondensowane do jednego, rozwijanego elementu, nazywanego potocznie hamburgerem;
• Zabronione jest umieszczanie na stronie RWD wyskakujących elementów graficznych, czyli ekranów pop-up (wyjątek stanowi informacja o plikach cookie);
• Wszystkie przyciski muszą być na tyle duże, by użytkownik mógł w nie bezbłędnie trafić;
• Na stronie RWD nie stosujemy technologii flash;
• Usuwamy niepotrzebne elementy graficzne, które spowalniałyby działanie strony;

Po zaprojektowaniu witryny zgodnie z zasadami RWD, trzeba jeszcze sprawdzić, czy spełnia ona wszystkie warunki responsywności narzucane przez Google. W tym celu wejdź na stronę udostępnioną przez giganta rynku wyszukiwarek i przeprowadź krótki test. Uzyskany wynik da Ci odpowiedź na pytanie, czy strona www jest przyjazna użytkownikom mobilnym. Powodzenia!