Ho bisogno di qualcuno che mi aiuti a chiarire la mia comprensione delle dimensioni dei pixel sui nuovi telefoni con schermi ad alta densità. Dal momento che sta lanciando una palla curva nel mio web design.Web design per Smart Phone - Dimensione pixel
La mia comprensione iniziale degli smartphone era che la dimensione dei pixel era di circa 480 x 320, il che rendeva facile la progettazione, poiché i pixel erano ancora gli stessi pixel.
Tuttavia, alcuni smartphone sono il doppio (o più) di questo. Credo che l'iPhone sia veramente doppio a 960 x 640. Il mio Galaxy Nexus è 1280 x 720.
Ora, questo funziona perfettamente quando si usa% 's. Tuttavia, ci sono molte cose per cui ho voluto usare i valori dei pixel fissi. Ad esempio, molti valori di altezza non devono essere in% s. Inoltre, se l'altezza è fissa, alcuni elementi, come logo, icone, alcune immagini, non voglio essere allungato quando la larghezza si allarga ... quindi questi avranno bisogno di un valore coerente.
Tuttavia, come posso gestirlo quando un pixel non è realmente una misurazione fisica coerente?
È più semplice quando si utilizza un esempio, quindi se qualcuno potrebbe spiegarmelo prendendo, ad esempio le icone come esempio.
Quando accedo a Facebook sul mio telefono, vedo quelle tre icone di notifica nella barra di navigazione (richieste di amicizia, messaggi e altro). Questi sono fissi. Se ho il telefono in posizione verticale o laterale, mantengono la stessa identica dimensione. L'unico che cambia con la larghezza è lo spazio tra ... essenzialmente per cosa sto lavorando.
Quale sarebbe la misura su queste icone? Per uno, so che l'icona standard è di solito 16x16. Quindi, avrebbero bisogno di essere 32x32 su questi smartphone intelligenti ad alta densità? Tuttavia, anche loro non sembrano avere le stesse dimensioni delle mie icone 16x16 che vedo sul mio desktop. Sembrano forse più 12x12. Quindi, non sono sicuro, ma penserei che ci sia una differente dimensione dell'icona "standard" per i telefoni intelligenti, quindi per i desktop (quale sarebbe?).
Ad ogni modo, ho già CSS per identificare che un telefono cellulare viene utilizzato per raggiungere il mio layout mobile. Tuttavia, devo fare un ulteriore passo avanti per riconoscere la densità dei pixel e quindi regolare i miei valori fissi in modo che siano, in questo caso, doppi? O c'è un altro/modo migliore?
Qualsiasi aiuto è apprezzato. Sono un po 'perplesso e non c'è davvero una grande quantità di informazioni su questo là fuori. Grazie e scusa per il lungo post!
Suona come il problema è il rapporto pixel. I display Retina hanno un rapporto di 2: 1 pixel (un pixel sulla retina è lo stesso di 2 su un display normale). Ciò farebbe sembrare la risoluzione come se fosse il doppio di quello che ti aspetti. C'è un sacco di discussioni in corso su questo argomento, e sono sicuro che puoi trovare alcuni articoli con una piccola ricerca. –
Ecco un articolo che potrebbe darti qualche informazione in più (ce ne sono molti là fuori) http://menacingcloud.com/?c=highPixelDensityDisplays –