Layout della pagina web segue uno dei due diversi approcci:
- Layout a larghezza fissa: Si tratta di layout in cui la larghezza dell'intera pagina è impostata con uno specifico valore numerico.
- Layout liquidi: si tratta di layout in cui la larghezza dell'intera pagina è flessibile a seconda della larghezza del browser del visualizzatore.
Ci sono buone ragioni per usare entrambi i metodi di layout, ma senza capire entrambi i relativi vantaggi e carenze di ciascun metodo, non puoi prendere una buona decisione su quale utilizzare per il tuo web pagina.
Layout a larghezza fissa
I layout fissi sono layout che iniziano con una dimensione specifica come stabilito dal web designer. Rimangono di quella larghezza, indipendentemente dalle dimensioni della finestra del browser che visualizza la pagina. I layout a larghezza fissa consentono al designer un controllo più diretto su come apparirà la pagina nella maggior parte delle situazioni. Sono spesso preferiti dai designer con uno sfondo di stampa, in quanto consentono al designer di apportare modifiche minime al layout e di mantenerli coerenti tra browser e computer.
Layout liquidi
I layout liquidi sono layout basati su percentuali della dimensione della finestra del browser corrente. Si flettono con la dimensione della finestra, anche se il visualizzatore corrente cambia le dimensioni del browser mentre sta visualizzando il sito. I layout a larghezza liquida consentono un uso efficiente dello spazio fornito da una determinata finestra del browser o risoluzione dello schermo. Sono spesso preferiti dai designer che hanno molte informazioni per farli passare nel minor spazio possibile possibile, in quanto rimangono coerenti nelle dimensioni e nei relativi pesi di pagina indipendentemente da chi sta visualizzando il pagina.
Cosa c'è in gioco?
Il tuo progettazione del sito web colpisce il tuo reattività e adattabilità del sito. A seconda di quale scegli, la capacità dei tuoi lettori di scansionare il tuo testo, trovare ciò che stanno cercando o talvolta persino utilizzare il tuo sito può essere aiutata o ostacolata. Anche l'identità complessiva del marchio del tuo sito potrebbe essere a rischio, soprattutto se gli standard del tuo marchio seguono un modello logico di prima stampa.
Vantaggi dei layout a larghezza fissa
Un layout a larghezza fissa è utile in alcune circostanze.
- Un layout a larghezza fissa consente al designer di creare pagine che appariranno identiche, indipendentemente da chi le guardi.
- Gli elementi a larghezza fissa come le immagini non prevarranno sul testo su monitor più piccoli perché la larghezza dell'intera pagina includerà tali elementi.
- La lunghezza della scansione non sarà influenzata da ampi segmenti di testo, indipendentemente dalla larghezza del browser.
Vantaggi dei layout liquidi
Un layout liquido funziona meglio in altre circostanze.
- Un layout a larghezza liquida si espande e si contrae per riempire lo spazio disponibile.
- Viene utilizzato tutto lo spazio disponibile, consentendo al progettista di visualizzare più contenuti su monitor più grandi, pur rimanendo possibile su display più piccoli.
- I layout liquidi forniscono coerenza nelle larghezze relative, consentendo a una pagina di rispondere in modo più dinamico alle restrizioni imposte dal cliente come dimensioni dei caratteri più grandi.
Svantaggi dei layout a larghezza fissa
Tuttavia, un formato fisso non è privo di costi.
- I layout a larghezza fissa forzano lo scorrimento orizzontale nelle finestre del browser più piccole. Alla maggior parte delle persone non piace scorrere orizzontalmente.
- Lasciano grandi distese di spazio bianco in monitor più grandi, risultando in molto spazio inutilizzato e più scorrimento verticale di quanto altrimenti sarebbe necessario.
- I layout a larghezza fissa non gestiscono molto bene le modifiche dei clienti alle dimensioni dei caratteri. Per piccoli aumenti nella dimensione del carattere, possono andare bene, ma per aumenti più grandi, il layout può essere compromesso.
Svantaggi dei layout liquidi
Anche i layout liquidi non sono privi di aspetti negativi.
- I layout liquidi consentono un controllo molto poco preciso sulla larghezza dei vari elementi della pagina.
- Possono risultare in colonne di testo troppo larghe per essere scansionate comodamente o su browser più piccoli troppo piccole perché le parole vengano visualizzate chiaramente.
- Errore di layout liquido quando un elemento a larghezza fissa, come un'immagine, viene posizionato all'interno di una colonna liquida. Se la colonna viene visualizzata senza spazio sufficiente per l'immagine, alcuni browser aumenteranno la larghezza della colonna, ignorando le istruzioni del progettista, mentre altri browser impongono sovrapposizioni di testo e immagini per ottenere il corretto percentuali.
Preferenze di layout e approcci misti
Alcuni designer preferiscono fondere questi concetti. A loro non piace usare layout liquidi per grandi blocchi di testo, poiché quella struttura rende il testo illeggibile su un monitor piccolo o non scansionabile su uno grande. Quindi tendono a rendere le colonne principali delle pagine di una larghezza fissa, ma creano intestazioni, piè di pagina e lato colonne più flessibili per occupare il restante immobile e non perdere la capacità di maggiore browser.
Alcuni siti utilizzano script per determinare le dimensioni della finestra del browser e quindi modificare gli elementi di visualizzazione di conseguenza. Ad esempio, se apri un sito di questo tipo in una finestra molto ampia, potresti visualizzare una colonna aggiuntiva di collegamenti sul lato sinistro che i visitatori con monitor più piccoli potrebbero non vedere. Inoltre, l'avvolgimento del testo intorno alla pubblicità dipende dall'ampiezza della finestra del browser. Se è sufficientemente ampio, il sito avvolgerà il testo attorno ad esso, altrimenti visualizzerà il testo dell'articolo sotto l'annuncio. Sebbene la maggior parte dei siti non necessiti di questo livello di complessità, dimostra un modo per sfruttare gli schermi più grandi senza influire sulla visualizzazione su schermi più piccoli.