font-familyの指定についてWEBメディア10サイトを調べてみた

スマホが普及するにつれ画像よりもデバイスフォントで表現することが多くなりました。
日本語はどうしてもフォントの種類が限られている印象ですが
文字の読みやすさを考慮している、WEBメディアではどのフォントを使用しているのか見てみましょう。
※bodyに指定されているfont-familyを抜き出しています。

#1 日本経済新聞

font-familyの指定についてWEBメディア10サイトを調べてみた
‘ヒラギノ角ゴ Pro W3′,’Hiragino Kaku Gothic Pro’,’MS Pゴシック’,sans-serif

あいうえお12345新聞

#2 ニュース速報:読売新聞(YOMIURI ONLINE)

font-familyの指定についてWEBメディア10サイトを調べてみた
“Helvetica Neue”,Helvetica,Arial,sans-serif

あいうえお12345新聞

#3 産経ニュース

font-familyの指定についてWEBメディア10サイトを調べてみた
“ヒラギノ角ゴ ProN W3″,”HiraKakuProN-W3″,”ヒラギノ角ゴ Pro W3″,”HiraKakuPro-W3″,”メイリオ”,Meiryo,”MS Pゴシック”,”MS Pgothic”,”Osaka”,sans-serif,Helvetica, Helvetica Neue, Arial, Verdana

あいうえお12345新聞

#4 NHKオンライン

font-familyの指定についてWEBメディア10サイトを調べてみた
“Lucida Grande”, Arial, sans-serif

あいうえお12345新聞

#5 Yahoo! JAPAN

font-familyの指定についてWEBメディア10サイトを調べてみた
“MS PGothic”, Arial, “Hiragino Kaku Gothic ProN”, “Osaka”, sans-serif

あいうえお12345新聞

#6 東洋経済オンライン | 新世代リーダーのためのビジネスサイト

font-familyの指定についてWEBメディア10サイトを調べてみた
Hiragino Sans,’ヒラギノ角ゴシック’,’ヒラギノ角ゴ Pro W3′,’Hiragino Kaku Gothic Pro’,’Meiryo’, ‘メイリオ’, Verdana,’MS Pゴシック’,sans-serif

あいうえお12345新聞

#7 日経ビジネスオンライン:総合トップ

font-familyの指定についてWEBメディア10サイトを調べてみた
“メイリオ”,”Meiryo”,verdana,”ヒラギノ角ゴ Pro W3″,”Hiragino Kaku Gothic Pro”,Osaka,”MS Pゴシック”,”MS PGothic”,Sans-Serif

あいうえお12345新聞

#8 Number Web – スポーツ総合雑誌ナンバー公式サイト

font-familyの指定についてWEBメディア10サイトを調べてみた
“メイリオ”,”Meiryo”,”ヒラギノ角ゴ Pro W3″, “Hiragino Kaku Gothic Pro”,”MS ゴシック”,”MS Gothic”,”Osaka-等幅”,Verdana,Arial,Helvetica,sans-serif

あいうえお12345新聞

#9 NewsPicks

font-familyの指定についてWEBメディア10サイトを調べてみた
“Hiragino Kaku Gothic Pro”,”ヒラギノ角ゴ Pro W3″,”メイリオ”,Meiryo,”MS Pゴシック”,sans-serif

あいうえお12345新聞

#10 レシピ検索No.1/料理レシピ載せるなら クックパッド

font-familyの指定についてWEBメディア10サイトを調べてみた
“Hiragino Kaku Gothic Pro”, “ヒラギノ角ゴ Pro W3”, “Meiryo”, “メイリオ”, “Osaka”, “MS PGothic”, arial, helvetica, sans-serif

あいうえお12345新聞

まとめ

まとめるとこんな感じの見え方になりました。
「ヒラギノ角ゴ Pro W3」「メイリオ」あたりがメジャーですね。

#1 あいうえお12345新聞

#2 あいうえお12345新聞

#3 あいうえお12345新聞

#4 あいうえお12345新聞

#5 あいうえお12345新聞

#6 あいうえお12345新聞

#7 あいうえお12345新聞

#8 あいうえお12345新聞

#9 あいうえお12345新聞

#10 あいうえお12345新聞

フォントについてはこちらの記事も参考にしてください。
デザインの細部にこだわるための明朝体・ゴシック体の基本

おまけ

GoogleではAdobeと共同で作成した日本語のWebフォントを提供しています。
多少重くなりますが、見やすいフォントを提供できます。
Google Noto Fonts
<link rel="stylesheet" href="//fonts.googleapis.com/earlyaccess/notosansjapanese.css">

#おまけ1 あいうえお12345新聞

個人的にはOS X Mavericksに搭載ならびにWindows10で標準フォントとなる「游ゴシック体」が気になります。

#おまけ2 あいうえお12345新聞

design > font-familyの指定についてWEBメディア10サイトを調べてみた