it-swarm-eu.dev

Interfaccia utente indipendente DPI per pagine Web

Per quasi un decennio, prima di LCD divenne la norma, gli schermi erano a 72 o 96 DPI (di solito si trovano solo sui display Trinitron). Tuttavia, ora i display a 120 e 144 DPI sono abbastanza comuni.

Con l'avvento di Windows 7, i problemi DPI sono più o meno risolti in una certa misura per le app desktop e almeno l'interfaccia utente delle cose del sistema operativo non viene mai interrotta su un display DPI elevato.

Ora veniamo alle pagine Web - ho avuto un grande argomento con un amico sulla creazione di una pagina Web indipendente DPI - La mia opinione era che gli elementi dell'interfaccia utente dovrebbero avere le stesse dimensioni su vari sistemi e che ogni dimensione CSS dovrebbe essere specificata in pollici anziché pixel .

Ho sollevato questo argomento su SO e c'è stata una disapprovazione generale sull'uso dei pollici come unità, che trovo piuttosto -uh- poco ragionevole.

Ho uno schermo a 144 DPI di soli 15,4 pollici - La dimensione dei singoli pixel è così piccola che l'antialiasing del testo e il rendering dei sottopixel sono davvero efficaci, ma vedo molte pagine Web che presuppongono che un carattere a 8 punti sia abbastanza grande da leggere su qualsiasi sistema.

Credo che questo sia un enorme fastidio e un difetto fondamentale nella progettazione dell'interfaccia utente ... Fare ipotesi sull'ambiente degli utenti quando puoi effettivamente adattarti a quello esistente.

Non è molto diverso dalle prime pagine Web degli anni 2000 che non venivano visualizzate correttamente su 1280x1024 poiché erano progettate per 1024x768

Un'altra ironia è che solo Firefox esegue il rendering di un elemento da 1 pollice come 1 pollice fisico - tutti gli altri browser sono disattivati ​​a meno che il DPI dello schermo non sia 96 Ovviamente da qualche parte nel codice c'è il valore 96 hardcoded - Quanto è difficile sostituirlo con un GetScreenDPI ( ) o qualunque chiamata API?

Quali sono le tue opinioni?

6
rep_movsd

I pixel sono un concetto a livello hardware e poiché più pixel vengono stipati in meno spazio, i progettisti dovranno imparare a utilizzare un'unità di misura diversa. Se progetto un pulsante da 100 × 200 pixel, poiché suppongo che uno schermo da 100 dpi, un utente su uno schermo da 200 dpi subirà poiché il pulsante avrà ¼ di area.

Poiché più dispositivi vengono forniti con schermi ad alta densità di pixel, i progettisti avranno effettivamente un maggiore controllo (e flessibilità) se conoscono gli aspetti tecnici dei sistemi per i quali stanno progettando.

Ad esempio, specificare layout Web in punti è più a prova di futuro poiché si specifica la dimensione fisica (escludendo i bug di implementazione citati).

Come altro esempio, le coordinate dello schermo nei dispositivi iOS sono misurate in punti e per i dispositivi più vecchi senza il nuovo schermo ad alta densità, c'era una mappatura uno-a-uno di punti in pixel. L'iPhone 4 raddoppia il numero di pixel ma mantiene uguali le dimensioni in punti dello schermo (quindi i vecchi layout funzioneranno ancora, ma i nuovi layout possono usare dimensioni frazionarie per una maggiore precisione della posizione).

5
Brendan Berg

Penso che sia meglio usare la percentuale per la progettazione dell'interfaccia utente. Quindi puoi inserire valori assoluti nel tag body. Modifica i valori assoluti del corpo ovunque richiesti utilizzando JavaScript. allora avrai tutto il resto OK.

Per la parte JavaScript, provare a riconoscere la visualizzazione dell'utente e calcolare i valori. è facile.

1
Morteza Milani

Perché usare i pollici quando sia la grafica che le dimensioni dello schermo sono misurate in pixel? Diverse risoluzioni visualizzano numeri diversi di pixel per pollice, quindi se misurassimo in pollici per margini, riempimento, dimensioni dei caratteri (meglio usare px o em che pt), ecc. Sarebbe più difficile capire quanto siano grandi le nostre immagini (che sono fatto pixel per pixel) sarebbe sulla pagina. Per non parlare del fatto che la risoluzione 800x600 è sempre 800px x 600px a prescindere di quanti pollici è lo schermo.

Parte di diventare un professionista (o guru) di sviluppo/progettazione web è imparare a costruire in modo efficace il tuo sito in modo che il maggior numero possibile di utenti possa accedervi. E le tecniche necessarie per farlo stanno diventando ampiamente diffuse e accettate. Il punto è che, se lo sviluppatore sta facendo un lavoro lì, non dovrebbe essere un problema. E questo è uno dei motivi per cui questo sito esiste.

1
LoganGoesPlaces

consistenza unitaria; pollici reali. (72 punti fanno un pollice)

Carattere a 8 punti, adoro la liberazione mono a 8 pt, ma è solo perché sembra una griglia così bella adattata a dimensioni così piccole - per me alcuni caratteri sembrano semplicemente strani quando vedi i loro dettagli ma sembrano ben adattati alla griglia

1280x1024 (5: 4) e 1024x768 (4: 3); potresti ridimensionare bene dal più piccolo al più grande ma dovresti ruotare lo schermo più grande e se questi schermi avessero le stesse dimensioni, un layout in pollici funzionerebbe invariato ma ci sono ancora due problemi: uno che stabilisce il testo per uno schermo di dimensione sconosciuta e ottenere la dimensione del carattere corretta

puoi rendere una pagina invariante rispetto alla risoluzione del tuo schermo ma non puoi renderla invariante rispetto alle dimensioni e alla forma dello schermo

ho modificato mupdf (un visualizzatore di pdf) alle dimensioni predefinite come in x11 il server fornisce le dimensioni reali dello schermo e la sua risoluzione segnalata per il mio schermo da xdpyinfo come:

dimensions:    1280x800 pixels (301x192 millimeters)
resolution:    108x106 dots per inch

(anche se se si desidera le dimensioni dell'area di lavoro, è necessario leggere una proprietà definita dai suggerimenti di Window Manager esteso: _NET_WORKAREA(CARDINAL) = 0, 25, 1280, 744)

ma ho scoperto che lo schermo era troppo corto e ciò significava che dovevi scorrere le pagine pdf - mi piace piuttosto il paging ma non si dovrebbe mai mescolare paginazione e scorrimento

e poi ho continuato a pensare a ottenere uno schermo che non fosse più corto di una pagina di lettere come una modalità ritratto 21,5 pollici lcd (ma è difficile trovare un lcd di quelle dimensioni nell'intervallo 108+ dpi per non più di 250 noi)

1
Dan D.