Współcześnie większość osób, oprócz korzystania z tradycyjnego komputera, posługuje się także urządzeniami mobilnymi, jakimi są smartfony czy tablety. Mobilny Internet staje się coraz bardziej popularny, a tym samym szybko się rozwija, co wpływa na konieczność dostosowania stron do wymagań urządzeń mobilnych.

Koncepcja RWD

Po raz pierwszy została użyta przez Ethana Marcotte i w dość szybkim tempie zaczęła być rozchwytywana przez twórców stron, zyskując w ten sposób wielu zwolenników. Ideą RWD jest automatyczne dostosowanie się odpowiednio przygotowanej witryny do urządzeń, przez które jest obecnie przeglądana. Warto wiedzieć, że RWD nie odnosi się do techniki czy technologii tworzenia stron www, jest ona jedynie koncepcją, założeniem.

Zgodnie z jej ideą, do tworzenia witryn stosuje się odpowiednie technologie, techniki, które stale się rozwijają, dzięki rosnącej liczbie urządzeń umożliwiających korzystanie z Internetu.

Breakpoints – „elastyczna witryna”

Można stwierdzić, że zgodnie z ideą Responsive Web Design strona internetowa jest „elastyczna”. Dochodzi do zmiany w tzw.  breakpoints (lub breaking points), które odpowiadają „granicy” reakcji serwisu na zmiany. Strona ulega zmianie po to, aby można było ją skutecznie przystosować do rozdzielczości ekranu, na którym jest przeglądana. Zmiany w punkcie (breakpoints) mogą dotyczyć zarówno układu witryny, jak i elementów graficznych (mogą zniknąć lub dopasować się wysokością i szerokością), liczby elementów na stronie lub systemu nawigacyjnego, itd. Punkty zmian mogą występować w nadmiarze, są one powiązane z rozdzielczością sprzętu korzystającego przez internautów.

Czy tworzący stronę odczuwają pracochłonność?

Praca, jaka zostaje włożona w budowę serwisu wytworzonego zgodnie z koncepcją Responsive Web Design, w szczególności zależy od liczby punktów zmian (breakpoints), a także liczby elementów, które będą ulegać zmianie. Najpierw należy wszystko odpowiednio zaplanować – skutecznie przemyśleć każdą wersję, po to, aby zapewnić prosty jej odczyt oraz podświadomą nawigację na stronie. Dodatkowo, należy uwzględnić wszystkie powyższe założenia w każdej fazie powstawania strony.

Reasumując, budowanie strony zgodnie z koncepcją RWD wiąże się ze sporym nakładem pracy oraz poświęconym czasem. Swoją drogą, dzięki przystosowaniu witryny do teraźniejszych potrzeb, będziemy pewni, że jest ona poprawie wyświetlana na mobilnych urządzeniach. Przykładowo, gdy za kilka miesięcy czy lat pojawi się nowy smartfon lub tablet, który zdobędzie dużą popularność na rynku, nie trzeba będzie martwić się inwestycją w kolejną wersję strony www.

Liczba breakpoints czyli wersji serwisu

Tak naprawdę, wszystko zależy od nas, ile będziemy mieli „wersji”, które zmieniać się będą w punktach granicznych (breakpoints). Przeważnie przygotowywane wersje to opcje na komputer PC, smartfon, tablet lub netbook.

Graniczne rozdzielczości dla wersji strony to zazwyczaj:

• 320px,
• 480px,
• 600px,
• 768px,
• 900px,

Podsumowując, RWD polega na dostosowywaniu się strony internetowej, w zależności od rozdzielczości ekranu do treści, wyglądu, poszczególnych elementów, nawigacji. Może się zdarzyć tak, że w niektórych wersjach witryna zrezygnuje z pewnych elementów (mogą być zbyt „ciężkie” np. dla mniejszych urządzeń typu smartfon).

Responsive Web Design skutecznie i dynamicznie się rozwija, dzięki pojawieniu się CSS3, a dokładniej właściwości Media Queries, jak również dzięki zastosowaniu Fluid Design czy odpowiednich skryptów Javascript.