wi-01
pondělí, 18 listopad 2013 01:00

Responsive vs. adaptive design

Zde se podíváme na dva přístupy k webovému návrhu, se kterýma se jako webový integrátor rozhodně budete setkávat. Tyto přístupy v procesu výroby se často navzájem prolínají. Často se stává, že responsive designe má prvky adaptive designu a naopak. Můžou si být podobný, ale v explicitním významu těchto dvou přístupu najdeme zásadní rozdíly.

 

Responsive vs Adaptive

Responsive design

Responsive design je způsob stylování stránky, při kterém server nerozlišuje zařazení a neustále odesílá stejnou stránku. Stránky se mění přímo v prohlížeči pomocí kaskádových stylů na základě šířky zobrazovací plochy. Vzniklý výsledek pak vypadá tak, že uživatel na svém mobilu/tabletu vidí stejný obsah jako v desktopu pro co nejlepší použitelnost.

Výhody:

  • Pracujete s jedním kódem stránky, který upravujete pomocí CSS.
  • Na rozdíl od mobilního webu, zde máte jeden měřící kód, který se nachází na jednom místě. Díky němu získáváte globální statistiky a přehled z jakých zařízení a v jakém rozlišení byl Váš web zobrazován.
  • Responsive design se orientuje na rozlišení a ne na zařízení, což z něho dělá dobré dlouhodobé řešení. Hotový web nemusí být dodatečně upravován a optimalizován pro nový přístroj. Optimalizací prochází jen média při update obsahu..
  • Web Vám poskytuje stejný zážitek na všech platformách díky stejným grafickým prvkům.

Nevýhody:

  • Při nesprávný optimalizaci webu, se stahuje ne mobilní přístroj velký množství dat.
  • Na rozdíl od mobilního webu je o dost náročnější přidávat na web média. Je nutné upravit obrázky a videa pro každé rozlišení (videa je nutné optimalizovat). Ale i v této nevýhodě je výhoda, díky specializovaným úpravám web běží na mobilních zařízeních rychleji, jelikož nemusí stahovat zbytečně velké množství dat.
  • Po čase se jistě rozhodnete udělat několik změn na svém webu, a v té chvíli zjistíte další nevýhodu responsive designu oproti webový stránce s mobilní verzí. Místo úpravy pouze webu a mobilní stránky, musíte udělat změny pro každý rozměr designu, který jste si definoval při vývoji. (samozřejmě to stojí víc peněz a času).

Adaptive design

Adaptive design je optimalizace stránky zvlášť pro každou platformu s využitím všech jejich výhod a možností, ve výsledku na každém zařízení design koresponduje se standardním GUI daný platformy. Tato metoda zajišťuje, že server posílá do zařízení přesně upravenou webovou stránku pro daný typ zařízení a dané rozlišení. Většinou využívají kaskádové styly, aby stránka přesně zapadala do displeje uživatele.

Výhody:

  • Na rozdíl od responsive designu je adaptive design optimalizovaný pro každý typ platformy zvlášť, a tak využívá všechny její možnosti, vzory a funkce.
  • Získáte rychlé načítaní stránky díky serverový detekci zařízení a odeslání prohlížečů dat upravených pro dané zařízení.
  • Při správným nastavení by měl mít uživatel možnost přepnout zobrazení do „Velký" verze webu určené pro desktopy. Tuto možnost při responsive designu nemáte.

Nevýhody:

  • Vývoj webu je časově náročný, kvůli nutnosti optimalizace stránky pro každou zvolenou platformu na frontendu a backendu. Před samotným vývojem je klíčové si stanovit, pro které platformy chcete web optimalizovat.
  • Při responsive designu musíte znát html, css a testovat výsledek na displejích s různými velikostmi. Pro adaptive design musíte mít výbornou znalost všech platforem pro které chcete web upravovat, abyste dokázali dobře využít jejich možnosti.

Každý z těchto dvou přístupů má své silné a slabé stránky, ve spoustě věcí se ale výborně doplňují. Právě proto lze velmi často tyto přístupy, nebo alespoň jejich části použít v jednom projektu. Adaptive svou orientací na zařízení dává jako doplněk ke responsive designu webovému integrátorovi skvělé možnosti přizpůsobit web přesně podle potřeb klienta a uživatele.

 

Kontakt

phone

TELEFON
+420 731 407 301 
+420 725 499 618

email EMAIL
info@web-integrator.cz
address Wi s.r.o.
Bubenská 1
170 00 Praha 7
fb google-plus s-firmy