58
29

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

ios13から日本語フォントのboldがより太くなるケース

Last updated at Posted at 2019-09-20

[19/9/25 追記2]Hiragino sansとの比較

(左がios12、右がios13.1)
ios12とios13.1のキャプチャ

Hiragino sansでもboldが太くなっていることを確認。
ios13からは、lang="ja"のsans-serifは、Hiragino sansで表示されている

Hiragino sansを指定している場合 lang="en"でも太くなる
43df875638061e1438c053efe53528e8.png

[19/9/25 追記]ios13.1で少しだけ細くなりました(Hiragino-sans w7?)

(ios13.1)
ios13.1のキャプチャ


ios13から、lang="ja"のテキストに sans-serif が当たった場合、より太いboldで表示される(Hiragino-sans w8?)
https://output.jsbin.com/givoduv

シミュレータのキャプチャ

(左がios12、右がios13)
lang=jaの場合のキャプチャ
font-weightばboldまたは700以上の場合、ios12までのboldよりも太いboldで表示される
lang=enの場合のキャプチャ
lang="en"では起きない

sans-serif以外を指定した場合

-apple-system、font-face-apple-system、HelveticaNeue、ヒラギノのみを指定した場合のキャプチャ
sans-serif の指定がなければ発生しない。

他のフォント + sans-serifを指定した場合

-apple-system + sans-serif、font-face-apple-system + sans-serif、HelveticaNeue + sans-serif、ヒラギノ+ sans-serifを指定した場合のキャプチャ
-apple-system'Hiragino Kaku Gothic ProN'が、sans-serif より前にあれば日本語フォントにはそちらがあたるため、太くならない。
font-face-apple-system,sans-serif-apple-systemで日本語フォントが1px小さく描画されてしまう問題の対応で、@font-face-apple-system をかませているケース。
この場合、英数字のみ-apple-system があたり、日本語は次のsans-serifが当たるため、より太いboldになってしまう。

[番外]-apple-system(SF)のfont-weightが増えてた

(左がios12、右がios13)
003.png

58
29
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
58
29

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?