画面設計におけるGUIの選択肢が最近は豊富になってきています。
お客様のところに高い解像度のディスプレイがあれば、その画面領域を最大限に活かしたGUIを設計したいと考えますが、お客様内で担当者毎に異なる解像度のディスプレイを使っている場合には、最も低い解像度でも支障なく使えるように考慮する必要があります。
システム開発を依頼する際、社内で使っている画面解像度についてお客様内で事前に整理していただくと、より良い設計をすることができます。

 2021年05月20日 公開  2021年07月14日 更新

2種類の「解像度」

パソコン用語としての「解像度」には、大きく2つの意味があります。
1つはプリンタの解像度、もう一つは画面解像度です。

解像度本来の意味は、「画像の細かさ」を表すようですが、プリンタの解像度・画面解像度はそれぞれ異なる意味を持ち、同じ「解像度」と呼ばれているため注意が必要です。

プリンタの解像度 画面解像度

(1) プリンタの解像度
単位はdpi（ドット・パー・インチ）で、1インチにどれだけ点（インク粒）を打てるかを示す値です。

(2) 画面解像度
画面上に出力できる点（ピクセル）の数を縦×横で示します。
ディスプレイの能力（及びビデオカードの能力）によって最大の解像度が決まりますが、ソフトウェアの設定で解像度を下げることもできます。
解像度を上げれば細やかな表現ができますが、画面のパーツが全て小さく表示されるため、解像度を下げて使っている人も多いです。

本記事では、画面解像度について詳しく解説します。

最も多く使われている1920×1080


StatCounterによると、本記事執筆時点（2021年5月）時点で最も多く使われている解像度は1920×1080で、4人に1人が使っています。

フルHDと4K、そしてディスプレイのサイズ（インチ）

フルHDは画面解像度1,920×1,080を表し、4Kは画面解像度3,840×2,160を表します（4K≒4,000の意味。フルHDは2Kとも呼ばれる）。

ディスプレイのサイズは対角線の長さをインチで表したものです。
画面解像度が同じなら、ディスプレイサイズの大きい方が、より見た目が粗くなります。

縦横比

画面解像度によって縦横比が異なるため、注意が必要です。

以下に、主な画面解像度と縦横比を示します。

画面解像度 縦横比 横÷縦 備考
3,840×2,160 16×9 1.78 4K
2,560×1,440 16×9 1.78
1,920×1,080 16×9 1.78 フルHD
1,536×864 16×9 1.78
1,440×900 16×10 1.6
1,366×768 16×9 1.78
1,280×1,024 5×4 1.25
1,280×800 16×10 1.6
1,280×720 16×9 1.78
1,024×768 4×3 1.33

ソフトウェアの「拡大縮小」

Windows10の「拡大縮小」 ブラウザ（Chrome）の「ズーム」

画面解像度に加え、拡大率の設定も画面設計に影響します。
ノートPCのように小さいモニタを事務処理用途で使う場合には、拡大して使っている方も多いでしょう。
たとえば、フルHDの解像度を拡大率125%で利用した場合、画面で表現できる内容は1,536×819相当になります。

システム設計における解像度

システム設計（画面設計）においては、あらゆる解像度に対応するためにスクロールを用いるケースが多いです。

スクロールは、画面全体に設定することも、画面のパーツに対して個別に設定することもできます。

スクロールを用いる場合、画面解像度の高さよりも縦に長い画面を表示する場合には縦スクロールを、画面解像度の幅よりも横に長い画面を表示する場合には横スクロールを、それぞれユーザに操作させる必要があります。

スクロールは画面解像度に依存せずに多くの情報を表現できる反面、ユーザ操作が増えるため、その画面の用途をなるべく具体的に想定した上で適用することが望ましいです。

左の図は、画面をいくつかのエリアに分けて、各エリアの表示方法をボタンで切り替えられるようにした設計例です。

縦長いモニタと横長いモニタが社内で混在していても、それぞれの画面領域を有効活用できます。

また、品目が多い、工程が多いなどデータの特性に応じて見やすい表示方法を選択することができます。

このように、画面解像度は画面設計に影響を及ぼします。
システム開発を依頼する際に画面解像度のパターンを事前に提示いただけると、設計の選択肢が増えて使い勝手の良いシステムが出来上がります。
例えば、以下のような表があると良いでしょう。

部門 利用者名 解像度 倍率 解像度（サブ機） 倍率
営業 担当者A 1920 x 1080 100%
生産管理 担当者B 1920 x 1080 100% 1920 x 1080 100%
事務 担当者C 1600 x 900 125%
経理 担当者D 2560 x 1440 150%