Fluido, fisse e Elastic Web Design, Explained

Quando si utilizzano i CSS per lo stile di un sito web ci sono tre tipi di layout principale a disposizione di web designer. Questo tutorial mira a braccio con le informazioni di cui avete bisogno per contribuire a rendere una decisione più informata al momento di scegliere il modo di progettare i vostri progetti web.

Opzioni

I tre stili di layout principale per stabilire la larghezza di siti web - Fluid, fisso ed elastica. Tutti hanno i loro meriti. Ci sono anche degli inconvenienti di questi modelli di progettazione, quindi è importante conoscere la situazione migliore in cui usare ogni tipo di layout.

Fluid Layout

Indicato anche come un layout liquido, l'attrazione popolare a questo tipo di layout è il pieno utilizzo del bene immobile dello schermo in modo da poter ottenere un sacco di contenuti sulla tua pagina web. Il layout liquido consente ai progettisti di non specificare una larghezza wrapper. Invece il contenuto del tuo sito web è determinato dalla larghezza di visualizzazione del browser dell'utente, il che significa che non dovete preoccuparvi di dimensionamento minimo e massimo delle informazioni. Siti che utilizzano un design fluido layout includono Amazon e Play.

Il layout liquido può causare problemi per i browser come Internet Explorer che non supporta le proprietà si potrebbe desiderare di utilizzare per impostare la larghezza massima di contenuto. Questo insieme al fatto che le pagine web con contenuti di riempimento può essere cattivo dal punto di vista dell'usabilità mette spesso la gente fuori che adotta il formato di layout.

Layout fisso

Come suggerisce il nome fisso layout fermare il browser Web da avere la libertà di formattare il testo come meglio crede, questa è una delle tecniche più popolari sul web, con siti come Facebook e la BBC l'applicazione del design. Ciò significa che la larghezza il contenuto è contenuta e soggiorni fissi, non importa cosa, questa è tipicamente realizzato con qualcosa chiamato un involucro o contenitore, che detiene tutti i contenuti all'interno di esso. Il design a larghezza fissa può essere impostato a sinistra, centro o destra della pagina uno, molto facilmente.

Il bonus reale di lavorare con un design a larghezza fissa è che è possibile impostare le immagini e il design intorno alla considerazione che la larghezza sarà sempre la stessa. Questo è un vero e positivo se si desidera una immagine banner, per esempio, che deve essere 900px, non avrete problemi durante il ridimensionamento, problemi che si incontrano con un design fluido.

L'aspetto negativo di un disegno fissa è invece lo spazio morti che si sono lasciati con cui il progetto non riempire la pagina. Un design larghezza fissa anche possibile imporre ai progettisti di priorità. Come un sito cresce e contenuti compete per il miglior posizionamento, deve ancora rientrare in una larghezza specifica.

Layout elastico

Lo stile di progettazione definitiva è noto come elastica. Spesso confuso con layout fluido, layout elastici consentono un sito web per proporzionalmente adattarle allo schermo è visualizzato su. Ciò può essere ottenuto utilizzando EMS o%. Quando un utente si espande le dimensioni del testo del loro browser web il resto della pagina web si espanderà anche perché le misurazioni sono basati su variabili rispetto a impostare le dimensioni. Hotmail ha recentemente sviluppato il proprio sito l'utilizzo di un design elastico. Se si guarda alla dimensione dei caratteri, si noterà che sono fissati in percentuale per sfruttare al massimo la configurazione degli utenti.

Dei tre stili di design questo è il meno popolare perché è il meno vantaggioso per l'esperienza degli utenti. La sua natura variabile può rendere problematico per l'esperienza degli utenti. In combinazione con una mancanza di supporto dei browser su piattaforme come IE6, questo rende il design impopolare con i progettisti che vogliono dirigere chiaramente dei problemi di incompatibilità del browser.

Roundup

Ci sono punti di forza e di debolezza di tutti i design pattern che ho citato. Da soppesare i pro ei contro si può prendere una decisione prima di imbarcarsi sul vostro prossimo progetto web. Saprete i problemi e le soluzioni ai problemi prima di incontrarli.