Mi a különbség a responsive és az adaptív design között?

Az adaptiv oldalaknál több weboldal van. Attól függ, hogy melyik fog megjelenni, hogy milyen eszközzel csatlakozol rá.

Például ha beírod a böngészőbe, hogy "youtube.com", akkor ezek a külömböző oldalak jelenhetnek meg, attól függően, hogy milyen eszközt használsz:

PC: http://www.youtube.com

Mobil: [link]

TV: [link]

A responsive oldalak attól függően rendezik el a tartalmukat, hogy a böngésződ ablaka milyen széles.

Mobil-nál kicsi az ablak szélesség.

Tablet-nél közepes az ablak szélesség.

PC-nél nagy az ablak szélesség.

Adaptív: Külön View -okból épül fel, külön HTML, CSS, JS -ből áll.

Ez főleg azért jó, mert mobilokon nem kell csak a dekastophoz tartozó elemeket is letölteni.

Megállapítása hogy Mobil / Tablet, vagy Desktop azt pl. UserAgent alapján lehetséges.

Media Query -t persze itt is használunk, főleg a Tablet - Mobil -nál történő elrendezési különbségek miatt.

A Responsive -nál csak 1 View szerkezet van, azaz 1 van formélva desktop, tablet és mobilra is.

Itt csak CSS -el, és JS -el manipuláljuk a megjelenést.

Ennek az az előnye, hogy nem kell a nézeteket külön elkészíteni, így a fejlesztés azon része gyorsabb.

De cserébe a kliens oldalon nagyobb adatforgalom, nagyobb hardver igénnyel rendelkezik, így sokszor a kicsi 512MB RAM -al szerelt készülékeken kifagy, össze omlik a böngésző.

Mind kettőnek van létjoga, csak előbbit a több fejlesztési költség miatt nem igen szokták kérni.

De pl. www.facebook.com és touch.facebook.com , m.facebook.com mind 3 platformot lefedi.