最近、Webページのフォント指定をしていないサイトがあって、いまさらどーしたものか考えていました。
とりあえず私もWeb制作業界の端っこに在席している身ですから。
そもそもの話、Webページにフォント(font-family)指定をしたからと言って、PCにそのフォントがなければ(無指定と同じで)Webページの表示はブラウザでデフォルト設定のフォントになってしまいますが、そのあたりを見越してHTML(CSS)ではフォント指定を複数、優先順に入れているわけです。
MSゴシックはWin3.1から入っていますし、MS PゴシックはWin95以降入っているもの。XPはシステムフォントとしてMS UI Gothicが採用されています。メイリオはVista以降のシステムフォントですが、XPには標準では入っていませんでした。
現在は、流れとしては画面の解像度が増したせいもあり、小さなノートPCでも左右1366pxといった解像度をもつ昨今、以前多く採用されていた12px程度の標準フォントサイズでは小さすぎ、14pxあたりに指定をUPされてきています。
また見やすいという理由でWindowsはメイリオを優先し、なければ(たぶんブラウザ指定の)MS Pゴシック。
Macであれば、ヒラギノ角ゴでしょうか。
ちょっと参考になった下記のブログでは、
CSSのfont-family指定はこれで決まり!(2013春)
結論として(欧文指定も含めて)、
font-family:’Lucida Grande’,’Hiragino Kaku Gothic ProN’, Meiryo, sans-serif;
だけでOKという趣旨が書かれていました。
記事を読めば、なるほどなるほど、なぜそこまでスリムになったかが書かれていました。2013春とありますが別に内容は古くもなく、私も参考にさせていただきました。
ただMacの、Osakaは表示が汚いので不要という記述もありますが、見やすいという支持者もいるんですけどね。(ま、詳しくは上記サイトで)
さて、ちょっと元に戻りますが、Webページでフォントが無指定だったときどうなるか、ご存じですか?
答えは、ブラウザの設定に従います。
そのブラウザの設定をカスタマイズしている人は除いて、通常下記のようになっているはずです。
すべて私のWindows7のPCでの話ですけど。
■Google Chrome 35
■Internet Explore 11
■Safari 5.1.7
■Firefox 30
現状認識の意味でキャプチャーとってみましたが、こういう各ブラウザの設定状況が、無指定のWebページには反映されているわけですね。
あと、Macの場合はSafariユーザーが多いはずですが、Safari6以降でデフォルトが明朝体になっていて、しかも設定でフォント変更ができないという話も(近場のMacユーザーから)聞いています。
要はcss(スタイルシート)ファイルをわざわざ作って、設定でそれを選択させないと変わらないとか。
プロでもない人にもそれをやらせるように考えるSafari(Mac版)ってなんなの?って感じですが、明朝体が嫌なら変える方法は
Safariのデフォルトのフォントスタイルを明朝からゴシックに変更する方法
などに書かれていました。