Wszystko co chcielibyście wiedzieć o RWD, ale boicie się zapytać

Dużo się mówi obecnie o stronach RWD, responsywnych czy dostosowanych do urządzeń mobilnych. Najczęściej słyszeć będziecie o tym, że jeśli www to tylko responsywne. Że gigant Google obrazi się na Waszą stronę, jeśli nie będzie responsywna. Czy to wszystko prawda? I czym w zasadzie jest projektowanie responsywne?

Z czym to się je?

Projektowanie responsywne polega na takim przygotowaniu projektu i zakodowaniu strony, żeby dostosowała się do wielkości okna, który ją wyświetla. Nie tylko proporcjonalnie się skalowała (to urządzenia mobilne robią same z siebie, jeśli strona się nie mieści na ekranie), ale aktywnie dostosowywała layout.

W praktyce sprowadza się to z grubsza do dwóch rzeczy:

  • Wielkości i położenie określa się w %, a nie sztywnych miarach. Np. mówimy komputerowi, że dany obrazek ma być szeroki na 20%, a nie na 300 pikseli.
  • Określamy progi szerokości ekranu (np. 1920, 1680, 1366 pikseli itd.), po przekroczeniu których layout ulega bardziej radykalnym zmianom.

Efekt powinien być taki, że przewijanie strony powinno odbywać się tylko w osi pionowej, a wszystkie elementy zachowują odpowiednią, czytelną skalę na małym ekranie, co pozwala na bezproblemową obsługę palcem na ekranie dotykowym.

Czyli to inaczej strona mobilna?

Nie. W przypadku strony responsywnej masz jedną stronę, która dostosowuje się do ekranu. W przypadku strony mobilnej masz dwie strony: normalną i dostosowaną na urządzenia mobilne. Ta technika nazywana jest AWD.

Plusy są takie, że strona AWD może być jeszcze ściślej dostosowana do potrzeb urządzeń mobilnych. Minusy – wdrożenie takiego rozwiązania wymaga więcej pracy, zarządzanie dwiema stronami podobnie.

Co na to Google?

Wracamy jednak do RWD. W 2015 roku zrobiło się głośno o tym, że pozycja w najpopularniejszej wyszukiwarce uzależniona będzie od dostosowania strony do urządzeń mobilnych. Jesteśmy ponad rok po tych rewelacjach i jak to wygląda? Czy responsywność www ma wpływ na jej pozycję? Krótka odpowiedź: tak.

Dłuższa odpowiedź: tak, ale to tylko jeden z wielu czynników, który ma wpływ na ocenę strony przez Google. Jak duży jest to wpływ? To zależy od urządzenia z jakiego szukamy. Logiczne jest, że korzystając z wyszukiwarki na smartfonie, Google raczej postara się podsunąć nam strony, które przystosowane są do naszego urządzenia.

W przypadku komputera jest całkowicie wykonalne wypozycjonowanie strony, która nie jest responsywna. Jeśli jest dobrze skonstruowana, szybka, ma dużo ciekawych treści i prowadzi do niej dużo dobrej jakości linków. Jednak jeśli chcemy zwojować wyniki wyszukiwania to responsywność na pewno nie zaszkodzi.

Cienie RWD, czyli o czym mówi się rzadziej

  • Złe RWD potrafi być naprawdę złe. Do tego stopnia, że poświęca się czas na jego stworzenie, a ostatecznie użytkownikowi mobilnemu i tak lepiej używałoby się pomniejszonej strony przeznaczonej na ekrany komputerów. Dodatkowo stojące u podwalin projektu założenie responsywności może wpłynąć na mniejszą atrakcyjność i dopracowanie całej strony.
  • Responsywna strona na niewielkich ekranach może wyglądać na niedopracowaną. Jest to wynik tego, że ze względu na mnogość kombinacji modelu, systemu i przeglądarki niemożliwe jest dopracowanie i przetestowanie strony w każdym możliwym środowisku.
  • W praktyce firmy określają specyfikację pod jaką przygotowują wersje responsywne i w jakim środowisku ją testują. Następnie przez pewien okres czasu po opublikowaniu strony www zgłaszane mogą być usterki w pewnych środowiskach i są one na bieżąco są poprawiane.
  • Im bardziej rozbudowany serwis i skomplikowany layout tym większy kłopot. Dlatego RWD nierzadko wymusza ograniczanie się do zestawu praktyk i rozwiązań, które ograniczą potencjalne problemy. Wymusza to niejako minimalizm oraz standaryzację projektów stron.

Czy mimo to warto?

Warto, zwłaszcza kiedy serwis przygotowywany jest przez doświadczony i profesjonalny zespół projektantów i programistów.

  • Dobre RWD potrafi być naprawdę dobre. Przemyślany projekt nie tylko polega na odpowiednim pomniejszeniu i poprzestawianiu wszystkich elementów, żeby się zmieściły. Dobry projektant przewiduje potrzeby użytkowników mobilnych – stąd niepotrzebne na smartfonie elementy ukryje albo zmodyfikuje ich wygląd.
  • Określone rozwiązania projektowe, które są narzucane przez wymóg responsywności mogą wydawać się ograniczeniami, ale są bardzo rozsądne. Wymogi responsywności wpływają na szybkość ładowania, czytelność, zrozumiałość i lekkość projektu. Natomiast utalentowany projektant i tak znajdzie sposób na nadanie stronie indywidualnego rysu.
  • Pomimo tego, że część przekornych użytkowników twierdzi, że obsługa klasycznej strony na smartfonie nie jest niczym trudnym to dla większości osób konieczność ciągłego przybliżania i oddalania www oraz nawigowania w dwóch osiach jest nie do przyjęcia.

W tym porównaniu strona RWD, która na danym urządzeniu wyświetli się z drobnymi błędami albo niezgodnie z zamierzeniem projektanta i tak będzie bardziej zachęcająca niż idealna strona responwysności pozbawiona.

Wniosek z tego wszystko niestety nie będzie oryginalny. Dobre strony są dobre, a złe po prostu złe. Dobra responsywna strona będzie raczej lepsza niż dobra nieresponsywna strona.

Z tym że dobrą responsywną stronę trudniej wykonać, ale to już nasza broszka.

Kamil Lipa

Web Webuzzerii. Od zawsze w branży reklamy internetowej, project manager, specjalista user experience, weteran wordpressa i łowca konwersji, który w wolnym czasie trenuje wojowanie samurajskim mieczem, więc warto mieścić się w każdym deadline.

Czy ten artykuł był dla Ciebie przydatny?
Zapisz się do newslettera, dzięki temu żadnego nie ominiesz.

Masz pytania? Zadaj je w komentarzu - odpowiemy!