Blog
2013 22 Dec

Responsive design sau versiune de mobil?

Majoritatea potentialilor clienti ne intreaba daca site-ul lor o sa fie "adaptiv" (responsive), sa se incarce pe toate dispozitivele (mobil, smartphone, tableta, laptop, desktop).

Exista 3 versiuni de design pentru dispozitive mobile:

  1. versiune design responsive
  2. versiune design pentru mobile
  3. versiune site de mobil (m.site.ro)

Un design responsive inseamna ca site-ul se "adapteaza" in functie de rezolutia fiecarui vizitator, astfel incat daca aveti vizitatori de pe mobile, site-ul se "adapteaza" pentru mobile.

Numarul de vizitatori de pe dispozitive mobile, cat si numarul celor care cumpara de pe mobil, este in crestere. Asa ca avem nevoie de un site responsive.

responsive design

In teorie majoritatea recomanda design responsive, pentru ca este ultimul trend si mai ales pentru ca google recomanda acest lucru. Mai exact, google recomanda 3 variante, responsive design, dynamic serving si versiune de mobil (site pentru mobile, ex: m.site.ro).

Avantajele unui site responsive: 

  • un singur site, mai multe dispozitive (desktop, tableta, mobil)
  • Usor de administrat (acelasi panou de administrare)

Aceleasi avantaje le are si un site cu versiune pentru mobile (dynamic serving). 

Versiunea de mobil, implica crearea unui site separat, care este oferit doar vizitatorilor ce folosesc telefoane mobile, in formatul m.site.ro. 

Ce fel de versiune este recomandata pentru un site de prezentare?

Alegerea apartine clientului, fiecare dintre cele 3 versiuni are avantajele si dezavantajele ei. 

In cazul unui site de prezentare, versiunea responsive este versiunea cea mai folosita, cu toate ca versiunea pentru mobile este mai utila. Va recomandam versiunea responsive pentru orice tip de site de prezentare, pentru ca este gratuita, inclusa in pretul pentru crearea unui site. 

Dar pentru magazinele online?

Pentru magazinele online, versiunea responsive nu este o solutie optima, clientul poate alege dintre versiunea pentru mobile, sau varianta de mobil (m.site.ro).

In practica, varianta responsive obliga vizitatorul de pe dispozitive mobile, sa incarce foarte multe scripturi inutile, oferind un timp de incarcare mai mare si o navigare mai complicata. Cum un magazin online include foarte multe functionalitati, in marea lor majoritate, inutile pentru dispozitivele mobile, va recomandam sa alegeti versiunea pentru mobile.

Daca utilizatorul de smartphone foloseste o retea dintr-un pub, magazin, 3g, etc. este obligat sa incarce la o viteza mica, foarte multe scripturi inutile.

Daca magazinul este deja un brand cunoscut, puteti opta si pentru versiunea de mobil (m.magazin.ro) si in majoritatea cazurilor, pentru o aplicatie de mobil.

Design responsive si rezolutia dispozitivului

Va recomandam design pe baza unui grid 960px, indiferent de tipul de site pe care il dezvoltati. Foarte putini dintre designerii romani inteleg faptul ca aproximativ 50% din utilizatorii de internet din Romania, folosesc dispozitive cu rezolutie de aproximativ 1024 px  (monitoare, laptops vechi si tablete). Trebuie sa intelegeti ca targetul vostru sunt vizitatorii din Romania, iar utilizatorii romani sunt un pic diferiti fata de cei din statele unite sau europa (unde se fac studii si analize).

Un site creat pe un grid 960px se incarca (logic) pe toate rezolutiile, iar pentru mobile sa optati pentru versiunea pentru mobile. 

Trebuie sa intelegeti ca site-ul dvs nu este creat pentru dumneavoastra, el este creat pentru clientii (vizitatorii dvs) astfel incat toate functionalitatile cat si design-ul trebuie create pentru ei si nu pentru dvs.

Daca doriti un site mai lat (>960px), cereti programatorilor un site responsive, astfel incat sa se incarce corect si pe rezolutii de 1024 si bineinteles pentru mobile.

Seo pentru fiecare versiune

In cazul in care optati pentru design responsive sau cu varianta pentru mobile, dpdv seo, site-ul nu are probleme, deoarece link-urile raman identice. In cazul versiunii de mobil (m.site.ro) acesta este considerat un site separat si aveti 2 optiuni:

  1. optimizati separat site-ul m.site.ro
  2. folositi canonical pentru toate paginile

Va recomandam primele 2 versiuni, daca doriti ca site-ul dvs sa-si pastreze pozitiile si traficul. Versiunea de mobil (m.site.ro) implica costuri suplimentare, atat pentru programare, cat si pentru optimizare.

Exemplul Amazon

Foarte multi se limiteaza la exemplul Amazon, cand vine vorba de magazinele online.

Cate magazine mai stiti full width? Este magazinul vostru la fel de cunoscut precum amazon?

Majoritatea magazinelor, mai mici sau mai mari, in comparatie cu amazon, NU au un design full, folosesc in majoritatea cazurilor un grid 960px. Target.com (960px), wallmart.com (960px), macys.com (960px), newegg.com (960px home, 1280px pagini interne, cu resize pentru 1024), B&H (960 px) etc.

Amazon foloseste versiunea pentru mobile, nu versiunea de mobil (m.amazon.com). Este versiunea optima pentru un magazin online.

Recomandari

Site de prezentare: design responsive

Magazin online: design fix (grid) cu versiune pentru mobile (daca va doriti performanta) sau responsive

Portal: design responsive

Fiecare nisa are numarul ei de vizitatori de pe dispozitive mobile, astfel incat indiferent daca acestia sunt in proportie de 5% sau 25%, site-ul dvs are nevoie de o versiune pentru mobil.

De fiecare data cand caut o informatie (simptome pentru o boala la copii), un serviciu (instalator) sau pretul unui produs (sunt in magazin si vreau sa verific daca pretul este bun), folosesc telefonul. Daca sunt la birou, atunci cu siguranta folosesc desktop-ul, iar daca sunt "pe drum", folosesc laptopul sau tableta. Site-ul dvs trebuie sa ofere aceeasi informatie pe orice dispozitiv.

scris de

Cristian Butaru Project Manager