-apple-system・游ゴシックの細字を考慮したCSSファイルを追加
qrac opened this issue · comments
macOS 10.13・iOS11以降のSafariでは、font-family に -apple-system を指定するとSanfranciscoに加えて小ぶりのヒラギノ角ゴシックが出力される。
これは、Appleが気を利かせて和欧混植専用の出力をしてくれているため。ただ、このルールにYakuHanJPを普通に被せると、ヒラギノが通常より小さく細くなっている影響でYakuHanJPだけ太く大きく見えてしまう。
-apple-system を外せば問題は解決されるが、昨今の流行りで入れているサイトも多いのを考慮し、デフォルトで細めの約物を出力できるCSSファイルを選択肢として用意するのもありかと考えた。自前でfont-faceを編集する人は限られているだろうし。
これは同時に細字の游ゴシックとの相性も改善できる可能性がある。無論、関係のない組み合わせでも約物だけ細くなってしまうが、約物は細い分には気になりにくいため、試す価値はある。
Safariの時だけ細身のセットに切り替える設定など。
Before: Safari -apple-system
After: Safari -apple-system
After: Chrome -apple-system
After: Firefox -apple-system
After: Edge -apple-system
After: Safari Yu Gothic Medium
After: Chrome Yu Gothic Medium
After: Firefox Yu Gothic Medium
After: Edge Yu Gothic Medium
試験的に実装してみた。