Schermresolutie controleren

Zo gebruik je deze tool

1. Open de pagina: alle waarden worden meteen getoond, rechtstreeks uit je browser gelezen.
2. Maak het venster groter of kleiner, draai je telefoon of tablet, of sleep het venster naar een andere monitor. De waarden worden live bijgewerkt.
3. Klik op Kopiëren als tekst om alle waarden als platte lijst te kopiëren, handig voor een bugmelding of een supportvraag.

Wat elke waarde betekent

Schermresolutie (CSS-pixels) is de grootte van je hele scherm zoals webpagina’s het zien. Op een gewone monitor met 100% schaling komt die overeen met de echte resolutie van de monitor. Op schermen met een hoge pixeldichtheid is ze kleiner: een laptop met een paneel van 2880 × 1800 bij 200% schaling meldt 1440 × 900.

Fysieke pixels (schatting) is de schermresolutie vermenigvuldigd met de device pixel ratio. Meestal is dat de native resolutie van het paneel, en de tool noemt de gangbare resoluties bij naam, zoals Full HD (1080p), QHD (1440p) of 4K UHD.

Device pixel ratio is het aantal fysieke pixels waaruit één CSS-pixel bestaat. Een waarde van 1 is een klassieke monitor, 1,25 of 1,5 is gebruikelijk op Windows-laptops met beeldschaling, 2 is typisch voor Retina-Macs en 3 voor veel telefoons. Ook de browserzoom verandert de waarde.

Viewport (paginagebied) is het deel van het venster waarin de pagina getekend wordt, zonder werkbalken en tabbladen. Dat is de maat waar webdesigners op mikken met responsive layouts en media queries.

Beschikbaar scherm is het scherm min vaste systeemonderdelen, zoals de taakbalk van Windows of de menubalk en het Dock van macOS. Browservenster is de buitenmaat van het venster, inclusief rand en werkbalken.

Beeldverhouding is de vorm van het scherm, zoals 16:9, 16:10 of 21:9 ultrawide. Oriëntatie vertelt of het scherm liggend of staand is, met de draaihoek als de browser die doorgeeft.

Kleurdiepte is het aantal bits per pixel: 24 bits betekent 8 bits per kanaal, en 30 bits betekent 10 bits per kanaal. Kleurbereik toont het breedste bereik dat het scherm volgens de browser dekt: sRGB, Display P3 of Rec. 2020. HDR-scherm vertelt of de browser een scherm met hoog dynamisch bereik meldt. Knijpzoom toont het zoomniveau als je op een aanraakscherm met twee vingers inzoomt.

Waarom de cijfers je kunnen verrassen

Webpagina’s zien de echte hardware nooit rechtstreeks. Besturingssystemen schalen alles zodat tekst leesbaar blijft op schermen met een hoge dichtheid, dus een 4K-monitor met 150% schaling lijkt voor de browser een scherm van 2560 × 1440. De regel Fysieke pixels (schatting) draait die berekening om. Bij 100% browserzoom klopt hij precies, maar browsers gaan verschillend met zoom om, dus zet de zoom terug met Ctrl+0 of Cmd+0 voordat je erop vertrouwt. Op telefoons kan het resultaat door afronding een paar pixels afwijken van de opgegeven resolutie.

Gebruik je meerdere monitoren, dan beschrijven de waarden de monitor waarop het browservenster op dat moment staat.