fbpx

Adaptive vs. Responsive Web Design. Które rozwiązanie jest lepsze? Część 2

Adaptive czy Responsive Web Design? Odpowiedż na to pytanie wcale nie musi być oczywista. Z tej cześci naszego poradnika dowiecie się, na czym polega działanie Adaptive Web Design i poznancie wyniki porównania obu sposobów projektowania serwisów i e-sklepów.

W pierwszej części niniejszego poradnika była mowa o tym, że w przypadku RWD stały jest kod HTML, natomiast zmienne są style CSS, które wczytują elementy zawartości witryny dopasowane rozmiarami do danej rozdzielczości.

W przypadku Adaptive Web Design (AWD) jest dokładnie odwrotnie. Do każdej rozdzielczości jest przygotowywana osobna wersja strony. Jak działa to w praktyce? Po wpisaniu w pasku adresu przeglądarki, nazwy witryny zaprojektowanej w AWD, zostaje wysłane zapytanie do serwera.

Serwer po otrzymaniu zapytania, rozpoznaje urządzenie z jakiego zostało ono wysłane i wysyła specjalnie zaprojektowany kod witryny, zapisany w HTML. AWD opiera się na tzw. breakpointach, po przekroczeniu których wysłana zostaje konkretna wersja strony.

Interesującą komparystykę obu standardów projektowania www na swoim blogu przedstawiła agencja interaktywna catchpoint.com.

W celu porównania obu podejść do budowy stron internetowych posłużyli się popularnym CMS jakim jest bez wątpienia WordPress.  Na potrzeby testu wybrano jedną z podstawowych skórek –  TwentyFourteen, która domyślnie zbudowana jest w oparciu o RWD. Aby dopasować ją do wymagań AWD wykorzystano plugin WiziApp. Jakie były wyniki tego eksperymentu?

Strona w AWD  załadowała się po 1,53 s, “ważyła”  2, 47 Mb i składała się z 20 obiektów. Z kolei wyniki dla wersji w RWD wyniosły odpowiednio 4,08 s, 4,22 MB i 61 obiektów.

 

Zostaw odpowiedź