【WordPress】これからブログを始める方向け、おすすめフォント5選!

ブログを始めるときは、どのようなレイアウト・デザインにするか、かなり迷いますよね。

そこで、まず意識してほしいのがフォントの種類です。

当然ですが、ブログは文字を書いて情報を発信するので、読みやすいフォントかどうかでユーザービリティに天と地ほどの差が現れます。

ただ、フォントは膨大な量が存在するので、管理人も最初のころはよくわからなくなってしまいました。

そこで、今回は多くのサイトやブログで使用されている人気フォントを紹介していきます。

ここで紹介するフォント以外にも優れたフォントはたくさんありますが、「フォントのこととかよくわからん」、という方は下記のフォントを採用してみてはいかがでしょうか。

紹介する前に導入方法

フォントの導入方法は、WordPressの「カスタマイズ」→「追加CSS」にCSSを追記することで導入することができます。

基本的な書き方は下記のようになります。

わからない方はとりあえずコピペでOK!

body {
font-family: ○○○, sans-serif;
}

※〇〇の部分にフォント名が入ります。

メイリオ

定番にして王道、それがメイリオフォントです。

日本でこのフォントを見たことがないという方はほとんどいないのではないでしょうか。

視認性に優れ、読みやすいことから多くのWebサイトやブログに導入されています。

ただ、メジャーすぎるので他のブログと差別化をはかるためにサブのフォントとして使われることが往々にしてあります。

少しデジタル感が残るのが特徴的。

body {
font-family: Meiryo, “メイリオ”, “Yu Gothic”, “游ゴシック”, YuGothic, “Helvetica Neue”, Helvetica, sans-serif;
}

※ブラウザやデバイスによって使用できるフォントは異なります。そのため、CSS上では複数のフォントを指定してやります。先頭のフォントから優先的に採用される仕組みになっています。

游ゴシック

当ブログにおいてメインで使用しているフォントであり、またWindows OSで使用できるフォントの中では、かなり綺麗で読みやすいフォントだと考えています。

Windowsに導入すると文字が細すぎて見づらいという評判もあるので、Windowsでは游ゴシックMedium、Apple OSでは標準のYuGothicと設定するのがおすすめでしょう。

WindowsとApple OSで微妙に表記が異なります。

・Windows標準 Apple標準

body {
font-family: “Yu Gothic”, “游ゴシック”, YuGothic, “Hiragino Kaku Gothic ProN”, “Hiragino Kaku Gothic Pro”, Meiryo, “メイリオ”, sans-serif;
}

 

・Windowsやや太め Apple標準

body {
font-family: “Yu Gothic Medium”,”游ゴシック Medium”, “Yu Gothic”,”游ゴシック”, YuGothic, “Hiragino Kaku Gothic ProN”, “Hiragino Kaku Gothic Pro”, Meiryo, “メイリオ”, sans-serif;
}

Helvetica Neue

ヘルベチカ・ノイエと読み、その整ったデザインは読者に安心感を与えます。

Helveticaは、その安定感から世界中で愛されているフォントであり、Webサイトやブログだけでなく様々な企業ロゴのフォントとして使用されることもあります。

居心地のいいブログを目指すのであれば、ぜひ導入したいフォントですね。

現在は最新のHelvetica Neueが多く使用されています。

body {
font-family: “Helvetica Neue”, Helvetica, Arial, Meiryo, “メイリオ”, sans-serif;
}

Lato

LatoはGoogleフォントの1つで、柔らかで美しいデザインのWebフォントです。

視認性にも優れているので、大変読みやすいWebサイトやブログを構築できるのではないでしょうか。

Lato-Google Fonts

@import url(https://fonts.googleapis.com/css?family=Lato:400,700);

body {
font-family: Lato, “Yu Gothic”, “游ゴシック”, YuGothic, Meiryo, sans-serif;
}

※「@~」のみ追加CSSからではなくテーマ編集からstyles.cssに直接書き込む必要があります。

Noto Sans JP

こちらもGoogleフォントの1つとなります。

Noto Sansは、GoogleとAdobe社で共同開発されてWebフォントであり、視認性・可読性などすべての要素が優れています。

文字にはクセがなく非常に読みやいので、柔らかな印象を与えてくれるでしょう。

標準での文字サイズはやや太め。

ただ、弱点としては他のフォント郡よりデータ容量が大きく読み込みに時間がかかることです。スピードが命のWebサイトでは致命的といってもいいでしょう。

容量を軽くする方法も存在するので、ある程度、速度を確保した状態で使用することをおすすめします。

Noto Sans JP-Google Fonts

@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

body {
font-family: ‘Noto Sans JP’, “Yu Gothic”, “游ゴシック”, YuGothic, Meiryo, sans-serif;
}

※「@~」のみ追加CSSからではなくテーマ編集からstyles.cssに直接書き込む必要があります。

おすすめフォントまとめ

これからブログを始める方におすすめしたいフォントを紹介してきました。

フォントの評価はユーザーの好みで大きく変わるので一概にこれがベスト、とは言えません。

しかし、ここで紹介したフォントは、評価も高く使いやすフォントばかりです。

フォントの良さはブログデザインにおいて重要なポジションを占めるでしょう。

気になるフォントがあれば、ぜひチェックしてみてくださいね。

関連記事:
Chrome拡張機能「WhatFont」でWebサイトのフォントを確認する方法

<使用しているサーバー>
MixHost-レンタルサーバー

<使用しているドメイン>
エックスドメイン-ドメイン

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitter でtwo_audioをフォローしよう!