それからデザイン スタッフブログ

CSSでフォントの種類を指定する「font−family」の正しい記述方法は、デバイスに標準搭載されているフォントやWebフォントの技術の変化などにより日々変わっています。 このブログでも「font−familyのベストな書き方 2015年版」「font−familyのベストな書き方 2017年版」として、当時のトレンドを踏まえたfont−familyの指定方法の記事をアップしました。

今回は実際に使用していて気づいた問題も出てきたので、これを機にアップデートしたいと思います。

前回紹介した「2017年版font−familiy」の問題点

2017年版font−family

2017年版では「游ゴシック」の表示が最優先で表示されるのですが、Windows環境で「游ゴシック」を表示すると文字がかすれる現象がありました。

そこで、macでは「游ゴシック」、Windowsではそれ以外のフォントを当てられないかと考え今回の指定を考えました。

2018年改定版font−family

基本的には2017年版と変わりませんが、「游ゴシック」の記述を前回の「“Yu Gothic”」「YuGothic」の２種類から「YuGothic」のみに変更しました。この指定方法ならmacとWindowsで別のフォントを適応することができます。