初代編集長ブログ―安田英久

ワイドディスプレイの普及でWebの文字が大きくなる?

ノートパソコンでは、想定しているよりもかなり小さい文字で表示されている可能性が高いのです。
Web担のなかの人

今日は、ワイドディスプレイの普及とディスプレイの高精細化が進んでいることを考慮して、改めてWebサイトに適切な文字サイズを考えてみましょう。

あなたのサイトでは、本文の基本文字サイズを何ピクセルにしていますか? その文字サイズは、訪問者にとって見やすいサイズですか?

二昔前は、小さな文字のオシャレなページが流行っていましたが、ここ数年は「見やすい文字サイズ」を選ぶようになっていますね。ヤフーやアサヒコムなどの代表的なサイトでは、本文16ピクセルを基本としているようです。

実はこの「ピクセル」というサイズ指定は、絶対サイズではありません。というのも、どんなディスプレイでどう表示されるかによって、実際の表示サイズが変わるからです。

ちなみに、16ピクセルの文字は、XGA(1024×768ピクセル)の15インチ液晶では4.8mmの大きさになります。手元にあった新聞の本文文字サイズを測ってみると14Q(3.5mm)でしたから、約1.37倍。紙とディスプレイの視認性の違いを考えても、少し大きめといったところでしょうか。

さて、最近の売れ筋のノートパソコンやディスプレイを調べてみると、画面サイズは、ディスプレイで17インチから27インチほど、ノートパソコンで10インチ~16インチほど。解像度は1280×1024から1920×1200と幅広くありました。最近は、DVDやテレビをパソコンで視る人も多いからか、ディスプレイのワイド化が進んでおり、さらに解像度も高くなってきているようです。

そこで、さまざまなディスプレイで、

  • 16pxの文字が実寸でどれくらいの大きさで表示されるのか
  • 文字サイズ4.2mm(紙の14Qの1.2倍サイズ)で表示されるピクセルサイズ

を調べてみました。

色つきの行は、16px=4.2mmよりも2割以上小さくなるデバイス
※ドットピッチとは画面の1ピクセルの間隔を示します
液晶サイズ
(インチ)
解像度ドットピッチ
(mm)
16pxは
何mm?
4.2mmは
何px?
■ノートパソコン
16.4"1600×9000.23 mm3.6 mm18.5 px
15.4"1920×12000.17 mm2.8 mm24.3 px
15.4"1280×8000.26 mm4.1 mm16.2 px
14.1"1440×9000.21 mm3.4 mm19.9 px
13.3"1440×9000.20 mm3.2 mm21.1 px
12.1"1440×9000.18 mm2.9 mm23.2 px
12.1"1280×8000.20 mm3.3 mm20.6 px
12.1"1024×7680.24 mm3.8 mm17.5 px
10.4"1024×7680.21 mm3.3 mm20.4 px
10.2"1024×7680.20 mm3.2 mm20.8 px
■ネットブック
10.2"1024×6000.22 mm3.5 mm19.2 px
10.1"1024×5760.22 mm3.5 mm19.2 px
10"1024×6000.21 mm3.4 mm19.6 px
8.9"1024×6000.19 mm3.0 mm22.1 px
■ディスプレイ
30"2560×16000.25 mm4.0 mm16.6 px
27"1920×12000.30 mm4.8 mm13.9 px
24"1920×12000.27 mm4.3 mm15.6 px
24"1920×10800.28 mm4.4 mm15.2 px
22"1680×10500.28 mm4.5 mm14.9 px
21.5"1920×10800.25 mm4.0 mm16.9 px
21.3"1600×12000.27 mm4.3 mm15.5 px
20"1680×10500.26 mm4.1 mm16.4 px
19"1440×9000.28 mm4.5 mm14.8 px
19"1280×10240.29 mm4.7 mm14.3 px
17"1280×10240.26 mm4.2 mm15.9 px
15"1024×7680.30 mm4.8 mm14.1 px
14"1024×7680.28 mm4.4 mm15.1 px

ここから、次のようなことがわかります。

  • 16pxの文字の表示サイズは2.8mm~4.8mm、4.2mmの表示サイズにするための文字サイズ指定は13.9px~24.3pxと、表示デバイスによって1.7倍の開きがある。

  • デスクトップPC用の液晶ディスプレイは、サイトを作る側が想定している文字サイズと大きく変わらない表示になっている。

  • ネットブックも文字が小さく表示されがちだが、さほど極端に小さく表示されているわけではない。

  • ノートパソコンでは、想定しているよりもかなり小さい文字で表示されている可能性が高い。

特にノートパソコンでは、12インチ~13インチで1440×900ピクセルという、メジャーなタイプで文字が小さく表示されてしまうのが厳しいところ。そういった環境では、16ピクセルの文字が新聞よりも小さく表示されているということです。

最近はオフィスでもスペース節約のためにノートパソコンを使う企業も多いし、女性や学生などはノートパソコンを好む印象があります。ユーザー層に応じて、本文の文字は、これまでの16ピクセルよりも大きなサイズを選ぶほうが良い場合もあるかもしれませんね。

この記事は、メールマガジン「Web担ウィークリー」やINTERNET Watchの「週刊 Web担当者フォーラム通信」に掲載されたコラムをWeb担サイト 上に再掲したものです。

この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

ビューアビリティ
インターネット広告が「閲覧者が見られる状態にあるか」の観点と、それを確保するため ...→用語集へ

連載/特集コーナーから探す

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]