Od autora
Analityka e-marketing projektowanie
Lipiec 13 2013

Responsive Web Design - od początku

Można wyznaczyć kilka dróg projektowania witryn na urządzenia mobilne. O tym, które są lepsze, które gorsze można oceniać przez wiele pryzmatów. Bez względu na to jaką ścieżkę technologiczną się obierze warto zastanowić się nad elementarnymi aspektami: procesem wdrażania oraz odpowiedzią na pytanie czy... warto w to tak naprawdę brnąć?

Obserwując rosnącą popularność RWD odpowiedź na drugie zagadnienie wydaje się oczywista. Coraz więcej firm/portali/sklepów decyduje się na adaptację swoich istniejących stron także na urządzenie mobilne. Widząc systematyczny wzrost ruchu w polskim Internecie ze smartfonów czy tabletów, jest to decyzja na pozór słuszna. Klient może przyjść zewsząd, warto zatem wyjść mu naprzeciw i pokazać dostosowaną wersje. Patrząc całościowo jest to zrozumiałe i logiczne, jednak w przypadku specyficznych segmentów witryn, niekoniecznie niezbędne.

O tym czy strona kwalifikuje się do rozbudowy o kolejne wersje decyduje bardzo często jej charakter. Jako podstawowy miernik może posłużyć zaangażowanie - ile czasu na witrynie oraz akcji przypada średnio na użytkownika podczas jednej sesji. Im wyższy współczynnik, tym decyzja o dostosowaniu witryny jest bardziej właściwa. Do stron z wysokim wskaźnikiem można niewątpliwie zaliczyć serwisy informacyjne, sklepy, portale społecznościowe, rozrywkowe, czyli wszystkie te, które posiadają rozbudowany content, oraz dla których utrzymanie użytkownika jest niezbędne do realizacji podstawowych celów (sprzedaż, zysk z emisji reklam itp.).

Na drugim biegunie można umieścić witryny stricte informacyjne - wizytówki czy strony firmowe. Ich cel jest zazwyczaj bardzo prosty: przedstawienie użytkownikowi oferty, kontaktu, cennika itp. Zaangażowanie na witrynie tego typu jest zazwyczaj nieprównywalnie niższe, co nie znaczy, że są tym samym nieskuteczne. Z racji struktury, dotarcie do poszukiwanej informacji (realizacja celu) potrafi często zająć jeden klik, po którym następuje opuszczenie strony.

Mając świadomość zaangażowania i sposoby użytkowania witryny można zacząć rozważania na temat podjęcia prac adaptacyjnych. Pierwszą najrozsądniejsza fazą, jest przetestowanie obecnej witryny na urządzeniach mobilnych. Jej celem jest odpowiedź na pytanie w jakim stopniu doświadczenie strony na smarfonie/teblecie ustępuję wersji desktopowej. W oszacowaniu wysokości tego wskaźnika może pomóc kilka parametrów: jakość renderingu strony (CSS), swoboda w poruszaniu się po stronie czy czytelność informacji.

W przypadku witryn o niewielkim zaangażowaniu, wersje desktopowe (dostosowane do monitorów) mogą być w pełni wystarczalne i przygotowywanie odpowiedników stricte mobilnych, może okazać się zbędne. Posługując się przykładem z własnego życia: szukałem przez komórkę w Internecie numeru do warsztatu samochodowego. Mimo iż wiele witryn nie było dostosowanych do małych rozdzielczości, nie sprawiło mi problemu ich powiększanie w celu odczytania numeru telefonu. Ten mankament okazał się być kompletnie nieistotny.

Sytuacja ulega dramatyczne zmianie jeżeli chodzi o bardziej angażujące witryny. Obcowanie z tego typu niedostosowaną stroną na dłuższa metę jest dość męczące i irytujące, a więc łatwo tu o stratę cennego ruchu. O ile w przypadku serwisów rozrywkowych można pozwolić sobie na lekkie przymknięcie oka na ten aspekt, o tyle w segmencie witryn e-commercowych czy bankowych absolutnie nie. Doświadzenie strony oraz precyzja w poruszaniu się po jej strukturze, czyli wszystko, to co wpływa na poczucie bezpieczeństwa, muszą zostać zapewnione.

Przy podejmowaniu decyzji o przygotowywaniu wersji mobilnej warto także wspomnieć o rzeczy najbardziej oczywistej czyli analizie dotychczasowych źródeł ruchu. Jednym z częstych powodów rezygnacji z projektu jest mały udział smartfonów/tabletów w całości wygenerowanego traffic-u. Bezrefleksyjna interpretacja tego stanu jest absolutnie błędna i bezzasadnie może anulować całe przedsięwzięcie. Brak dostosowanej wersji nie zachęca do ponownych odwiedzin z urządzenia mobilnego. Świadczyć może o tym ilość bezpośredniego nowego ruchu w stosunku do ruchu powracającego. Nikt, komu sprawiło trudność przeglądanie strony przez komórkę nie wejdzie na nią po raz drugi. Przygotowanie wersji mobilnej w takiej sytuacji po prostu “aż się prosi”, gdyż stanowi wyjście naprzeciw oczekiwaniom użytkowników. W tym punkcie warto także zbadać jaki jest jest udział odwiedzin pochodzących z witryn odsyłających (np. portali społecznosciowych) czy wyszukiwarek. Pokazują one jaki jest potencjał nowych użytkowników i ilu z nich może być bezpowrotnie traconych, w wyniku trudności w korzystaniu z witryny np. na tablecie.

Przygotowywanie wersji mobilnej jest decyzją dużą, szczególnie kiedy istnieje jej wersja webowa. Oczywiście wiele zależy tutaj od struktury, nie mniej jednak wiąże się się z pisaniem jej szablonów praktycznie od początku. Najdogodniejszą sytuacją jest oczywiście ta, kiedy witryna jest w fazie koncepcyjnej. Wdrażanie można przeprowadzać wtedy równolegle, tj. zacząć od wersji mobilnej (dostosowanej do najmniejszej rozdzielczości), a następnie przygotowywać na jej podstawie arkusze stylów dla innych urządzeń. Wszystko po to, aby sposób poruszania się niej, oraz charakter był zachowany w możliwie jak największym stopniu.

Dla witryn już istniejących i chcących dostosowywać się na przykład do rozdzielczości chociażby smartfonów ścieżka ta jest niestety trudniejsza. Warto rozpatrzyć tutaj przygotowanie wersji lekkich pod kątem implementacji najważniejszych sekcji oraz funkcjonalności. Wdrażanie na siłę wszystkich elementów może być niestety zgubne i sprawić, że wersja mobilna przestanie być w praktyce użyteczna.

(Re)projektowanie responsywne jest trendem, który powoli zaczyna stawać się standardem. Warto wyjść mu naprzeciw jednak, tak jak w życiu, nic na siłę. O ile w przypadku nowych projektów RWD stanowi niejako konieczność, to dla witryn już istniejących jest to kwestia mniej jednoznaczna. Analiza gotowej już witryny oraz zachowań użytkowników pozwoli wskazać odpowiednie podejście i opowiedzieć na pytanie czy warto angażować w nie swoje zasoby.

rwdresponsivemobiledesignzasady
Podziel się! :-)