Proを指定しようぜ!2017.05.12Home>Webデザイン・制作ブラウジングしていると、ふと気になることに「フォント」がある。ブラウザのフォントは基本的にhtmlのCSSで指定したフォントがPCにインストールされていれば、そのフォントが表示されるようになっているが、指定がなければデフォルトのフォントが表示されるようになっている。個人差があるが、フォントによっては見づらいなと感じることがある。そこで、Webサイト制作や自前でWebサイトやブログを持っている人は、ぜひともフォント指定をして欲しいと思い、どんなフォントがいいのかと画面キャプチャを取って検証をしてみた。Pゴシック」を画像でキャプチャしたものだ。Vistaでメイリオのフォントが登場するまでは主流だった。P明朝、或いはserifを指定した場合の表示だ。視認性は悪くないが、ゴシックと比べて少し見づらい感がある。メイリオこれは、メイリオを指定した場合の様子。明らかにハッキリ、クッキリと綺麗に見える。XPでメイリオのフォントを使用したい人はここからダウンロードできる。Proのみで指定した場合の表示だ。Macでは綺麗に見えるが、残念ながらWindowsで見るとフォントサイズによっては妙にジャギっている感があったり、ボヤけて見える。それなりに、安定した見え方ができる。綺麗に見えるがフォントのサイズによっては、薄くなってボンヤリと見えてしまう。検証結果:見やすく、美しく以上の検証結果からしてブラウザ上で明朝体は見づらいので、CSSでの指定はゴシック体の方が好ましい。X以降及び、MacとWindowsの両方の見やすさを考慮すと下記のように記述するのが望ましいと考える。W3’,sans-serifポイントは、Widonsでヒラギノ角が優先して適用されないように、メイリオを先に記述、また古いOSでは明朝体ではなくゴシック体で表示させるためにCSSの「総称ファミリ」sans-serifを記述。