HTML
Mac
Safari

Safari 12ではユーザがインストールしたフォントをfont-familyに指定できない

背景

個人的にはMyriadが好きなので、自分用に作ったサイトとかではよく「Myriadがインストールされている人(主に自分)だけにMyriadで表示されればいいやー」と思って以下のようにCSSを書いていたんだけど、macOSをMojaveにしたあたりからMyriadで表示されずLucida Grandeになってしまった。

font-family: "Myriad Pro", "Lucida Grande", sans-serif

解決

Mojave (Safari 12) からは、システムフォントだけしか指定できなくなってしまったらしい。なんでもユーザートラッキングを防ぐためだという。なので解決策としては、Webフォントにする、あるいはChromeを使う(ちがう)。

Font Family/Display Issue in Safari 12 on macOS Mojave - Stack Overflow:

This is because of the new no-tracking privacy features in Safari 12 + Mojave.

Web developers no longer have access to the ‘traditional web-safe fonts’; only the strict set of System fonts included in /System/Library/Fonts ‘from the factory’

Myles C. Maxfield on Twitter (AppleのWebKitチームの人) :

Safari now disables user-installed fonts in an effort to reduce fingerprinting across the web. Trackers can detect which fonts you have installed and use that info to track you across totally different websites, even into private browsing mode. We fixed it in Mojave.