May 28 17

Ce alegem: Responsive sau Adaptive design?

Adaptive vs Responsive

Responsive Design

In situatia in care site-ul este realizat cu in sistem Responsive, acesta se adapteaza la dimensiunea viewport-ului din browser. In mod normal programatorii web folosesc ca variabila latimea browser-ului, aceasta determinand dimensiunile elementelor care se schimba dinamic in pagina.

Un design Responsive este in intregime fluid si se va adapta dimensiunilor viewport-ului indiferent de marimea ferestrei de browser sau de ecran. Acest lucru este datorat faptului ca sunt folosite procente in regulile CSS pentru a se schimba design-ul in functie de dimensiunea platformei de pe care este accesat site-ul.

Indiferent daca browser-ul este dimensionat la 400 px sau la 45000 px latime, elementele din pagina se vor adapta permanent la o proportie specificata in prealabil si facand ca pagina sa arate bine tot timpul.

Beneficiile acestei tehnologii sunt nenumarate. Principalul avantaj este acela ca partea de cod nu trebuie schimbata pentru mobil, desktop sau oricare alta marime de ecran intre ele.

Foarte multi designeri considera ca tehnologia Responsive este mai complexa din moment ce ei trebuie sa creeze design-ul pentru un numar infinit de dimensiuni de ecran. In timp ce acest lucru este partial adevarat, marele avantaj este ca vom avea un cod mult mai curat care se poate adapta mult mai bine design-ului.

Adaptive Design

La fel ca tehnologia Responsive, un site creeat in sistem Adaptive se va modifica automat in functie de dimensiunea browser-ului, dar o face intr-un alt mod.

Design-ul Adaptive consta din multiple renditii ale aceluiasi design – unul pentru fiecare dimensiune, conform cerintelor designer-ului.

Fiecare versiune de design este atribuita unei latime specifice ale browser-ului, numite “anchor points”. Anchor points vor “spune” browser-ului cand sa sara la urmatorul layout.

Cu alte cuvinte continutul paginii se va redimensiona automat odata ce dimensiunea viewport-ului va trece de un prag predefinit.

In general designer-ul va realiza cate un layout diferit pentru fiecare din cele sase latimi uzuale de viewport. Acestea pot fi foarte diverse, incluzand ecranele pentru mobile si terminand cu cele mai mari latimi de desktop-uri: 320px, 320px, 480px, 760px, 960px, 1200px, si 1600px.

In loc sa utilizeze procente, un design adaptive va utiliza un layout static pentru fiecare anchor point si va adapta ecranului de indata ce acel anchor point este detectat.

La fel ca design-ul responsive, design-ul adaptive poate fi complex deoarece designer-ul trebuie sa creeze aceeasi pagina de mai multe ori (de sase sau mai multe ori). In cazul unui site complex acestea pot fi de ordinul zecilor.

Cum hotaram ce tehnologie folosim?

Responsive

Daca vreti sa creati un site complet nou, este mai bine sa folositi sistemul Responsive astfel in cat fiecare utilizator va avea o buna experienta de navigare.

Chiar daca sistemul Responsive va necesita un timp mai indelungat de programare, rezultatele sunt mult mai bune astfel ca majoritatea companiilor care isi refac site-ul sau il construiesc de la zero opteaza pentru acest sistem.

Toate site-urile realizate de WebDesignBrasov.ro sunt in sistem Responsive, indiferent de gradul de complexitate al proiectului.

La decizia asupra tehnologiei folosite trebuie sa considerati timpul care trebuie alocat pentru corecturi si teste ale diferitelor elemente ale site-ului. Design-ul Responsive va aranja aceste elemente sa se potriveasca ecranului, ceea ce inseamna ca designer-ul sau programatorul vor trebui sa faca multiple teste pentru a se asigura ca design-ul este corespunzator pentru fiecare dimensiune de ecran.

Adaptive

Daca nu aveti suficient timp sa alocati proiectului – fie din considerente de buget sau din cauza termenului de predare, design-ul Adaptive va va avantaja daca aveti acces la datele statistice de vizitare ale site-ului.

Aceste date va ajuta sa realizati site-ul pentru cele mai frecvente dimensiuni de ecran ale utilizatorilor. In acest fel veti putea pregati design-ul pentru grupul cel mai frecvent de utilizatori, economisind timp.

Sistemul Adaptive este perfect in cazurile in care un site necesita cateva simple actualizari. In cazul in care site-ul trebuie refacut complet sau este de mare complexitate, se recomanda sisteul Responsive.

Articol preluat de pe UsabilityGeek.com

Cele mai recente lucrari