Free-Photos via Pixabay
Webのフォントまわりのことについて少し書こうと思う。理由は昨年の9月に、Webのフォントまわりの事情が大きく変わったからだ。しかし、そのことを直接書いても、過去の事情が分からない人には、どういうことなのか理解できない。そのためインターネットの黎明期から順にたどり、Webのフォントの進化について書く。普段見ているWebの文章についての裏事情というわけだ。
さて、紙の印刷物とWebの文書は見た目が大きく違う。紙という「サイズが決まっている」媒体と、Webという「サイズが不定でスクロールして読むもの」では作り方が異なる。それ以外にも、フォントが見栄えに与える影響が無視できない。
インターネットの黎明期、そもそも文章にフォントを指定する方法はなかった。Webブラウザが選んだフォントで文章は表示されていた。
その後、Webの進化に従いフォントの指定が可能になり、見た目をコントロールできるようになった。具体的には、1995年の Netscape 2.0 で、font タグが導入されサイズの指定が可能になった。そして1996年の Internet Explorer 3 で face 属性が追加されて、フォントの指定がおこなえるようになった(参照:
Netscape FONT Element、
FirefoxとWebブラウザ年表)。
ただ、実際にはフォントの選択は制約が多かった。たとえ指定しても、その閲覧環境に指定したフォントが入っていなければ反映されなかった。
フォントの指定では、複数のフォントをカンマ区切りで並べられる。そのため Windows や Mac で入っているだろうフォント名をずらずらと並べて、どれかがあればよいという状態だった。
たとえば「”Hiragino Kaku Gothic ProN”,”メイリオ”, sans-serif」のように指定した場合、左側が優先で、閲覧環境になければ順次右のフォントが存在するかチェックされる。
最後に書いてある「sans-serif」は、総称フォントファミリと呼ばれるもので、フォントがない場合の代替指定になる。WebブラウザやインストールされているOSにより、対応したフォントが自動で選ばれるものだ(
MDN)。
この総称フォントファミリでは、serif、sans-serif、monospace が代表的なところだ。serif は文字の端に髭がある文字で、日本語なら明朝系になる。sans-serif は文字の端に髭がない文字で、日本語ならゴシック系に当たる。monospace は等幅フォントで、プログラムなどを表示する際に都合がよい。
便利なように見える総称フォントファミリだが、実際には難が多い。環境により、どのフォントで表示されるのか分からない。また monospace と指定しても等幅にならなかったりする。そのため最後の手段になる。
このフォントの指定で分かるように、Webの文書は閲覧者の環境によって、どのように表示されるのかが変わる。
紙の印刷物では、デザイナーが指定したとおりのものが閲覧者によって読まれる。Webの文書も同じようにしたいと思うのが人情だろう。しかしフォントの問題から、同じようにはいかない状況が続いていた。
そして消極的な解決策として、デザインにこだわるWebページでは、文字を画像にすることがおこなわれていた。
しかしこの方法は、見栄えはよいが閲覧者にとっては非常に使い難い。文字が選択できない。検索もできない。こうした状況に、サイト製作者側も、閲覧者側も不満を抱えていた。