font-familyの最近のブログ記事

Macintosh版のFirefoxですが、3.0になり、2.0以前とくらべて、font-familyの解釈が大幅に変わりました。
備忘録として、書き留めておきます。

font-familyの指定は、Macintosh用ファミリーネーム（英語）を使用します。

例えば、ヒラギノ角ゴシックProであれば、「Hiragino Kaku Gothic Pro」がMacintosh用ファミリーネーム（英語）です。

この指定のみで、Firefox 3.0とSafari 3.1.1に対応します。

さらに、Firefox 2.0やOpera 9.5も対象ブラウザとしたいのであれば、もう一つ、フルフォントネーム（日本語）も併用します。

例えば、ヒラギノ角ゴシックProであれば、「ヒラギノ角ゴ Pro W3」がフルフォントネーム（日本語）です。

それ以外の記述は、無駄に重複するか単に機能しないかのどちらかなので、必要ありません。

「ヒラギノ角ゴ Pro」不要、「HiraKakuPro-W3」不要、「Hiragino Kaku Gothic Pro W3」不要です。

「ファミリーネーム」、「フルフォントネーム」って何だ、という方は、以前のエントリー、「フォント名はいくつある?」をご覧ください。

いままで何度も検証したので、結論のみをよりわかりやすく書きます。

Firefox（3.0b5）Macintosh版 は、

• ファミリーネームによるfont-family指定を理解する。
• フルフォントネームによる指定を受け付けない。

Firefox（3.0b5）Windows版 は、

• Windows用ファミリーネームを認識する。
• Postscriptネーム（＝フルフォントネーム英）を認識する。
• ボールドウェイトのPostscriptネーム指定をレギュラーウェイトとして誤認識する。

※上記検証はOpenTypeによるものです。Windowsの大半のブラウザはTrueTypeしか認識しないので、あくまでも参考程度にしかなりません。

正式版が出たら、TrueTypeも含め、検証してみることにします。

Macintoshには、Windowsの欧文フォントがいくつかインストールされいます。そのおかげで、Mac／Win両方（≒web）で使える欧文フォントはそれなりにあります。

厳密な資料（※）が意外となく、ちょっとググってみただけでは出てこないようなので、自分でまとめてみました。

※ここのデータがオフィシャルなものですが、いまいち正確でない気がします。

まずは、アプリケーション「Font Book」でしらべてみました。

「コレクション｜Web」を選択した状態です。OSはLeopardです。（追加などを行なっていない）限りなくデフォルトに近いものですが、Arialファミリーなど、ウィンドウズ標準の欧文フォントが既に入っています。

• Andale Mono
• Arial
• Arial Black
• Brush Script MT
• Comic Sans MS
• Georgia
• Impact
• Times New Roman
• Trebuchet MS
• Verdana
• Webdings

次に、「すべてのフォント」を選択し、キーワードで絞り込んでみます。

「Microsoft」で絞り込むと、Microsoftがライセンスを持っている書体が現れます。どういうわけか上と異なる部分もあるようです。

• Comic Sans MS
• Georgia
• Microsoft Sans Serif
• Stencil
• Tahoma
• Trebuchet MS
• Verdana
• Webdings
• Webdings 2
• Webdings 3

※差分を太字にしています。

2つを統合すると次のようになりました。

• Andale Mono
• Arial
• Arial Black
• Brush Script MT
• Comic Sans MS
• Georgia
• Impact
• Microsoft Sans Serif
• Stencil
• Tahoma
• Times New Roman
• Trebuchet MS
• Verdana
• Webdings
• Webdings 2
• Webdings 3

さて、これですべてでしょうか。そもそもこれらはWindowsに搭載されているのでしょうか。調べてみたところ、微妙に違うようです......。

前回までと同様に、こんどはWindowsの様々なブラウザを使って、フォントがどのように認識されているかを検証してみました。

結論としては、

Windows用ファミリーネーム（日本語）

で指定するのが、最も多くのブラウザで対応するようです。

検証した後で気づきましたが、テストしたフォントはOpenTypeでした。
Windowsの標準搭載の日本語はみなTrueType（.ttc）なので、この検証にはほとんど意味がありません。
時間のむだでした。

検証結果は以下のようになります。

になってから、また日本語表示の仕様が変わったらしい。

