A causa dell’annuncio di Google che favorirà i siti mobile-friendly nelle sue pagine di ricerca da dispositivi mobili e il crescente utilizzo di quest’ultimi rispetto ai desktop PC, il responsive web sta acquisendo un ruolo sempre più importante nell’ambito del web design.
Gli utenti sono sempre più esigenti e pretendono siti in grado riadattarsi in funzione del tipo di dispositivo utilizzato. In caso contrario il risultato sarà quello di un utente frustrato che non avrà più interesse a rivisitare il sito web. Ecco quindi che viene incontro il responsive web. Si tratta di una tecnica che permette di progettare un sito web maggiormente intuitivo e funzionale non soltanto per gli utenti che navigano da PC, ma anche e soprattutto per gli utenti che navigano dai dispositivi a schermo piccolo.
La forma più semplice di responsive web prevede il riadattamento della pagina web in funzione della tipologia di schermo. In realtà la tecnica è molto più potente di quanto si possa pensare e consente ai web master tantissime personalizzazioni, tra le quali ad esempio il poter rendere disponibile i contenuti in funzione della regione geografica dell’utente.
Il 2015 è l’anno che incorona il responsive web. La maggior parte dei siti web sta ricorrendo a questa tecnica per migliorare l’usabilità e mostrarsi mobile-friendly agli occhi di Google. Per comprendere quanto sia importante utilizzare il responsive web per il tuo sito Internet, basta dare un’occhiata al Google Analytics, vedrai infatti come nell’ultimo periodo siano incrementate le visite da dispositivi mobile.
Come realizzare un sito responsive web
Per passare al responsive web esistono due diversi approcci. Il primo prevede la creazione un sito web adaptive con più layout a larghezza fissa che sono prestabiliti per i dispositivi mobile più comuni. Il secondo offre invece un layout cosiddetto liquido, ossia in grado di riadattarsi automaticamente in funzione delle dimensioni dello schermo. In entrambi i casi vi sono vantaggi e svantaggi, è bene quindi valutare correttamente la soluzione da scegliere prima di mettere mano al codice.
L’aspetto positivo di un layout responsive web a larghezza fissa è che offre un maggior controllo sul fattore estetico, e come se si realizzassero tre/quattro siti differenti a seconda delle dimensioni dello schermo. Il suo svantaggio maggiore è l’incapacità di rispondere ai cambiamenti nelle dimensioni del browser, una problematica particolarmente evidenziata tra gli schermi dei desktop e quelli dei laptop.
Per quanto riguarda, invece, il layout a griglia fluida, a differenza della tecnica precedente, lavora sulle proporzioni piuttosto che sui pixel. Questo gli consente di riadattarsi non soltanto il funzione dei dispositivi, ma anche in funzione delle dimensioni del browser.
In base a queste considerazioni, potresti pensare di utilizzare il responsive web a larghezza fissa per i dispositivi mobile e quello a griglia liquida per i dispositivi desktop e laptop. In realtà, in commercio esistono diverse tipologie di dispositivi mobile, siano essi smartphone o tablet, ognuna con dimensioni dello schermo differenti. Prevedere siti a larghezza fissa per ogni dispositivo mobile potrebbe quindi essere un problema. In tal caso il responsive web a griglia liquida rappresenta la soluzione migliore.
Nel responsive web anche le immagini sono importanti
Quando si progetta un sito responsive web è molto importante tenere in considerazione anche la grandezza delle immagini e la loro capacità di riadattarsi in dimensioni. Bisogna quindi creare delle immagini fluide all’interno di una griglia fluida.
Affinchè ciò sia possibile vengono in aiuto i CSS. Mediante la semplice riga di codice img {max-width:100%} le immagini sul sito non appariranno mai allungate e fuori misura, dando l’impressione di una grafica pulita e professionale.
Meglio un’app o un sito responsive web?
Probabilmente ti starai chiedendo se per facilitare l’uso ai clienti smartphone e tablet non sia meglio progettare un’App apposita. In effetti questa soluzione deve essere presa in considerazione, ma a mio parere è comunque sempre meglio dotarsi anche di un sito responsive web. Lo sviluppo delle App, infatti, dipende dal sistema operativo del dispositivo (Android, Apple o Windows Phone). Sviluppare un’App solo per uno di essi precluderebbe l’utilizzo a tutti gli altri utenti, mentre lo sviluppo per tutti i sistemi operativi potrebbe comportare un investimento economico non da poco. Ecco perché è sempre meglio dotarsi di un portarle responsive web, che possa essere visitato da chiunque e con qualsiasi dispositivo.
Spero questo post ti sia stato utile per comprendere cosa sia in effetti il responsive web e quale sia la sua reale importanza. Se credi che passare ad un sito responsive sia piuttosto complicato e non hai voglia di spendere molto tempo a scrivere righe e righe di codice, ti faccio presente due front-end frameworks, Foundation e Bootstrap, che potrebbero aiutarti a generare con semplicità un sito web responsive.
