フォントは,とくに読者の環境によるところが多い部分である。CSS でのフォントに関わる指定がはたしてさまざまな環境で有効になるのかというのはたいへんに難しい問題であり,最悪の場合,文字が化けるという致命的な結果を招きかねない。
font-family 属性を用いて,フォント名や一般的なフォント名を指定して文書内のフォントを変えることができた。このとき,代替候補をあげたり,最後に一般的なフォント名をしたりするべきだというのは理解していただけているだろう。それだけフォントの指定は慎重に行う必要がある。ワープロのように,システムが持っているフォントの中から 1 つを選んでそれでよし,というものではない。
前にも述べたように,フォントの分類というのは難しい。また,フォントの“近さ”の評価も同じである。だが,それなりの処理はなされなくてはならないので,CSS では次の手順でフォントの対応を行う。
2. の「残りの属性について調べる」というのは次の手順である。
このような手順でフォントマッチングが行われる。
とはいうものの,これはおもに欧文についての話なので,和文だと多少事情が異なる場合があることを注意していただきたい。たとえば,
font-family: Times, serif;
として漢字を使ったとする。文字コードの認識がうまく行われていれば,Times に漢字は存在しないので一般的なフォント名 serif に関連づけられたフォントから漢字が表示される。ところが,ブラウザが文字コードをうまく認識できなかった場合,Times から漢字のコードに相当する文字が使われ,これが文字化けになってしまう。最悪の場合,serif も漢字を持っておらず,既定値のフォントが欧文ならば壊滅的様相になる。たとえ日本語版でも,Internet Explorer 3.0/4.0 にはこのような処理が起こりうるので注意しなくてはならない。和文(2 バイト文字)が出現しうる箇所には,現実問題として,日本語フォントの指定を環境に依存しない形で,かつ手厚く行っておく必要があろう。
CSS の規格では,
font-style: Helvetica, Arial, "MS Pゴシック", Osaka, "MS ゴシック", Gothic, sans-serif;
とすれば欧文部分が Helvetica または Arial で,和文部分が MS Pゴシック,Osaka,MS ゴシック,Gothic のいずれかで表示される(ない場合は sans-serif)ことになるが,ブラウザがそれを許しておらず,和文まで Helvetica あるいは Arial で表示させようとして文字化けを引き起こしてしまうことがあるのは残念である。現状を考えると,和文を含む場合は先頭に和文フォントを持ってくるのがよいようである。この場合,和文フォントも欧文文字(半角文字)を持っているはずだから,すべてその和文フォントで表示されることになる。
先にも“環境に依存しない形で”で述べたのは,ワープロ気分でたとえば Windows にしかない,あるいは Mac にしかないフォントだけを書いておく CSS をよく見かけるからである。
font-family: Chicago;
これは CSS としては間違いではないが,Chicago がない環境が考慮されていない。Chicago がなければブラウザの規定のフォントになるが,それであなたのデザインは多くの人に伝わったことになるだろうか。
font-family: Chicago, Verdana;
これは先ほどよりまだよい。Macintosh の Chicago に対応するのは Windows では Verdana かな,と考えているようだが,世の中 Macintosh と Windows しかないというのではないし,Macintosh または Windows であってもこれらがない場合もあるだろう。
font-family: Chicago, Verdana, Arial, sans-serif;
少なくともこれくらいは指定してほしいものである。とくに,最後の“一般的なフォント名”は最後の妥協点だと割り切って,必ず指定することをおすすめする。
今扱っている CSS1 では“フォントがない”場合の対応はあるいは“融通が利かない”ように見えるが,CSS2 ではこのフォントに関してはかなりの拡張がなされている。