• Windows用ファミリーネーム（日本語）を「ファミリー」として理解する。
• Macintosh用ファミリーネーム（日本語）を「ファミリー」として理解する。
• Windows用ファミリーネーム（英語）を「ファミリー」として理解する。
• Macintosh用ファミリーネーム（英語）を「ファミリー」として理解する。
• 太字強調された指定は、そのファミリーの上位フォント（があれば）で表示する。疑似ボールドにはならない。
• フルフォントネームでの指定をいっさい受け付けない。

正しく、大変潔い仕様だと思う。

ところで、Windowsではどんな感じなんでしょうか。今度調べようと思います。

font-familyの指定方法、「極めた！」と思ったのは一瞬だった……。もう矛盾が発生してしまった。

• フルフォントネーム（英）を理解するはずのFirefox3で、OSXのシステムフォント「AquaKana」を認識しない。
• フォントファミリーを理解しないはずのOperaで、ヒラギノ角ゴシックPro W3の<strong>をきちんとW6として認識して（表示して）いる。

さっぱりわからないや……。W3Cの書類を隅から隅まで読むしかないのか……。ううう。

いやいや「拘泥せずに進もう（©野口悠紀夫）」。

だいぶはっきりしたのですが、まだ、エントリーをまとめきれません。Windowsも含めた検証がすんだら再度アップしますが、Macintoshのみの検証結果は以下のようになります。

実用面でいえば、今までと特に結論は変わらず、
font-family: Macintosh用ファミリーネーム（英語）, フルフォントネーム（日本語）
で指定すればOKです。

具体的な検証結果としては、

• Macintosh用ファミリーネーム（英語）を「ファミリー」として理解する。
• フルフォントネーム（英語）兼PostScriptネームを「単独のフォント」として理解する。
  そして、「ファミリー」を理解できずに<strong>をブラウザのデフォルトフォントで表示する。

• Windows用ファミリーネーム（日本語）を「ファミリー」として理解する。
• Macintosh用ファミリーネーム（日本語）を「ファミリー」として理解する。
• フルフォントネーム（日本語）をなぜか「ファミリー」として理解する。
• フルフォントネーム（英語）兼PostScriptネームをなぜか「ファミリー」として理解する。
• Windows用ファミリーネーム（英語）を「ファミリー」として理解する。
• Macintosh用ファミリーネーム（英語）を「ファミリー」として理解する。
• 要はどのフォント名称でも「ファミリー」として理解する。

• フルフォントネーム（日本語）を「単独のフォント」として理解する。
  そして、「ファミリー」を理解できずに<strong>を疑似ボールドで表示する。

• フルフォントネーム（日本語）を「単独のフォント」として理解する。
  そして、「ファミリー」を理解できずに<strong>をスルーしてとぼける。

ようです。

以下のような方法で検証しました。

（OSXの）Firefox 3には期待しています。

今回のバージョンアップで日本語のレンダリングも若干変わったようです。

<strong>などによる、太字表現が、疑似ボールドではなく、きちんとフォントファミリーの上位ウェイトで表示されるようになりました。

従来のFirefoxでは、

と、太字が疑似ボールドでしたが、新しい3.0（b2）では、

と、太字がきちんと上位ウェイト（W3→W6）になります。

（参考：htmlによる表示）

ヒラギノ角ゴシック Pro W3

ヒラギノ角ゴシック Pro W3の太字

ヒラギノ角ゴシック Pro W6

※説明用の記述なので、Safariなどでは意図通りに表示されません。

フルフォントネームによるfont-family指定で表示されるようなので、フォントの認識の方式が変わったようです。

引き続き、検証したいと思います。

今回のバージョンアップで、Safari、Operaに続き、Firefoxからも疑似ボールド表示がなくなりました。

OSXってやっぱりいいなぁ。

前々回のエントリー、「フォント名はいくつある」の続きです。一応これで最後です。

いろいろ厳密に検証した結果。

font-familyで参照可能なフォント名称（フォントファイル内に複数格納されている呼称）は、
OSやブラウザの組み合わせ、参照するフォントの形式によって様々、となります。
わかりやすい法則は存在しません。

と結論づけられてしまいました……。

しんどいな〜。

まだ整理できてないけれども、

答え：メイリオ

前回のエントリー、「フォント名はいくつある」の続きです。

TTEditで調べてみたところ、
Windows（Vista）の新しい日本語フォント、「メイリオ」には、結局2つしか名前がありませんでした。

主要なブラウザは「フルフォントネーム（日）」であるところの「メイリオ」で指定されたfont-familyを認識します。