font-familyの指定に迷ったら、有名サイトを参考にしてみよう。
サイトデザインの雰囲気や、コンテンツのテーマなどによって、悩み悩んでしまう「font-family」。
自分なりのテンプレを用意している人もいるかもしれません。
私の場合は、都度、サイトのイメージに合うものをという感じで考えているのですが、結局のところ、何が良いのかわからんです。
そんなときは、有名サイトをチェックして、自分のイメージに近いものを参考にすることをお勧めします。
ということで、ここでもいくつかピックアップしてみます。bodyタグにしているスタイルを見てます。
font-family: arial, sans-serif;
Yahoo！ Japan
font-family: MS PGothic,Arial,Hiragino Kaku Gothic ProN,Osaka,sans-serif;
font-family: San Francisco, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', "hiragino kaku gothic pro",meiryo,"ms pgothic",sans-serif;
font-family: Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
Amazon
font-family: 'Hiragino Kaku Gothic Pro W3','Hiragino Kaku Gothic ProN',Meiryo,sans-serif;
メルカリ
font-family: "Source Sans Pro", Helvetica, Arial, 游ゴシック体, YuGothic, メイリオ, Meiryo, sans-serif;
Uber
font-family: ff-clan-web-pro,"Helvetica Neue",Helvetica,sans-serif!important;
Airbnb
font-family: "ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","MS Gothic","ＭＳ ゴシック","Helvetica Neue",Helvetica,Arial,sans-serif !important;
YouTube
font-family: "YouTube Noto",Roboto,arial,sans-serif;
色々自分のサイトにはめて見て、イメージに合うフォントを探してみると良いですね！
