In un layout fisso, il contenitore principale ha la larghezza dimensionata in pixels. Un layout fisso è generalmente studiato per una dimensione standard
e vi sono due principali larghezze utilizzate per questo tipo di layout, a seconda delle due più diffuse risoluzioni del monitor:
- 800x600 pixels
- 1024x768 pixels
Generalmente è uso lasciare circa 40-50 pixels come margine di tolleranza,
quindi, le due dimensioni utilizzate sono all' incirca 760 pixels oppure
960 pixels. Sulla scelta della larghezza da utilizzare, c'è da dire che
un layout pensato per una determinata risoluzione risulta decisamente poco
professionale se visualizzato con una risoluzione minore.
Provate a visualizzare a risoluzione 800x600 un qualsiasi sito che riporta
la dicitura "Sito ottimizzato per una risoluzione di 1024x768": la pagina
per essere consultata necessiterà di uno scrolling orizzontale, che personalmente
ritengo molto fastidioso.
A questo punto la soluzione migliore, se proprio si deve pensare ad un layout
fisso, è impostare la larghezza del contenitore principale a 760 pixels o meno.
Ecco come ottenere un contenitore centrato e largo 760 pixels:
body{
text-align: center; /*centra in IE 5.x */
}
div#container{
width: 760px;
margin: 0px auto; /*centra negli altri browsers*/
text-align: left; /*ripristina l' allineamento*/
}
Seppure, con il passare del tempo si stia procedendo ad un progressivo aumento
delle risoluzioni dei monitor, un sito quale A
List Apart, uno tra i più autorevoli a livello internazionale in materia di
webdesign, ha adottatto un layout fisso a larghezza 600 pixels.
Posso solo ipotizzare i due motivi che abbiano spinto Jeffrey
Zeldman, fondatore del sito e co-fondatore del Web
Standard Project a una scelta del genere:
- è adatto a qualsiasi risoluzione del monitor dell'utente, anche a 640x480
pixels; - consente una maggiore leggibilità: è provato infatti che, sia sul web che
sulla carta, leggere linee lunghe è più faticoso.
Ma torneremo ampiamente su questi aspetti in altri punti della guida.