そのフォントサイズ、適切ですか？-独学!未経験からWebデザイナーになる!!

そのフォントサイズ、適切ですか？

Webサイトというものは、若い人から、視力の弱いお年寄りまで、様々な人が見に来ます。その際に、大きく問題になるのがフォントサイズです。普段何気なく設定している人も多いと思いますが、今一度考えてみましょう。

小さな文字が読みにくい人は意外と多い

特に若い方に多い気がしますが、フォントサイズが小さい方が、デザイン的にすっきりとしていてかっこいい（もしくは読みやすい）といった風潮があります。

しかし、それは万人がそうであるとは限りません。小さい文字が読みにくいと思う方もいるのです。また、見る人の視力はもちろんの事、OSの違い、モニタの解像度、モニタまでの距離によっても見易さは変わってきます。

例えば、このサイトのフォントサイズはいかがでしょうか？中間あたりの大きさにしているつもりですが、環境によって、または個人差によっては「ちょっと大きくてモサイ(笑)」と思われる方もいらっしゃれば、逆に感じる方もいるはずです。（ちなみに私にとってはもうちょっと大きくてもいいかな、とも思います。）

Webサイトを作る際に重要視する事は「閲覧者への気遣い」です。「自分に丁度よければそれでよい」ではなく、見ている人の立場になって、考えてみましょう。

実際に気をつけたい点

それでは、具体的に気をつけたい点を挙げてみます。参考になさってくださいね。

モニタのドットピッチ

あなたは自分が利用しているモニタの解像度とドットピッチを意識したことはありますか？そんなことを気にしながら使っている方は少数派かもしれませんね。しかし、文字の大きさに関わる重要な要素なのでしっかりと確認しておきたいところです。

インチ	解像度	ドットピッチ
15インチ	1024×768 (XGA)	0.297mm
17インチ	1280×1024 (SXGA)	0.264mm
18.1インチ	1280×1024 (SXGA)	0.2805mm
19インチ	1280×1024 (SXGA)	0.294mm
20.1インチ	1600×1200 (UXGA)	0.255mm
21.3インチ	1600×1200 (UXGA)	0.270mm

※XGAやUXGAは、解像度のことを指します。

なにやらパっと見よく分からない表に見えますが、簡単に理解しておきたいことは、この中で15インチ-XGAが最もドットピッチが大きい=フォントサイズが大きく見え、20.1インチ-UXGAが最もドットピッチが小さい=フォントサイズが小さく見えると言うことです。

私も例に挙げた両方の環境を持っていますが、この大きさの違いはかなりのものです。以前メインで使用していた20.1インチ-UXGAでは、普通にWebをブラウジングしていて、しょっちゅうブラウザのフォントサイズを大きくしていました。文字が小さいというだけではなく、画面がそこそこ大きいので、離れて見ているということもあるでしょう。ちなみに、font-size:10pxで長文が書かれていようものなら読みたくなくなってしまうくらいです。

15インチ-XGAや、19インチ-XGA等、普段ドットピッチが大きい環境で作業をしている方は、特に注意して文字サイズを決定する必要があるでしょう。それらのモニタでかなり小さめなフォントは、20.1インチ-UXGAでは極小フォントになってしまうのです。また、その逆もしかりです。

モニタのインチと解像度は全て同じとは限らない

注意していただきたいのが、上で挙げたインチ＆解像度は一般的なものではありますが、必ずしもセットではないということに気をつけてください。つまり、○○インチは解像度○○×○○とは決まっていないということ。具体的には、21.3インチは1600×1200の解像度とは限らないということです。

ですから、モニタのインチサイズだけではドットピッチは算出できません。必ず解像度も確認しましょう。その両方さえ分かれば計算で算出できますが、ドットピッチ計算機という便利なツールがあるので、それを利用するのが早いでしょう。

フォントサイズの指定方法

Webサイト上でフォントサイズを変更するにはいくつかの方法があります。まずHTMLでできるのが<font size="3" ></font>みたいな方法ですが、特別な理由が無い限り、これはお勧めできません。基本的にはCSSで指定しましょう。

CSSにも px,pt,em,% 等様々な単位がありますが、その中でも相対指定を利用することをお勧めします。px（ピクセル）で固定してしまうと、Internet Explorer6(IE6)で文字サイズが変更できないからです。IE6のシェアは現在（10/1/13/）でもまだ2割程もいますので無視できません。なお、相対指定にはem,%等がありますが、私はよく%を使っています。