Androidデバイス上のウェブブラウザに向けたフォント設定を考える。

Android上のブラウザ向けに表示フォントの指定をしたい。要はスタイルシートの font-family 周りの設定の話なのですが。

結論を先に書くと…

Android 端末上のウェブブラウザに対しては、

CSS の font-family にフォント名を指定しても意味なし。

日本語表示に関しては、font-family に serif, sans-serif, monospace などの、いわゆる総称名を指定するのもあまり意味がない。

HTML の lang 属性の設定はするべき。

…という状況のようですね。

スタイルシートで好みのフォント設定をしていたのに、Android 上のブラウザだけ意図したものと違う表示になってしまう…ということに気づいて、直前の記事：

に書いた方法でフォント表示を調べてみたわけです。

その結果、上記の結論なのですが。

要するに、

Android 端末には、基本一種類の日本語フォントしか含まれていない。
例えば Android 7.0 にはゴシック系の Noto Sans CJK JP フォントのみ。
メーカーのカスタマイズで他のフォントが含まれている場合もあるかもしれませんが。
しかも CSS の font-family プロパティに "Noto Sans CJK JP" を指定しても効かない。効いたとしても、元々システムにそれしか含まれていないので意味なし。
日本語フォントが、ゴシック体の Noto Sans CJK JP のみなので、font-family に serif, sans-serif, monospace などを指定しても無意味。ただしこれらのキーワードは英語フォントに対しては有効。
例えば、
<style>
.mono {
  font-family: monospace;
}
.serif {
  font-family: serif;
}
.sans {
  font-family: sans-serif;
}
</style>

…と、こんな CSS に対して、
<div class="mono">日本語フォント。</div> <div class="serif">日本語フォント。</div> <div class="sans">日本語フォント。</div>
としてやっても、結果は以下のとおり、全て同じフォントで描画される。英語だと、ちゃんと効く。
<div class="mono">This is a pen.</div>
<div class="serif">This is a pen.</div>
<div class="sans">This is a pen.</div>

…という HTML に対して、表示は以下のように …となる。
html タグまたは要素に言語属性を設定するのは有効。日本語が意図せず中華フォントで表示されたりするのを阻止できる。逆に明示的に中華フォントでの描写も可能。
<div lang="ja">花、華…あお、約</div>
<div lang="zh-tw">花、華…あお、約</div>
<div lang="zh-cn">花、華…あお、約</div>

というソースコードに対して、表示は、となる。