Uno dei primi passi nella realizzazione di un buon sito web è la progettazione del layout. Normalmente questa è influenzata dalla quantità di contenuti di un sito, dal design della pagina e dall’usabilità dei vari elementi presenti.
Una volta definiti questi aspetti si può partire definendo una griglia per il nostro layout. Questo permettà di mantenere ordine e conformità grafica nelle varie pagine.
Per realizzare una griglia è necessario definire almeno tre dimensioni:
-Larghezza della pagina
-Numero di colonne
-Spaziatura tra i vari elementi
Larghezza della pagina
Per questa dimensione è consigliabile utilizzare una misura uguale o inferiore ai 960px che rappresenta l’area visibile dall’utente ad una risoluzione di 1024x768px con i diversi browser. La misura in realtà è di 968px ma viene arrotondata per comodità. Essendo la risoluzione minima più usata dagli utenti di 1024x768px garantisce un ottima compatibilità con i monitor degli utenti.
Numero di colonne
Il numero di colonne deve essere definito in base alla quantità e alla varietà di contenuti del sito. E’ utile ricordare che un minor numero di colonne lascerà più spazio per immagini e grafiche mentre un numero eccessivo renderà il contenuto difficilmente leggibile. Bisogna sempre valutare a priori quale soluzione sia opportuna per un determinato contesto.
Spaziatura tra gli elementi
In qualunque contesto grafico è utile lasciare un minimo di spazio tra i contenuti per migliorare la leggibilità e soprattutto definire aree differenti con diversi elementi. Facendo attenzione che lo spazio sia proporzionale ai contenuti e non faccia prevalere il “vuoto” che porterebbe solo disturbo e confusione nella pagina. E’ utile ricordare che una volta definita una spaziatura è opportuno mantenerla su tutto il sito per garantire una migliore leggibilità all’utente.
Viste queste premesse ho creato 44 esempi di layout a larghezza fissa da 960px con differente numero di colonne e differenti spaziature. Gli esempi sono visibili su questa pagina.
