Niemal każdy z nas słyszy dziś o responsywnych stronach www, mobilnym projektowaniu witryn, sporo pisze się na ten temat na blogach eksperckich, gdzie pojawia się skrót RWD (Responsive Web Design). Jednak nie do końca wiemy, co to znaczy i jaka jest rola budowania stron www  w oparciu o taką metodę.

Krótko mówiąc – strona responsywna to witryna internetowa dopasowana do urządzeń mobilnych. Jak to rozumieć? Łatwo otwiera się i obsługuje na różnych urządzeniach i ekranach o różnej wielkości. Łączy w sobie dwie koncepcje: elastyczność wymiarów i jedna wersja kodu, opartą o style CSS, które zmieniają jej układ w zależności od szerokości docelowego ekranu.

Trzeba dodać, że czym innym jest mobilna strona www a czym innym responsywna. Dawniej budowano dwie wersje stron. W oparciu o określoną i stałą szerokość ekranu, gdzie optymalizowano wersję mobilną pod kątem określonej wielkości. Taka metoda nie sprawdziła się, ponieważ na rynku pojawiło się wiele nowych urządzeń o różnych parametrach, co wpłynęło na poszukiwanie takich rozwiązań w projektowaniu i tworzeniu kodu stron www, aby dane urządzenie mogło obsłużyć witrynę, a użytkownik bez trudu mógł zapoznać się z jej treścią lub zakupić jakiś produkt. Przestało być problemem uciążliwe powiększanie lub pomniejszanie jej zawartości na ekranie np. smartfona. Piękny przykład jak technologia pobudziła rozwój HTML, kaskadowych stylów CSS  i wpłynęła na trendy w projektowaniu graficznym a środowisko marketingowe zmusiła niejako do poszukiwania nowych narzędzi do komunikacji z odbiorcą.

Jednak kod strony i jej wygląd to nie wszystko. Dobór treści i tzw. responsywność w strategii jej tworzenia od strony merytorycznej – to kolejna cegiełka w procesie przygotowywania stron www. Przekonaliśmy się, że ładny wygląd to nie wszystko. Kluczowy przepis – to korzystanie z tzw. odwróconej piramidy, techniki dziennikarskiej, gdzie informacje układa się wg stopnia ważności. To bardzo ważny naszym zdaniem a nawet kluczowy aspekt tworzenia stron www, nie tylko z punktu widzenia użytkownika, czy celów biznesowych właściciela takiej strony, ale pozycjonowania i promowania treści strony www tak, aby wyszukiwarki internetowe wskazywały na cenną zawartość , a co za tym idzie użyteczność stron www, dzięki czemu taka strona zyskuje i znajduje się na coraz to wyższych pozycjach w wynikach wyszukiwania.

Niejako „nakładką” jest grafika i odpowiedni krój pisma wraz z marginesami, odstępami oraz przyciskami skłaniającymi do kliknięcia. Jak to nazywamy „call to action”. Dopiero na tej bazie powstaje szata graficzna, która ma pomóc użytkownikowi, zachęcić do kupna czy częstego odwiedzania strony www. I tu niezwykle ważna jest responsywna sekcja nawigacji.

I na koniec ciekawostka. Czy wiecie, że projektowanie responsywnych stron graficznych rozpoczynamy od najmniejszego ekranu? Obecnie stosuje się minimalną szerokość 320px, kolejny pułap to 768px, 1366px i 1920px.  Takie podejście zmusza do przemyślenia nawigacji i treści pod kątem ważności.

W kolejnym artykule opiszemy jak wygląda cały proces tworzenia responsywnej strony.

Chcesz sprawdzić, czy Twoja strona www jest dostosowana do urządzeń mobilnych?

Możesz zrobić to sam – https://search.google.com/search-console/mobile-friendly