この記事は最初「UbuntuのFirefoxのfont-familyの動作が謎過ぎる」というタイトルでUbuntuのFirefoxだけの問題だったのですが、結構大きな問題になってきて無視できなくなってきたのでタイトルを変えました。
上記のページでは過去に以下のような指定を推奨していました。 LinuxではＭＳ Ｐゴシックがないのでfont-familyを辿っていき、それなりに利用しやすく見やすい梅Pゴシックを指定しているのですが、 この指定は今のLinuxのChrome/Firefoxでは動きません。
# これは駄目
font-family: 'ＭＳ Ｐゴシック','MS PGothic','梅Pゴシック',Textar,sans-serif;
ではどうすれば良いかと言うと、ＭＳ Ｐゴシックの記述をなくして梅Pゴシックだけにすればとりあえずは動いた。 しかしこの動作は明らかにおかしい。 フォントがなかった時にはfont-familyのリストを探索してくれないとOS間の差を吸収できなくなってしまうため、font-familyの存在意義がない。 なので私はFirefoxはフォントが見つからなかった時の処理が間違っていると思う。
# これは動く
font-family: '梅Pゴシック',Textar,sans-serif;
font-family: '梅Pゴシック','ＭＳ Ｐゴシック','MS PGothic',Textar,sans-serif;
主に自分のためだけど、ズレが発生するAAを以下に貼っておきます。 このAAがズレなくなれば問題が直った事の確認ができる。
嘆いていても仕方ないので、対応方法を考えてみます。 例えば以下のようにWindows以外ならfont-familyを変更してしまうのが良いかも知れません。 いっその事、すべての設定でも梅Pゴシックを先頭にする手もありそうですが、 梅Pゴシックは完璧なAAフォントではなく若干ズレる時があるので、部分的な適用のほうが良いかなと。 JavaScriptを介してしまうためレンダリングが遅くなってしまいますが、仕方ない。
var aa = $("pre.aa");
var ua = navigator.userAgent;
if (ua.indexOf("Win") == -1) {
aa.css('font-family', "'梅Pゴシック',Textar,sans-serif");
}
フォントとか文字コードって今でも結構大変な分野で、OSを問わずChrome (ver.66) は今でも文字化けする事もある。 例えば「( ･᷄ὢ･᷅)」というAAがあるのだけど、これを表示できるでしょうか？ 私の環境では豆腐系の文字化けを起こしてしまう。アドレスバーへの入力でも同様に文字化ける。 文字コードってほんと難しい。
追記修正: 私にはなぜそのような事が起きるのかよくわからなかったこの問題ですが、UbuntuでAA（アスキーアート）がずれるのはＭＳ Ｐゴシックが置換されるからだった（かも？） - Palm84 某所の日記 にてＭＳ Ｐゴシックの置換指定の問題である事がわかりました。感謝！
最近のUbuntuはデフォルトフォントが変わったり色々変化していたので、 ちょうど良い機会なのでもっとしっかり確認しようと私も検証をしてみました。
まずUbuntu 18.04を仮想マシンで起動してみたところ、標準日本語フォントは以下の3つしかありませんでした。(梅Pゴシックないのか…)
- Noto Sans CJK JP
- Noto Sans Mono CJK JP
- Noto Serif CJK JP
上記のような標準日本フォントが用意されているインストールしたばかりのUbuntu/CentOS/Debianで、以下のフォント指定がきちんと表示できるか確認してみたのですが、どれも駄目。
font-family: '梅Pゴシック','ＭＳ Ｐゴシック','MS PGothic',Textar,sans-serif;
梅Pゴシックが見つからないのは良いのですが、やはりＭＳ Ｐゴシックの判定に入った時、置換指定の問題で結局バグるようです。 となるとWindows以外ではＭＳ Ｐゴシックを指定する事自体が危険であり、 先に述べたように何らかの方法で項目を削除するのが現状では妥当なのかも知れません。 もういっその事すべてTextarに頼ってしまうのもありかも。
私はこの実装は良くないと思うんだけどなあ。 もしかするとWebフォントの普及を狙った実装変更なのかも知れない。
