Firefox 3.6以降でMS Pゴシックを無効にする

CSSの@font-faceではユーザーがインストールしていないフォントをウェブ上に用意してやりそれをダウンロードさせてページ上で利用することを主眼としているが、ローカルのフォントを置換、つまりMS Pゴシックをメイリオに置換するなどということもできる。Firefoxでは3.6から可能になった(Beta版でももちろん可能)。ユーザー・スタイルシートでの利用が中心になると思う。

MS Pゴシックをメイリオに置換する場合は以下のようにuserContent.cssに記述する(userChrome.cssではない)。

@font-face {
  font-family: "MS Pゴシック";
  src: local("メイリオ"), local("Meiryo"), local("MS Pゴシック");
}

@font-face {
  font-family: "MS PGothic";
  src: local("メイリオ"), local("Meiryo"), local("MS Pゴシック");
}

日本語で書く必要があるので、userContent.cssの先頭に@charset "UTF-8";と書かれていることとuserContent.cssの文字コードがUTF-8であることは確認しておく。それぞれのsrcプロパティの最後にlocal("MS Pゴシック")も書いてあるのは一応念のため。これであらゆるウェブページでMS Pゴシックがメイリオで表示されるようになる。

srcで指定するフォントは複数のフォントを混ぜ合わせることもできる。例えば、

@font-face {
  font-family: "MS Pゴシック";
  src: local("Calibri"), local("メイリオ"), local("Meiryo"), local("MS Pゴシック");
}

とするとMS Pゴシックが英字部分はCalibriで日本語部分はメイリオで表示されるようになる(ちょっと正確ではないけど)。

MS ゴシックには良い代替フォントはあまりないが、やるならUmePlusやUmePlus CLとかが良いと思う。

@font-face {
  font-family: "MS ゴシック";
  src: local("UmePlus Gothic"), local("MS ゴシック");
}

@font-face {
  font-family: "MS Gothic";
  src: local("UmePlus Gothic"), local("MS ゴシック");
}

また、Windows 7(やメイリオのアップデータをインストールしたWindows Vista)では、

@font-face {
  font-family: "MS UI Gothic";
  src: local("Meiryo UI"), local("MS UI Gothic");
}

こんな風に書いておくとMS UI GothicがMeiryo UIに置換される。ClearType大好きっ子にオススメ。


ローカル・フォントの置換の欠点は置換するフォントをまったく利用することができなくなることとそれらのフォントを前提にデザインされたウェブページでデザインやレイアウト崩れてしまうかもしれないこと。特にMS Pゴシックをメイリオに置換する場合は、フォントの横幅がかなり広くなってしまうのでよくレイアウトが崩れることになると思う。

デメリットは少なからずあるが、解像度の向上した現在ではClearType(やアンチエイリアス)の効いた大きめのフォントでウェブページを閲覧する方が快適と感じる人が多いと思うので、設定して損はないと思う。

追記@2009-11-23T05:45:24+09:00

Firefox 3.6以降というのは正確ではなかったみたいで、条件さえ満たせば3.5でもローカルのフォントを置換することができるようだ(3.5.5で確認)。条件はfont-familysrcにマルチバイト文字を使わないこと(多分)。なので、userContent.cssに以下のように書いた場合は3.5でもMS UI Gothicがメイリオに置換される。

@font-face {
  font-family: "MS UI Gothic";
  src: local("Meiryo"), local("MS UI Gothic");
}

試してみたい人はuserContent.cssに上記コードを加えて、とてつもなく酷いフォント指定がなされているITmediaを開いてみると良い。

ただ、MS PGothicに対する置換はFx 3.5でも可能だが、MS Pゴシックに対する置換は不可能だし、MS PGothicに置換をかけてもMS Pゴシックとfont-familyで指定されている場分は置換してくれない(ややこしい!)。つまりMS Pゴシックを無効にするというようなことは3.5では無理で、3.6である必要がある。