V-ați întrebat „Ce este designul web receptiv?” Proiectarea web receptivă este o abordare prin care un designer creează o pagină web care „răspunde” sau se redimensionează în funcție de tipul de dispozitiv prin care este văzut. Acesta ar putea fi un monitor de computer supradimensionat, un laptop, o tabletă de 10 inch, o tabletă de 7 inch sau un ecran de smartphone de 4 inch.
Proiectarea web receptivă a devenit una dintre cele mai tari tendințe în 2013. Acest lucru se datorează parțial creșterii smartphone-urilor și a altor dispozitive mobile. Mai mulți oameni folosesc dispozitive cu ecran mai mic pentru a vizualiza paginile web.
De fapt, Mashable a numit chiar 2013 Anul proiectării web responsive. Pete Cashmore a scris: „Pentru cei dintre noi care creăm site-uri web și servicii, toate acestea duc la o concluzie singulară: un milion de ecrane au înflorit și trebuie să le construim pentru toate”.
Cum arată designul web receptiv?
Scopul designului receptiv este de a avea un singur site, dar cu elemente diferite care răspund diferit atunci când sunt vizualizate pe dispozitive de dimensiuni diferite.
Să luăm un site tradițional „fix”. Când este vizualizat pe un computer desktop, de exemplu, site-ul web poate afișa trei coloane. Dar când vizualizați același aspect pe o tabletă mai mică, s-ar putea să vă obligați să derulați orizontal, ceea ce nu le place utilizatorilor. Sau elementele ar putea fi ascunse vederii sau ar putea fi distorsionate. Impactul este, de asemenea, complicat de faptul că multe tablete pot fi vizualizate fie în orientare portret, fie rotite lateral pentru vedere peisaj.
Pe un ecran mic de smartphone-uri, site-urile web pot fi și mai dificile de văzut. Imaginile mari pot „rupe” aspectul. Site-urile pot fi încărcate lent pe smartphone-uri dacă sunt grele.
Cu toate acestea, dacă un site folosește un design receptiv, versiunea tabletei se poate regla automat pentru a afișa doar două coloane. În acest fel, conținutul este lizibil și ușor de navigat. Pe un smartphone, conținutul ar putea apărea ca o singură coloană, poate stivuită pe verticală. Sau, eventual, utilizatorul ar putea să se deplaseze pentru a vizualiza alte coloane. Imaginile se vor redimensiona în loc să distorsioneze aspectul sau să fie tăiate.
Ideea este: cu un design receptiv, site-ul web se ajustează automat în funcție de dispozitivul în care îl vede spectatorul.
Cum funcționează designul web receptiv?
Site-urile responsive utilizează rețele fluide. Toate elementele paginii sunt dimensionate în funcție de proporție, mai degrabă decât de pixeli. Deci, dacă aveți trei coloane, nu ați spune exact cât de largi ar trebui să fie fiecare, ci cât de largi ar trebui să fie în raport cu celelalte coloane. Coloana 1 ar trebui să ocupe jumătate din pagină, coloana 2 ar trebui să ocupe 30%, iar coloana 3 să ocupe 20%, de exemplu.
Mediile precum imaginile sunt, de asemenea, redimensionate relativ. În acest fel, o imagine poate rămâne în coloana sa sau în elementul de design relativ.