Quelle est ma résolution d'écran ?

Comment utiliser cet outil

1. Ouvrez la page : toutes les valeurs s’affichent immédiatement, lues par votre navigateur.
2. Redimensionnez la fenêtre, tournez votre téléphone ou votre tablette, ou faites glisser la fenêtre sur un autre écran : les valeurs se mettent à jour en direct.
3. Appuyez sur Copier en texte pour copier toutes les valeurs sous forme de liste, pratique pour un rapport de bug ou une demande d’assistance.

Que signifie chaque valeur ?

Résolution de l’écran (pixels CSS) est la taille de l’écran entier telle que la voient les pages web. Sur un moniteur classique à 100 % de mise à l’échelle, elle correspond à la résolution réelle. Sur un écran haute densité, elle est plus petite : un portable doté d’une dalle 2880 × 1800 à 200 % affiche 1440 × 900.

Pixels physiques (estimation) est la résolution multipliée par le ratio de pixels. C’est en général la définition native de la dalle, et l’outil nomme les plus courantes : Full HD (1080p), QHD (1440p), 4K UHD…

Ratio de pixels (DPR) indique combien de pixels physiques forment un pixel CSS. 1 correspond à un moniteur classique, 1,25 ou 1,5 à un portable Windows avec mise à l’échelle, 2 aux Mac Retina et 3 à de nombreux téléphones. Le zoom du navigateur le modifie aussi.

Viewport (zone de la page) est la partie de la fenêtre où la page s’affiche, sans barres d’outils ni onglets. C’est la taille que visent les intégrateurs avec le responsive design et les media queries.

Écran disponible correspond à l’écran moins les zones système permanentes, comme la barre des tâches de Windows ou la barre de menus et le Dock de macOS. Fenêtre du navigateur donne la taille extérieure de la fenêtre, cadre et barres compris.

Format d’image décrit la forme de l’écran : 16:9, 16:10 ou 21:9 pour un écran ultra-large. Orientation précise paysage ou portrait, avec l’angle de rotation quand le navigateur le fournit.

Profondeur de couleur est le nombre de bits par pixel : 24 bits font 8 bits par canal, 30 bits en font 10. Gamut de couleurs indique l’espace le plus large que le navigateur attribue à l’écran : sRGB, Display P3 ou Rec. 2020. Écran HDR précise si le navigateur signale un affichage à grande plage dynamique. Zoom tactile montre le niveau de zoom obtenu en pinçant l’écran.

Pourquoi les chiffres peuvent surprendre

Une page web ne voit jamais directement le matériel. Le système agrandit tout pour que le texte reste lisible sur les écrans denses : un moniteur 4K réglé à 150 % apparaît au navigateur comme un écran 2560 × 1440. La ligne Pixels physiques (estimation) refait le calcul inverse. Elle est exacte avec le zoom du navigateur à 100 %, mais chaque navigateur gère le zoom à sa façon : remettez-le à 100 % avec Ctrl+0 ou Cmd+0 avant de vous y fier. Sur téléphone, le résultat peut différer de quelques pixels de la fiche technique à cause des arrondis.

Avec plusieurs écrans, les valeurs concernent celui sur lequel se trouve la fenêtre du navigateur.