ブログ記事でおすすめ文字色はこれだ!読みやすい配色紹介

今回はブログ記事の文字色についてご紹介します。

正しい文字色を変えることで読み手の読みやすくなります。

もし良い記事を書いても、読みづらい文字色だと呼んでもらえません。

 

ここでは記事で使えるで正しい文字色の設定を覚えていってください。

 

動画解説

基本の文字色

文字に装飾を入れる

 

基本の文字色は、グレーがおすすめです。

fontカラー番号でいうと

「#333333」「#343434」「#353535」「#373737」「#383838」「#393939」

このあたりになります。

 

私は、「#383838」を使っています。

このグレーが良い理由は2つあります。

 

  • コントラストが抑えめ
  • 目に優しい

 

ちなみに、真っ黒だとコントラストが強くて目に優しくないです。

 

真っ黒は「#000000」です。

 

もあなたのブログの文字色はいくつなのか確認してみましょう。

WordPressで基本文字色の確認方法

WordPressのfontcolr確認方法

 

「外観」から「テーマの編集」を選択

「テーマファイル」から「スタイルシート(style.css)」を選択。

 

body {
color: #383838;

}

bodyという文字のなかに
「{」「}」のカッコで囲われているところを探してください。

そのカッコの中にある
「color:」の隣にあるのがあなたのサイトの基本文字色です。

また文字サイズも確認しておきましょう。

 

文字サイズは、16pxが良いです。
16pxが良い理由は、Googleが推奨しているためです。

文字サイズの場所も
通常は、bodyの中に入っております。

body {
color: #383838;
font-size:16px;
}

もし、16pxでなくて1emとなっていた場合。
1emは、16pxという意味なのでそのままでOKです。

デフォルトは
「16px」=「1em」
となっております。

ただ、使っているテーマによってはstyle.cssのなかに「font-size」や「color」がない場合があります。

 

私が利用している有料テーマDiverの場合、

fontsizeは「Diveオプション」に格納されています。

 

 

「Diverオプション」から「投稿設定」
そこでフォントサイズをPCとSP変更できます。

 

超らくちん♪

これで基本のフォント色とサイズの設定が完了しました。

 

強調する文字色とサイズについて

続いて強調する文字についてオススメをご紹介します。

 

強調する文字色は「#ff0000」赤がおすすめです。

 

コントラストがちょっと強めですが
一部を強調させたいのでこのくらいの色がおすすめです。

 

さらに強調させて太字にさせたりfont-sizeを大きくしたりして
目立たせましょう。

ただ、1つの記事に対して色んなパターンの強調があると読みづらいです。
なので強調でつかう文字種類は2~3個に抑えましょう。

 

私のオススメ組み合わせ

 

 

赤字+太字+フォントサイズ18px

赤字+太字+黄色

赤字+太字

太字+文字背景薄い黄色

太字

 

この強調文字を入れる頻度ですが、
表示されているブラウザ画面上で見た時1~2個表示されるのがおすすめです。

 

文字数で言えば、100~200文字に1個強調文字をいれましょう。

 

そうすることでメリハリが生まれ読み手が読みやすくなります。

 

リンク文字色について

訪問していないリンクの文字色は青がおすすめです。

 

訪問していないリンクの文字色は青がおすすめです。

 

訪問済みのリンクの文字色は紫がおすすめです。

 

こちらは特に設定する必要はなくデフォルトのままで大丈夫です。

 

理由は、一般的に青色で下線があるテキスト文字は
リンクされていると認知されているからです。

 

まとめ

 基本文字色のオススメと変更方法を紹介しました。

基本文字色のオススメと変更方法を紹介しました。

基本文字については、コントラスト比を抑えて読みやすくします。

強調したい文字には、赤文字や太字を使って目立たせる。ただ乱用は読みづらくなります。

テキストリンクは、青文字でデフォルト設定。

ブログは、ビジュアルエディターを使えば簡単に色や大きさを変更できます。

 

ただ、多用すると読みづらくなってしまうのであまり多用しないよう気を付けてください。

 

文字が読みやすいとあなたの記事をしっかりと読むことができます。

 

設定自体も5分もあれば完了しますので、ぜひお試しください。

スポンサーリンク
斉藤かずまのLINEアカウント開設しました。

LINEアカウントを開設しました。 アフィリエイトに関するお得な情報をご紹介しております。  登録いただいた方限定で、 副業・アフィリエイトに関するあなたの悩みを おひとつ無料で回答させていただきます。

LINEアカウントを開設しました。
アフィリエイトに関するお得な情報をご紹介しております。

新規ご登録いただいた方限定で、副業・アフィリエイトに関するあなたの悩みを、おひとつ無料で回答させていただきます。

副業で悩んでいる方はぜひご利用ください!

お友達登録方法

PCの方
スマホでQRコードよりアクセスしてください
LINEアカウントを開設しました。 アフィリエイトに関するお得な情報をご紹介しております。  登録いただいた方限定で、 副業・アフィリエイトに関するあなたの悩みを おひとつ無料で回答させていただきます。
SPの方
下記のボタンよりアクセスしてください

Twitterでフォローしよう

おすすめの記事