Domanda

Supponendo che un layout fluido non sia un'opzione (poiché si tratta di una discussione diversa tutti insieme), qual è la larghezza consigliata per un layout del sito? Quali sono i pro e i contro di diverse dimensioni?

È stato utile?

Soluzione

Sono sempre rimasto con 960px poiché è visualizzabile su 1024x768 ed è chiaramente divisibile per 2, 3, 4, 5, 6, 8, 10, 12 , 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 e 480 ... così posso dividere il design del mio sito ( usando la regola dei terzi) in modo pulito.

MODIFICA dopo alcuni anni: Prendi in considerazione l'utilizzo di Query multimediali CSS per rendere i tuoi contenuti rispondenti alla miriade di dispositivi disponibili ora se non puoi usare un layout fluido. Non sono sicuro che si possa rivendicare una larghezza di pixel per dominarli tutti nel 2012.

Altri suggerimenti

Scopri http://browsersize.com per alcune statistiche rapide sulle risoluzioni dello schermo che gli utenti usano al giorno d'oggi. Puoi utilizzare http://setmy.browsersize.com per ridimensionare rapidamente il tuo browser per emulare la visualizzazione del tuo sito web in risoluzione dello schermo particolare. Assicurati che il layout soddisfi almeno la risoluzione dello schermo più utilizzata (1024 x 768).

Inoltre, non mirare necessariamente a occupare il massimo spazio orizzontale. La larghezza del testo (numero di parole per riga) idealmente non dovrebbe superare una certa soglia di usabilità:

  

Nella schermata 1024 × 768 molto comune   risoluzione, la maggior parte dei siti Web a layout fisso   non utilizzare tutto lo spazio disponibile per il   sinistra e destra del loro contenuto.   I layout flessibili ne fanno un uso migliore   spazio orizzontale, ma fatica   mantenere lunghezze utilizzabili.   Gli esperti dell'usabilità ci hanno detto questo   ci sono così tante parole tu   dovrebbe mettere su una linea. Tra 8 e 12   le parole sembrano essere la linea ideale   lunghezza. Supporti di stampa, in particolare   giornali, non esitate a usare anche   linee più brevi. Perché? Perché possono   disponendo il testo in diversi   colonne.

http://www.alistapart.com/articles/css3multicolumn

Se usi una larghezza fissa che è più ampia dello schermo più piccolo probabile per visitare il tuo sito, infastidirai e frustrerai gli utenti che devono scorrere lateralmente per arrivare al resto dei tuoi contenuti.

Uso anche un layout tra 950 e 980px e sempre centrato a meno che il cliente non richieda diversamente :)

  1. Tieni presente che la risoluzione del monitor spesso citata nelle statistiche non è necessariamente la stessa cosa di larghezza interna della finestra del browser . Gli utenti possono avere barre laterali / barre degli strumenti aggiuntive, utilizzare una finestra del browser non ingrandita. Più grande è lo schermo, meno è probabile che tu voglia utilizzarlo tutto per una sola pagina.

  2. Le righe di testo molto lunghe sono più difficili da leggere. L'ottimale è di 25-30 em (dipende da molti fattori, ma non dovresti semplicemente andare al massimo).

  3. I browser mobili hanno " virtual " risoluzione dello schermo che usano per lo zoom ed è ~ 960 px in Opera Mini / Mobile e Mobile Safari.

Voto per dividere la mozione qui. Solo perché le dimensioni dello schermo sono X non significa che X o qualsiasi cosa sia vicina sia il miglior design per il tuo sito Web.

Lo scopo del tuo sito Web ha molto a che fare con la larghezza che scegli.

Molti esperti di marketing pensano che una colonna più ristretta "converta" più visite nelle vendite. Forse è perché è più facile indirizzare l'attenzione della gente se la pagina è stretta.

D'altra parte, un sito dedicato alle immagini dovrebbe mostrare la migliore risoluzione disponibile per ciascun browser in visita.

Un tempo era 800px ; tuttavia, sempre più siti stanno iniziando a utilizzare 1000px . Ciò è guidato dal fatto che, il più delle volte, le risoluzioni di fascia bassa dei visitatori sono 1024x768 . Gli ulteriori 24 pixel lasciano spazio al browser chrome, padding e margini che potresti voler manipolare, ecc.

Solo per dare una prospettiva, anche la nuova ondata di netbook con il loro piccolo schermo ha risoluzioni di 1024x768 .

Ma, soprattutto, conosci il tuo pubblico come suggerisce @warren e capitalizzalo.

Potresti provare a sviluppare più layout e utilizzare Javascript per passare da uno all'altro in base alla finestra del visitatore.innerWidth

Detto questo, di solito uso qualcosa tra 950px e 980px.

La larghezza massima del sito Web per prestazioni ottimali e compatibilità con più monitor è 960 px quando è correlata a desktop e laptop.

Per maggiori dettagli su come e perché consultare il seguente articolo:

Dimensioni e risoluzione dello schermo

In base alle queste statistiche, una larghezza minima di 1024 pixel coprirà la maggior parte degli utenti .

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top