Il web in tasca! Il web-design che punta ai dispositivi mobili

Nel 2014 gli utenti che navigheranno su dispositivi mobili saranno superiori a quelli che navigheranno da PC o desktop. La progettazione di siti internet per dispositivi mobili si presenta quindi come una scelta pressoché obbligata; ma molti sono i problemi di cui tenere conto, tra cui l’estrema variabilità dei dispositivi, con dimensioni di visualizzazione molto diverse, compatibilità di linguaggi di marcatura, plugin e il rapporto tra sistemi operativi e browser, ciascuno con le sue possibilità.

Dalla variabilità all’uniformità

Data l’enorme variabilità dei dispositivi è difficile dare delle linee guida robuste; è per questo che molti ritengono importante il successo dell’iphone che tende ad uniformare il mercato e la progettazione dei dispositivi.

Molti browser di smartphone e tablet hanno capacità di resa inferiori a quelli dei nostri computer: le pagine vengono rielaborate in modo differente da come le si vedono sul computer. Di base le pagine vengono semplicemente ridotte alle dimensioni del dispositivo mobile così come apparirebbero su un computer. Si tratta di una semplice funzione di zoom.

Sito parallelo o stesso sito adattabile?

È una scelta importante che ovviamente prescinde dal tipo di sito che andiamo a realizzare.

Se vogliamo creare un sito web adattabile, si può agire creando un diverso foglio di stile specifico che viene richiamato quando viene riconosciuto il dispositivo mobile. Ciò implica che comunque il sito dovrà avere dimensioni che si adattano alla risoluzione dello schermo, ed una struttura del sito molto dinamica. Ciò spesso porta a delle scelte grafiche “obbligate” che non ci lasciano spesso la libertà che desideriamo.

La scelta di un sito parallelo permette innanzitutto una scelta grafica molto più libera sul sito principale e una scelta grafica ottimizzata per i dispositivi mobili. Inoltre, cosa molto più importante, è la scelta dei contenuti da rendere visibili o meno sul sito ottimizzato per smartphone e tablet. In genere chi naviga da cellulare vuole avere subito i contenuti che cerca, senza dover perdere tempo a scorrere uno schermo minuscolo, e senza dover attendere tempi di caricamento maggiori per contenuti che non gli interessano; e soprattutto spesso capita che si hanno a disposizione dei MB limitati da scaricare a causa degli abbonamenti scelti per la propria telefonia, e quindi un sito progettato per dispositivi mobili deve essere molto più leggero.

Non possiamo quindi dire quale delle due soluzioni sia la migliore. Ogni sito, in base al suo modo di comunicare, ai contenuti e al target di riferimento, opterà per una soluzione o per l’altra.

Alcune linee guida per la progettazione di siti per dispositivi mobili e touch

Queste sono solo alcuni dei consigli che ci sentiamo di dare, basati su ricerche sul web e sulla nostre esperienze:

• Progettare contenuti adatti al contesto web: capire cosa vuole l’utente e mettere in rilievo i contenuti più richiesti. Quindi ridurre il numero dei contenuti, link, bottoni, campi. Ridurre inoltre la dimensione e il numero delle immagini.
• Usare layout semplificati, basando la struttura su un’unica colonna.
• Rendere le aree cliccabili più grandi per le interfacce touch.
• Utilizzare tecnologie che non abbiano problemi sui dispositivi mobili. Mentre XHTML e CSS sono ottimamente supportati su tablet e smartphone, ciò non vale per javascript, flash, video e altri plugin. Quindi è bene progettare delle alternative a queste soluzioni.
• Peso delle pagine inferiore, a causa di connessioni precarie e una banda più ristretta. Le regole W3C consigliano un peso massimo di 20kb per un sito internet.
• Testare il sito su emulatori o, se possibile, meglio su dispositivi reali.