Qual È la Mia Risoluzione dello Schermo?
Scopri all'istante la risoluzione dello schermo, la dimensione della finestra del browser, la densità di pixel, la profondità di colore e il supporto touch — con copia in un clic.
1.060 visualizzazioni
Ridimensiona la finestra — i valori del viewport si aggiornano in tempo reale.
Cosa Misura Davvero il "Rapporto Pixel del Dispositivo"
Ogni display ha una griglia fissa di pixel fisici — la sua risoluzione nativa — ma le pagine web vengono impaginate in pixel CSS, un'unità indipendente dalla risoluzione. Il rapporto pixel del dispositivo (DPR, device pixel ratio) è il fattore di conversione tra i due: quanti pixel fisici servono per disegnare un singolo pixel CSS. Su uno schermo a densità standard, il DPR è 1 e i due corrispondono uno a uno. Su uno schermo "Retina" o ad alto DPI, il DPR è tipicamente 2 o 3, il che significa che un pixel CSS viene in realtà renderizzato su un blocco 2×2 (4 pixel fisici) o 3×3 (9 pixel fisici). Ecco perché testo e icone appaiono notevolmente più nitidi su questi schermi: il sistema operativo e il browser dispongono di quattro o nove volte più punti fisici per disegnare lo stesso pixel logico, quindi curve e bordi non devono essere approssimati in modo così grossolano.
Questa pagina legge quel numero, insieme a tutto il resto mostrato nella scheda qui sopra, direttamente dalle vere API del browser: window.screen riporta larghezza, altezza e profondità di colore native del display, mentre window.devicePixelRatio riporta il rapporto tra pixel CSS e pixel fisici. Le misurazioni del viewport del browser provengono da window.innerWidth/innerHeight, motivo per cui quel numero è più piccolo della risoluzione dello schermo — esclude lo spazio occupato da schede, barra degli indirizzi e bordi della finestra. Ridimensiona la finestra e questi valori si aggiornano dal vivo, perché vengono letti direttamente dal browser, non da una cache.
Dove Torna Utile Questa Informazione
Gli usi tipici includono descrivere la tua configurazione esatta al supporto tecnico senza indovinare i numeri, verificare con quali dimensioni in pixel un design responsive dovrà davvero fare i conti sul tuo dispositivo, confermare che un monitor appena collegato abbia negoziato la sua risoluzione nativa invece di una modalità di fallback inferiore, oppure verificare che una TV collegata come secondo display abbia ricevuto il segnale corretto. Il pulsante di copia in un clic recupera un riepilogo testuale pulito di ogni valore, pronto da incollare direttamente in un ticket di supporto o in una segnalazione di bug.
La profondità di colore, mostrata anch'essa nella scheda, funziona con un principio per-canale simile a quello del rapporto pixel: un display tipico a 24 bit assegna 8 bit ciascuno a rosso, verde e blu, offrendo circa 16,7 milioni di colori possibili per pixel, mentre alcuni display professionali e HDR riportano una profondità di 30 o 36 bit per sfumature più fini. Orientamento (verticale o orizzontale) e supporto touch completano il quadro, entrambi letti dal vivo dalle stesse interfacce window.screen e navigator invece di essere dedotti dalle dimensioni dello schermo o dal rilevamento dello user-agent.
Domande Frequenti
Perché il viewport del mio browser è più piccolo della risoluzione del mio schermo?
Il viewport è solo l'area di disegno interna del browser — schede, barra degli indirizzi, barra dei preferiti e cornice della finestra prendono ciascuna la propria parte dello schermo. Passare a schermo intero elimina gran parte di questo sovraccarico, avvicinando il più possibile i due numeri.
Cosa significa in pratica il rapporto pixel del dispositivo?
È il numero di pixel fisici che rappresentano un pixel CSS. Un rapporto di 2 significa che una pagina larga "1000 px" in CSS viene in realtà disegnata usando 2000 pixel fisici — questo sovracampionamento è ciò che rende testo e icone nitidi sui display di classe Retina.
Perché la risoluzione riportata non corrisponde alla scheda tecnica del mio monitor?
A causa del ridimensionamento del display del sistema operativo. Al 150% di scala, ad esempio, un pannello fisico largo 2880 pixel riporta 1920 pixel logici alle pagine web. Il pannello continua a usare ogni pixel fisico che possiede — il sistema operativo si limita a disegnare tutto più grande per mantenere il testo leggibile.
window.screen e window.devicePixelRatio sono affidabili su tutti i browser?
Sì — sono API del browser standard e supportate da tempo, anche se window.screen riflette l'intero display fisico mentre i valori del viewport riflettono solo la finestra corrente del browser, quindi il fatto che i due numeri rispondano a domande diverse è previsto, non un bug.
Questo strumento può rilevare se il mio schermo supporta l'input touch?
Sì — verifica la capacità di input touch tramite il supporto agli eventi pointer e touch del browser, ed è così che la scheda può indicare se il tuo display attuale è touch insieme alla sua risoluzione e profondità di colore.
Strumenti Simili
Segnala un Problema
Qual È la Mia Risoluzione dello Schermo?
Commenti
Ancora nessun commento — scrivi il primo!