Web フォントに関する覚え書き（明朝体編）
【2019-12-29 追記】 現在の Google Fonts は日本語を含む各国語に正式対応している。
なのでこの記事はもう有用ではないが「こんな時代もあったよね」って感じで残しておく。
以前，ここで使っている Web フォントの話を書いた。 実は今まで日本語の Serif （明朝体）フォントがどうにも気に食わなかったのだが，最近 Google の Early Access のページを見たら随分と日本語の書体が増えている気がする。
この中から “Japanese” に分類されているものを挙げてみる。（10月16日時点）
- Nico Moji （ニコモジ）
- Mplus 1p （M+ FONTS）
- Hannari （はんなり明朝）
- Rounded Mplus 1c （Rounded M+）
- Nikukyu （ニクキュウ）
- Noto Sans Japanese
- Sawarabi Gothic （さわらびゴシック）
- Kokoro （こころ明朝体）
- Sawarabi Mincho （さわらび明朝）
- Noto Sans JP1
このうち Hannari, Kokoro, Sawarabi Mincho が Serif 相当の書体になる。 それぞれの見本をみて，私は Sawarabi Mincho を選択した。
さわらびフォントは明朝体ではまだ第一水準漢字も網羅されていないが，とりあえず鼻の先は問題なさそうである2。 Sawarabi Mincho を導入するには CSS で以下のようにインポートする。
@import url(http://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
あるいは各ページのヘッダ部分で
<link rel='stylesheet' href='http://fonts.googleapis.com/earlyaccess/sawarabimincho.css' type='text/css'>
としてもよい。 この CSS ファイルの中身は以下のようになっていて
/*
* Sawarabi Mincho (Japanese) https://fonts.google.com/earlyaccess
*/
@font-face {
font-family: 'Sawarabi Mincho';
font-style: normal;
font-weight: 400;
src: url(//fonts.gstatic.com/ea/sawarabimincho/v1/SawarabiMincho-Regular.eot);
src: url(//fonts.gstatic.com/ea/sawarabimincho/v1/SawarabiMincho-Regular.eot?#iefix) format('embedded-opentype'),
url(//fonts.gstatic.com/ea/sawarabimincho/v1/SawarabiMincho-Regular.woff2) format('woff2'),
url(//fonts.gstatic.com/ea/sawarabimincho/v1/SawarabiMincho-Regular.woff) format('woff'),
url(//fonts.gstatic.com/ea/sawarabimincho/v1/SawarabiMincho-Regular.ttf) format('truetype');
}
Sawarabi Mincho を指定するには
body {
font-family: 'Noto Serif', 'Sawarabi Mincho', serif;
font-weight: 400; /* normal */
}
とすればいいことが分かる。 ウェイトが1種類しかないが，明朝体を太字で表示することは多分ないので，これで OK。
Web フォントを Google のようなところから取得するのはメリットがある。 一度ダウンロードした Web フォントはブラウザ内でキャッシュされるため，みんなが同じ場所にあるフォントを使えばネット全体で通信量を減らすことができるからだ。
本当は Noto Serif で日本語をサポートしてくれると嬉しいんだけどねぇ。 でもフォントの制作は時間とお金と人手がかかる仕事だし，ただ成果を享受している身としてはワガママは言えません。