Responsive design

Ştim cu toţii că România se situează în topul ţărilor cu cea mai bună viteză de Internet. Şi pentru ca să beneficieze din plin de acest lucru, utilizatorii români îşi doresc ca fiecare website să fie rapid, indiferent de pe ce dispozitiv îl accesează. Însă, să recunoaştem, cu toţii am dat la un moment dat peste un website care avea probleme de navigare pe alte dispozitive. Fie că este vorba de butoane inaccesibile, scroll-uri orizontale care îngreunează afişarea sau suprapunerea imaginilor peste alte secţiuni, o astfel de experienţă te face să renunţi rapid la accesarea unui website.

Pentru ca aceste probleme să fie evitate, există o soluţie ce va mulţimi pe toată lumea: web design responsive. Conceptul de responsive design este relativ recent, fiind lansat în 2010; şi a apărut datorită creşterii în popularitate a dispozitivelor mobile.

Pe scurt, dacă un website este responsive, se poate adapta oricărui design de pagină, indiferent de rezoluţia ecranului. Astfel, dacă este accesat de pe laptop, tabletă, telefon sau desktop, design-ul website-ului se adaptează pentru fiecare dintre aceste dispozitive, fără a avea probleme de afişare.

Aşadar, în loc să fie făcute mai multe versiuni pentru un singur website, acesta poate fi gândit responsive de la început. Construirea unui astfel de website are la bază 3 elemente:

  • Griduri fluide. Până acum, toate website-urile foloseau griduri fixe deoarece majoritatea ecranelor aveau aceeaşi rezoluţie. Acest lucru s-a schimbat însă, şi varietatea de rezoluţii obligă la o fluiditate a gridurilor, care pot redimensiona şi păstra cu succes proporţiile website-ului.
  • Imagini flexibile, care au capacitatea de a-şi modifica dimensiunile în funcţie de proporţiile gridurilor. Exact ca în cazul unui puzzle, imaginile şi gridurile se aranjează astfel încât design-ul să conţină toate elementele componente ale website-ului, fără nici un fel de degradare a layout-ului.
  • Interogările media (media queries) – În funcţie de rezoluţia dispozitivelor, se pot încărca în website mai multe proprietăţi CSS. În momentul în care accesarea este făcută de pe un dispozitiv, website-ul recunoaşte automat tipul de dispozitiv şi încarcă proprietăţile CSS care corespund acestuia.

Ca să rezumăm, un design responsive oferă o versiune funcţională pentru toate rezoluţiile existente. În plus, website-urile au nevoie de un singur URL care poate fi accesat de pe orice dispozitiv. Acest lucru reprezintă un plus pentru campaniile SEO, un segment mare de utilizatori fiind acoperit, iar costurile reducându-se semnificativ. Aşadar, este momentul să profităm de o experienţă bună de navigare, oricum şi oriunde ne-am afla.