Sviluppo interfacce per il web (responsive web design)

Pubblicato il
Responsive web design Vicenza
Responsive web design Vicenza

Quando si realizza un sito web non ci si deve limitare a crearlo solamente per chi lo usa attraverso un normale PC, ma è sempre più importante tenere conto dei numerosi utenti che navigano attraverso tablet e smartphone. La larga diffusione di terminali come iPhone, iPad e dispositivi con Android, fa sì che il web sia disponibile a diverse tipologie di schermi che richiedono di essere gestiti in maniera opportuna.

I «fattori di forma»

Esistono tantissimi «form factor» (o fattori di forma). Ad esempio i monitor dei PC desktop sono grandi almeno 17-20”, con risoluzioni non inferiori a 1600px di larghezza, mentre i computer portatili hanno solitamente schermi da circa 13-15”. Infine troviamo tablet e smartphone, i primi con schermi da 7” o 10” circa, i secondi con schermi da tre o quattro pollici di diagonale, e possiamo anche ruotarli di novanta gradi! Insomma c’è proprio l’imbarazzo della scelta.

Form Factor

Creare un sito adattabile

Ma come si può sviluppare un sito web che sia sempre ben leggibile ed usabile? Grazie alle moderne tecniche per la realizzazione di siti web è possibile fare in modo che le pagine si adattino in maniera appropriata alle varie dimensioni e risoluzioni.

Ottimizzare un sito web per la navigazione da smartphone o da tablet, però, non vuol dire solo riorganizzare l’impaginazione del sito per renderlo leggibile anche in schermi piccoli, ma significa progettare e sviluppare un’esperienza d’uso adeguata per la specifica tipologia di dispositivo.

Si rende quindi necessaria un’analisi di come il sito viene usato dagli utenti e quali sono i motivi per cui il sito è visitato e di conseguenza determinare l’impaginazione, la dimensione dei pulsanti ed in genere ogni aspetto dell’interfaccia del sito web.

Responsive web design

Una delle tecnologie che si può adottare è il «responsive web design» (o RWD). Tale sistema permette di creare un sito web che si adatti dinamicamente in base alla dimensione ed all’orientamento dello schermo. Grazie ai linguaggi HTML5, CSS3 e JavaScript il sito web è in grado di rilevare la risoluzione e quindi risponde in maniera ottimizzata al dispositivo.

Mobile first

In alcuni casi può essere utile utilizzare un approccio «mobile first». Se il target del sito web è in primis l’utenza mobile (smartphone / tablet), è conveniente progettare tutta l’interfaccia a partire dalle esigenze di questi utenti e solo successivamente adattare quanto creato per i classici desktop e notebook.

Gli utenti mobile non sono cittadini di serie B

Nel prossimo futuro sempre più spesso si accederà al web usando tablet e smartphone, pertanto non bisogna sottovalutare questo mercato. Il 2012 sarà un anno decisivo per il web mobile ed anche i siti web dovranno tenerne conto ed essere ottimizzati sia dal punto di vista dell’interfaccia che per quanto riguarda il posizionamento ed il SEO.