Responsive Web Design, el nou disseny web
Actualitzat: 26 / 02 / 2022

Responsive Web Design, el nou disseny web

Francesc Sánchez CEO La Teva Web
Francesc Sánchez
Expert en marketing digital
SectorParlem de

El disseny web responsive permet adaptar com es veu una web en funció del dispositiu.

El Responsive Web Design es podria traduir en català per disseny web adaptatiu i consisteix en la programació i disseny web de pàgines web que s'adaptin a l'entorn de l'usuari, principalment a la seva pantalla. Ethan Marcotte és el pare de la tècnica de disseny web.

El disseny web adaptatiu neix amb l'ús intensiu de Smart phones, tablets i mòbils com Iphone, Ipads o dispositius Android amb l'objectiu que la pàgina web es mostri d'una forma o altra adaptant-se a la resolució de la pantalla. El seu ús no abasta únicament dispositius mòbils sinó que s'amplia a ordinadors de sobretaula que disposen de grans resolucions de pantalla.

El disseny web adaptatiu es basa en l'ús de continguts i imatges fluides, així com a mitjana-queries als CSS (que determina la disposició de la pàgina web) per adaptar el disseny web en funció de la pantalla que utilitzi l'usuari i sempre amb una única versió d'HTML i CSS, evitant la creació de diferents webs per a cada dispositiu o pantalla i beneficiant el posicionament web a Google. Normalment utilitza els anomenats punts d'interrupció o de salt per determinar com apareixerà el disseny d'un lloc: un disseny s'utilitza per sobre d'un punt d'interrupció i un altre s'aplica per sota d'aquest punt d'interrupció. Els punts d'interrupció es basen habitualment en l'amplada del navegador.

El Responsive Web Design té grans avantatges respecte al fet de desenvolupar pàgines web diferents en funció del tipus de dispositiu on es visualitzarà. L'ús d'una única base de codi pot fer que el desenvolupament sigui més ràpid, en comparació amb el desenvolupament de diversos llocs diferents, i facilita el manteniment al llarg del temps, ja que cal actualitzar únicament una pàgina web.

Com prioritzem la disposició dels continguts és clau. Mitjançant el disseny web adaptatiu solem amagar blocs sencers d'informació per quedar-nos amb allò particularment rellevant. En un ordinador de sobretaula podem visualitzar molt de contingut sense desplaçar-nos amb el ratolí, mentre que a la pantalla d'un mòbil és molt difícil abastar molt de contingut a la pantalla. Si els usuaris no veuen instantàniament el que volen en un monitor descriptori, poden mirar fàcilment al voltant de la pàgina per descobrir-ho. En un telèfon intel·ligent, és possible que els usuaris s'hagin de desplaçar sense parar per descobrir el contingut d'interès. La priorització de contingut de forma intel·ligent ajuda els usuaris a trobar el que necessiten de manera més eficient i, molt important, sense que se'n vagin de la nostra pàgina web.

Francesc Sánchez CEO La Teva Web
Sobre l'autor/a
Francesc Sánchez — Expert en marketing digital
Barceloní, expert en marketing digital. Fundador i CEO de La Teva Web i inaugurador del nostre magnífic blog. M'entusiasma haver col·locat la primera pedra dels fonaments que sostenen els nostres valors: clients feliços i projectes que deixen empremta.

Notícies relacionades

Tens un projecte en ment? En volem saber més!