月間PV数100万以上の6個の人気サイトが使っているフォントを比較！おすすめは２つ

以前、月間PV100万以上の人気Webサイトの記事トップのデザインについてお話したことがあります。

haijpuro.hateblo.jp

webサイトを多くの人に見てもらうためには情報量はもちろんですが「読みやすさ」が重要であると知りました。

今回は読みやすさの要であるフォントに注目し「どんなフォントを使っているのか？」や「行間」などについて掘り下げます。

読みやすいサイト・ブログを作る上でフォント選びは重要な部分になりますのでフォント選びの参考になればと思います。

参考にするウェブサイトは全部で6個です。

Google Japan Blog

Google Japan Blog

皆さん大好きGoogleの日本語ブログサイトで特殊な作りのシングルページのサイトとなっておりシンプルで洗練されたデザインが素晴らしいなと思います。

フォント：Noto Sans JP

Noto Sans JP

Google Fonts

詳細

タイトル

japan.googleblog.com

Google Japan Blog

• サイズ（font-size）：24px
• 太さ（font-weight）：nomal

本文

• font-size：17px
• font-weight：ノーマル
• 行間（line-height）: 32px

シンプルな記事ですが圧倒的な見やすさを誇る「Google Japan Blog」

行間と本文の文字の大きさなどすべてが完璧といってもよいでしょう。

最も参考になるサイトの一つだと思います。

ボクシルマガジン

ボクシルマガジン

ボクシルマガジン クラウド時代のビジネスメディア | ボクシルマガジン

SaaS比較サイト「ボクシル」の月間350万PVを誇る情報メディアです。

多くの人が見ているサイトで記事も読みやすく多くの情報を発信しています。

フォント：Noto Sans Japanese

Google Japan Blogと同じNoto Sans JPフォントの古いバージョン「Noto Sans Japanese」です。

詳細

 タイトル

従業員満足度（ES）調査の目的・項目・実施手順 | 質問サンプルとサービスも - 従業員満足度調査 | ボクシルマガジン

• font-size:28px
• line-height:1.7
• letter-spacing:0.8px
• font-weight:bold

本文

• font-size:16px
• line-height:1.9
• letter-spacing:1.1px

印象的なのは空間の使い方で文章と文章の間が離れており一呼吸おいて読めるような感じがしますね。

manablog

manablog

manablog

月間PV100万以上の有名ブロガーのマナブさんのサイト。

読みやすくブログのネタも参考になります。

フォント：Helvetica NeueとNoto Sans JP

Helvetica Neue

iOSのシステムフォント等で使われるメジャーなフォントの一つで英語や数字はHelvetica Neueで日本語はNoto Sans JPとなっております。

Helvetica Neueは有料フォントで、すべて買うと4万円ほどになります。

Helveticaフォントを使いたいが買うのはちょっとという人は、似ている「Arial」フォントを使うといいと思います。

詳細

タイトル

【体験談】YouTubeが伸びないときの対処方法【本気の解説をします】

• font-size:25px
• font-weight:600

本文

• font-size:17px

こちらも文章と文章の間が離れており読みやすいイメージを受けます。

バズ部

バズ部

バズ部

フォント：游ゴシック体

游ゴシック

こちらの游ゴシック体は日本語のメジャーなフォントの一つでスタンダードな角ゴシック体ファミリーで漢字が見やすくなるように作られています。

詳細

タイトル

ユーザーを強烈に惹きつけるコンテンツにする「好奇心のギャップ」戦術

• font-size:28px
• line-height:1.7
• letter-spacing:0.8px
• font-weight:bold

本文

• font-size:16px
• line-height:1.9
• letter-spacing:1.1px

KACOO[カコー]

KACOO[カコー]

WEBライターが文章の書き方を覚えるときの4つのポイント｜KACOO[カコー]

Webライターの求人サイトでデザインなどが優れており記事ページはライター求人サイトだけあってすさまじく読みやすい。

フォント：游ゴシック体

やはりメジャーなだけあって多くのサイトで使われています

詳細

タイトル

記事テーマから構成案ができるまで、1から10個の切り口の探し方｜KACOO[カコー]

• font-size:30px

• line-height:150%

• font-weight:bold

本文

• font-size:16px

• line-height:1.75

文春オンライン

bunshun.jp

フォント：Noto Sans JP

詳細

タイトル

• font-size:.32px

• line-height:1.4

• font-weight:500

本文

• font-size:16px

• line-height:1.8

以上、6個のサイトを分析しましたが、「Noto Sans JP」か「游ゴシック体」かに分かれる結果となりました。

これらは多くの人が見るサイトなので「Noto Sans JP」や「游ゴシック体」はユーザーにもなじみのあるものになってきていると思います。

おすすめのフォントは？と聞かれたらこの二つのうちのどれかを迷わずおすすめできます。

それでは「月間PV数100万以上の6個の人気サイトが使っているフォントを比較！おすすめは２つ」を終了いたします。