Redazione
a- a+

Scegliere la migliore risoluzione e dimensione per un sito web normale, cellulare e tablet

Vediamo come fare a scegliere la risoluzione ideale per il vostro sito web.

È importante lavorare con una serie di standard fissati. Ciò assicura che il lavoro del progettista sarà effettivamente riutilizzabile.

Nel mondo del web, il design è una materia complessa e variegata. Per un grafico su carta che non si mai è avventurato nel web design, il primo impatto può sembrargli un mondo stravagante dove non riesce a orientarsi. Questo perché quando si progetta per il web si ha una libertà inaspettata. Tuttavia, ci sono alcuni fattori che è necessario tenere bene in mente. Tra questi, uno dei più importanti è sapere quale deve essere la dimensione del sito, aspetto che dipende dalla risoluzione e dalla dimensione fisica dello schermo.

Nella Rete la regola vigente è progettare i siti web per le risoluzioni dello schermo più comuni, ovvero con le risoluzioni che la maggior parte delle persone usa. Attualmente, il formato che può senz’altro essere considerato lo standard è 1024 x 768. Tuttavia, vi è un fattore relativamente nuovo e importante che i progettisti devono tenere in conto: la diffusione di dispositivi portatili. La popolarità dei dispositivi Android e iOS (sistema operativo di Apple) e la crescita lenta di Windows 7 mobile non possono essere ignorate. Questi dispositivi possono essere smartphone o tablet PC.

Nella tabella soprastante, sono inclusi la risoluzione media per i computer desktop, l’Apple tablet e i cellulari (smartphone). Tuttavia, queste risoluzioni rappresentano le dimensioni a schermo intero e i browser come si sa occupano parte dello schermo, sotto forma di barre di stato, barre di pulsanti, barre di indirizzo, barre di scorrimento e così via. La riga "Spazio disponibile" della tabella di cui sopra è una buona linea guida per la progettazione di un sito per dispositivi mobile. Questo ci aiuta a progettare le pagine web in modo da evitare che compaiano barre di scorrimento, specialmente quando stiamo progettando per uno spazio che non è destinato a scrollare.

La figura sopra mostra la dimensione approssimativa di tutte e tre le dimensioni dello schermo in pixel e mostra lo spazio utilizzato dalle varie barre di pulsanti, dalle  barre di stato e simili. Tuttavia, si può notare qualcosa di strano: la risoluzione per l’iPhone sembra sproporzionata. Riferendoci alla tabella poco sopra, la riga "Dimensioni dello schermo" mostra una differenza significativa tra la dimensione effettiva dello schermo e la risoluzione dello schermo stesso.
 
La figura successiva:

ci dà una comprensione migliore e ci aiuta a progettare un'interfaccia web mobile migliore per telefoni come l'iPhone. Rappresenta il confronto tra le dimensioni fisiche reali dei vari schermi. Mentre la risoluzione è un aspetto molto importante del design, non è utilizzabile come una misura standard per le dimensioni di un sito mobile, così come è stato per i computer desktop, altrimenti c’è il rischio di progettare dei siti che su uno smartphone possono risultare quasi illeggibili.

Punti da ricordare:

  • Utilizzare la risoluzione come una dimensione del sito web va bene per la versione desktop di un progetto
  • Usare le dimensioni fisiche come la dimensione del sito web è meglio per i dispositivi portatili
  • È auspicabile progettare tre varianti sul design di un sito web, in modo da tenere conto delle diverse misure dei dispositivi con cui gli utenti potrebbero accedere al sito.