Responsive Design jako odpowiedź na mobilną rewolucję?

Jeszcze kilka lat temu istotne znaczenie miało to, by powstająca strona internetowa była dopasowana do każdej przeglądarki. Dziś jest to już niewystarczające. Rynek urządzeń mobilnych rozwija się w bardzo szybkim tempie, co w efekcie oznacza konieczność posiadania takiej wersji strony internetowej, która będzie poprawnie wyświetlała się zarówno na dużych ekranach monitorów, jak i niewielkich ekranach tabletów
i smartfonów.

Odpowiedzią na zwiększającą się liczbę urządzeń mobilnych jest Responsive Design.

Bo liczy się wygodne korzystanie z Internetu

Nie da się nie zauważyć prędkości, z jaką rozwija się rynek urządzeń mobilnych. Po pojawieniu się iPhone’a cały proces ruszył lawinowo. Efekt? Znaczna część populacji na całym świecie posiada przynajmniej jedno urządzenie mobilne, a co za tym idzie – decyduje się na korzystanie z niego przede wszystkim wtedy, gdy w grę wchodzi dostęp do Internetu.

Szacuje się, że w 2014 roku urządzenia mobilne wygenerują ponad 50% ruchu internetowego. Ale już teraz widać wzmożony wzrost korzystania z tabletów, netbooków czy smartfonów, jeśli chodzi
o dostęp do stron internetowych. Każdy chce bowiem móc zamawiać produkty w sklepach internetowych, czytać najświeższe informacje, itp. stojąc w długiej kolejce czy jadąc autobusem – bez konieczności wychodzenia z domu i uruchamiania komputerów.

Teoretycznie jest to możliwe i teraz, jednak w większości przypadków można natrafić na trudności
z tym związane.

Wady tradycyjnego projektowania

Wszystkie strony internetowe, które zostały zaprojektowane wyłącznie z myślą o wyświetlaniu na standardowych monitorach, tylko na takich ekranach dobrze wyglądają. Chcąc je wyświetlić na mniejszych urządzeniach, napotykamy na kilka problemów.

Chodzi bowiem o to, że niektóre witryny www nie są dostosowane do wyświetlania się na ekranach
o mniejszej (niż standardowa) rozdzielczości. Przede wszystkim widoczna jest nie cała, lecz zaledwie część strony. A to dlatego, że szerokość witryny www jest kilka razy większa niż rozdzielczość ekranu urządzenia mobilnego. W efekcie, by dotrzeć do interesujących nas informacji musimy poruszać palcem nie tylko w kierunku dół-góra, ale również na boki. Ewentualnie – możemy pomniejszyć wielkość ekranu, a następnie wybrać interesujący nas fragment strony i dopiero potem powiększyć, by móc przeczytać zamieszczone informacje albo trafić palcem w odpowiedni link. Problem stanowi również klikanie, ponieważ tabletów czy smartfonów nie obsługuje się za pomocą myszki, ale palca (który jest mniej precyzyjny).

Wymaga to zatem anielskiej cierpliwości, ponieważ ciągłe zmniejszanie i przesuwanie strony na boki bywa irytujące. Powyższe trudności sprawiają, że część osób w ogóle nie wchodzi na te strony, których nie można wygodnie i sprawnie odczytać na niewielkim ekranie urządzenia mobilnego.

Dlatego tak ważne jest, by wszystkie strony www były responsywne. W tym tkwi tajemnica sukcesu.

Responsive design, czyli co?

Pojęcie Responsive Design to koncepcja przedstawiająca zupełnie nowe podejście do projektowania
i wdrażania stron internetowych. Zgodnie z jej założeniami, stworzona witryna www musi wyświetlać się poprawnie i musi zachować swoją funkcjonalność bez względu na to, na jakim urządzeniu jest uruchamiana. Oczywiście chodzi tutaj nie tylko o to, by strona się wyświetliła (bo to jest możliwe nawet wtedy, gdy witryna nie została wykonana zgodnie z koncepcją responsywności), ale by korzystanie z niej ograniczało się do przewijania w górę i w dół (ale już nie wiązało się z koniecznością przewijania do boku, przybliżaniem i oddalaniem). Tylko w ten sposób poruszanie się po stronach internetowych będzie wygodne i sprawne.

Dzięki temu użytkownicy sieci pozostają na witrynie znacznie dłużej, a nie ograniczają się wyłącznie do przejrzenia strony głównej.

Standardowo uznaje się, że rozdzielczość ekranu wynosi:

- powyżej 979 px dla monitorów,

- 979-768 px dla tabletów,

- poniżej 767 px dla smartfonów.

I na tej podstawie tworzy się warianty wyświetlania strony w zależności od wartości rozdzielczości urządzeń mobilnych, na których mają być wyświetlane.

Przed Responsive Web Design nie ma ucieczki?

Oczywiście zawsze możesz zdecydować się na stworzenie strony internetowej w wersji mobilnej, istniejącej jako subdomena, np. m.nazwastrony.pl. Sęk w tym, że nie jest to najlepsze rozwiązanie. Po pierwsze koniecznością jest stworzenie specjalnego kodu strony. Po drugie pojawia się kwestia zawartości witryny w kontekście SEO (duplikowanie treści).

Ze stroną responsywną nie ma takiego problemu. W przypadku Responsive Web Design w łatwy (a przy tym niedrogi sposób) można przekształcić istniejący wygląd strony, nie ma konieczności tworzenia dodatkowych treści na różne wersje witryny, a ponadto adres URL jest dokładnie taki sam dla każdego przypadku. Ponadto przygotowanie layoutu dla strony responsywnej zajmuje mniej czasu niż wykonanie oddzielnej strony dla urządzeń mobilnych. Oznacza to jednocześnie znacznie niższe koszty. Oczywiście koszt przygotowania takiej witryny będzie wyższy w porównaniu z kosztami stworzenia tradycyjnej strony, ale tylko na początku.

Jeśli Twoja strona www nie jest dostosowana do rozdzielczości smartfonów, tabletów, itp. nie dajesz szansy na zapoznanie się z zawartością witryny kolejnym użytkownikom/potencjalnym klientom, którzy należą do grona tych najbardziej mobilnych.

To zaś w przyszłości może Cię sporo kosztować. Dlatego, choć można, nie warto bronić się przed responsywnością. Tym bardziej, że pewne jest, iż popularność urządzeń mobilnych osiągnie apogeum już za kilka lat.