この記事のポイント
- 画面解像度は1920×1080だった
- ブラウザーがページ描画に使える領域は1280×720だった
- 解像度と表示領域は別の値なのでWeb制作やスクリーンショットでは区別が必要だ
サムネイルはイメージ写真。写真の配布元：Unsplash（利用許諾）。本文の画面は実際の操作時に撮影した。
検証環境：2026年10月6日、Windows、Codex内蔵Chromium 153.0.8010.53。What Is My Screen Resolutionを無料・未ログインで開いた。
検出されたDevice Resolutionは1920×1080、Browser Viewportは1280×720、DPR（Device Pixel Ratio）は1だった。画面全体はフルHDでも、Webページが実際に使える領域はブラウザーのウィンドウサイズやタブ、ツールバーの分だけ狭い。
「フルHDのPCだからWebページも1920px幅で見えている」とは限らない。今回の表示領域は横1280pxで、物理画面の横幅より640px小さかった。
操作手順
- What Is My Screen Resolutionを開く。
- 上部のScreen Resolutionを記録する。
- 下のOther InformationでDevice Resolution、DPR、Browser Viewportを見る。
- ブラウザーの幅を変え、Viewportだけが変わることを確認する。
3つの数字の役割
| 項目 | 今回の値 | 意味 |
|---|---|---|
| Device Resolution | 1920×1080 | ディスプレイ側の画素数 |
| Browser Viewport | 1280×720 | ページを描画できるブラウザー内部の範囲 |
| DPR | 1 | CSS上の1pxに対応する物理画素の比率 |
Webサイトの見え方を確認するときはViewportを使う。写真や壁紙の書き出しサイズを決めるときはDevice Resolutionを見る。高密度ディスプレイではDPRが2などになり、Web上の見かけの幅と画像ファイルに必要な画素数がさらにずれる。
ツールが表示した22.95インチは推定値であり、ブラウザーがモニターの実寸を直接測った結果ではない。実際の対角サイズは製品仕様や実測で確認する必要がある。
コメント