FOLIOのウェブフォント事情
created at:
2019-12-03
tags:
これはFOLIO Advent Calendar 2019 4日目の記事です。
ウェブフォント？
ウェブフォントって何？って人は僕の本を買いましょう。だいたい理解できます。
誰でもつかえる！ウェブフォント実践マニュアル (技術の泉シリーズ（NextPublishing）)
_Amazonで大木 尊紀の誰でもつかえる！ウェブフォント実践マニュアル (技術の泉シリーズ（NextPublishing）)。アマゾンならポイント還元本が多数。大木…_www.amazon.co.jp
あと僕が福岡フロントエンドカンファレンスで発表した資料も読みましょう。
https://speakerdeck.com/player/52163c144fdf460b819e0da9d4b2b473
FOLIOで使ってるフォント
ウェブフォント事情
Noto Sans JPとOpen SansはGoogle Fontsを使用しています。以前は自前でサブセット＆ホスティングしてましたが下記2つの課題がありGoogle Fontsを使うように切り替えました。
- ファイルサイズが重い（ウェイト全部合わせると2MBくらい）
- 証券会社なので難しい漢字が出てくることがあり、どの範囲サブセットするか決めるのが難しい
Yaku Han JPは自前ホスティングしてます。
storycap対応
弊社はstorycapで画像回帰テストをしているんですが、フォントのロードを待つ必要があるのでFont Loading APIを使って待機してます。
document.fonts.ready.then(function() {
...
});
（ネタがなかったので書いてみたけど、全然話が膨らまない…ふつうのことしかしてない…許して…）
おまけ
なし