2009-12-19 29 views
10

Sto iniziando un nuovo progetto web e mi chiedo se usare em o px per il layout e le dimensioni dei caratteri.Devo usare em o px?

Nonostante la maggior parte dei browser ora supportino lo zoom di testo e immagine indipendentemente dal fatto che i caratteri siano definiti in px o em, il supporto della comunità per l'utilizzo di em è ancora forte.

Ma ci sono 2 problemi che vedo usando em.

Primo è il problema con i monitor grandi e ampi - spesso questo si traduce in un testo in esecuzione miglia e miglia sullo schermo, che è molto difficile da leggere mentre leggi la pagina.

In secondo luogo, cosa accadrebbe se il sito fosse necessario per integrare un componente Flash? Se vuoi che il componente Flash si adatti esattamente a un div (ad es. Il contenitore principale del sito) definito in em, come faresti a farlo in quanto i componenti Flash vengono misurati in px?

C'è un motivo valido per utilizzare EM su PX, davvero?

+0

possibile duplicato di [Why em invece di px?] (http://stackoverflow.com/questions/609517/why-em-instead-of-px) –

risposta

22

primo è il problema con monitor di grandi dimensioni e ampie - spesso questo si traduce in miglia testo di esercizio e miglia attraverso la schermo, che è molto difficile da leggere come si legge in basso nella pagina.

Utilizzando em o px, si può ancora definire un width (o max-width) per il layout.

In secondo luogo, cosa succede se il tuo sito necessario per integrare un componente Flash? Se si desidera che il componente Flash si adatti a all'interno del div (ad es. Il contenitore principale del sito) definito in em, come si fa a procedere dal i componenti Flash vengono misurati in px?

Per adattarsi esattamente, è ancora possibile utilizzare 100% width, o forse non ho capito il tuo punto.


In teoria, utilizzando em invece di px permetterà il layout di essere facilmente considerevole base alle preferenze dell'utente.

Ma oggi i browser moderni possono ridimensionare i layout px e anche i formati em in modo che non siano rilevanti come alcuni anni fa.

+1

Buona risposta, non penso di poterlo spiegare meglio io stesso. –

+1

eliminato le cose :-) grazie – helloworlder

+0

Per quanto riguarda le dimensioni del componente Flash, probabilmente si stava riferendo alle dimensioni del contenitore che lo avrebbe trattenuto, in quanto alcuni elementi Flash potrebbero non adattarsi bene. – JGarrido

2

Quando si utilizzano caratteri di dimensioni relativamente anziché fissi, il vantaggio principale è che un visitatore (disabilitato otticamente) può ingrandire/ridurre la pagina Web, inclusi i caratteri. Si tratta di web accessibility.

+3

Questo non è un gran problema oggigiorno. Tutti i principali browser in questi giorni, incluso Internet Explorer, ingrandiranno l'intera pagina, inclusi i caratteri. – Turnor

+5

Ma questo non è più il caso per la maggior parte dei browser. Non sono sicuro se valga la pena di soddisfare gli altri utenti di IE6. – helloworlder

+0

Ho sempre ferito quale tipo di zoom sarebbe, se lo zoom utilizzando cmd + mousewheel_up su lati basati su px, si adatta perfettamente alla perfezione. in firefox – antpaw

2

px ha lo stesso problema di quello che si cita con diverse dimensioni del monitor. Con px c'è anche una maggiore tendenza a pensare in termini di pixel quando vengono ridimensionati sul monitor (ovvero, i pixel hanno una certa altezza dei punti). Poiché ems (e%) non hanno una relazione di dimensioni fisse per i display, le persone non cadono nella stessa trappola. (px, come tutti i pixel dell'immagine, in realtà non ha una relazione 1: 1 fissa per visualizzare i pixel, ma la gente di solito li pensa in quel modo.

Quando si tratta di allineare gli elementi sostituiti, Flash o immagini, px sono effettivamente più appropriati (anche se Flash, quando si utilizza la grafica puramente vettoriale, si ridimensionerà piacevolmente a qualsiasi dimensione utilizzando qualsiasi unità che si desidera). Personalmente, uso qualsiasi unità sia più naturale per il tipo di elemento che determina il posizionamento e il dimensionamento: px per le immagini & filmati, em per il testo,% per la vista.

1

Ora che le moderne del desktop browser scala px e em lo stesso, credo che la discussione dovrebbe spostarsi come l'utilizzo di uno o l'altro verranno visualizzati su dispositivi mobili come iPad, iPhone, ecc

+0

I pixel sono relativi al dispositivo. Sulla maggior parte dei browser desktop, è 1: 1. Su alcuni dispositivi mobili 1.5: 1. – webinista