とりあえず、ブログを作って頑張るか
ちょっとまって!配色はちゃんと決めた?
これから、ブログを始めようとしているあなた。
ブログに使う色、決めましたか?
配色を決めずにブログを開始してしまうと、後々大変なことになりますよ。
筆者も、配色を決めずにブログを始めてしまい、修正で苦労しました……
当記事では、筆者の失敗をふまえながら、配色を決める方法や、役立つ配色サイトを紹介しています。
著者経歴
- 1日1時間で月3万円到達
- 月3万円の不労所得継続中
- 開設~運営までの情報発信中
- 限られた時間で稼ぐ方法
- 平凡リーマンが稼げた方法
ブログ配色を決めずに、ブログを始めようとしていた人は、ぜひ参考にしてみて下さい。
当記事の結論
- 配色は同系列で合わせる
- 配色バランスは【70:25:5】
- 文字は少し淡い黒を使う
- リンクは青色
- 色を使いすぎる
- 原色を使う
全部理解できていたら、ブログを開設しよう!
ブログ配色のパターン
ブログ配色にはいくつかの王道パターンが存在します。
- 配色は同系列で揃える
- 70:25:5の比率を意識する
- 文字色は黒を使わない
- リンク色は青にする
初心者ほど、間違いやすいから注意!
配色は同系統で揃える
配色は、同系列で合わせると統一感のあるキレイなブログに仕上がります。
見た目もスッキリして読者に見やすい印象を与えられるよ
70:25:5の比率を意識する
ブログには、配色の黄金比率があります。
- ベースカラー…背景・余白に使用
- メインカラー…見出し・枠色に使用
- アクセントカラー…強調部分に使用
ベースカラー
ベースカラーは、ブログの背景や余白に利用します。
70%を占めるので、白や黒に近い淡い色で形成してみましょう。
濃い色を使うと目が疲れちゃうかも
メインカラー
メインカラーは、ブログのイメージを決める色になります。
各色には、以下のようなイメージが想像される場合が多いです。
- 赤…積極的、注意
- 青…知性、誠実
- 黄…明るい、希望
- 緑…自然、健康
- 茶…落ち着き、古い
- 桃…可愛い、若い
- 白…清潔、無垢
- 黒…強さ、信頼
ブログの方向性を決める重要なカラー!
アクセントカラー
アクセントカラーは、注意を惹きけたい、目立たせたい場所に利用します。
アンダーラインや、強調文字などに使いましょう。
目立たせたいので、濃いめの色を選ぼう
文字色は黒を使わない
ブログの文字色を、デフォルトの黒で使い続ける人がいます。
実は、デフォルトの真っ黒よりも、少し淡い黒を使った方がブログは見やすくなります。
- テスト『#000000』
- テスト『#333333』
上の真っ黒な文字は、文字数が増えると画面を窮屈に感じさせてしまう。
下の少し淡い文字であれば、文字数が増えても画面を窮屈に感じさせにくくなるので、読者も見やすい。
ちょっとした違いだけど、効果はあるからやってみよう
リンク色は青にする
ブログで、他の記事を紹介したい場合に、下記のようなリンク機能を使うかと思います。
リンクは、昔から青色を利用するのが一般的です。
他の色でリンクを貼ると、リンクと気づかれない危険があるので、やめましょう。
読者が、他の記事を見てくれるチャンスを逃すかも!
ブログ配色の決め方
どんな配色をえらべばいいの?
ペルソナやジャンルに合わせよう
※ペルソナ=読者の想像図
ペルソナに合った配色を選ぶ
ブログを見にきてくれるペルソナが想定できていたら、ペルソナに合わせた配色を選ぼう。
ペルソナに合わせた配色例
- 年配男性…茶色
- 年配女性…あずき色
- 中年男性…紺、グレー
- 中年女性…淡いピンク
- 若い男性…青
- 若い女性…濃いめのピンク
年代や性別を意識して選んでみよう
ジャンルに合った配色を選ぶ
ジャンルに合わせた配色選びも需要です。
ジャンルに合わせた配色例
- 就職・転職…青
- ショッピング…赤
- 健康…緑
- アウトドア…緑
- 子育て…黄
- ファッション…グレー
ジャンルのイメージに合った配色を選ぼう
ブログ配色で気を付けるポイント
- 色を使いすぎない
- 原色のまま使わない
ブログ配色で、初心者がやってしまいがちな間違いポイントだよ
色を使いすぎない
アンダーラインの色、文字色、吹き出しの色など、多くの色を使わないように注意しましょう。
多くの色を使いすぎると、ゴチャゴチャした印象になってしまいます。
はじめまして、40-blogの管理人。
pappy-bloggerと申します。
当ブログは【1日1時間1年で月3万】のブログ術を公開中!
始め方、記事の書き方、モチベーションの保ち方など、様々な情報を発信しています。
すべて、筆者自身の経験談ですので、これからブログを始める人は参考にして下さい。
はじめまして、40-blogの管理人。
pappy-bloggerと申します。
当ブログは【1日1時間1年で月3万】のブログ術を公開中!
始め方、記事の書き方、モチベーションの保ち方など、様々な情報を発信しています。
すべて、筆者自身の経験談ですので、これからブログを始める人は参考にして下さい。
下の方が読みやすいよね!
当ブログの色設定は、WordPressテーマ【SWELL】を使用しています。
マーカー色や、文字色、吹き出し色などを、簡単に設定したいならSWELLがオススメ。
原色のまま使わない
ブログデザインなどを、原色のまま利用すると初心者感が出てしまいます。
左より右の方が、初心者感がなくていい感じ
原色より、少し薄めに色を利用することを心がけましょう。
参考になる配色サイト
配色で悩んだときは、見本となる配色サイトを参考にしよう
使いやすい、日本のサイトを紹介します。
便利な配色サイト
他のブログ配色を参考にする
配色サイトを見たけど、何色を選べばいいかわからない
配色に迷った時は、TOPブロガーの配色を参考に
配色に迷った時は、いろいろなブログを見て回り参考にしよう。
特に、TOPブロガーが作っているブログは配色も整っているので、非常に参考になります。
利用する素材も合わせる
配色を統一する重要性は、理解できたかと思います。
配色の他に、素材の雰囲気も統一することで、ブログの統一感がより一層深まります。
- 写真とイラストを混合させない
- 想定したペルソナが好みそうな素材を使う
- ジャンルに合った素材を使う
- 配色に合った素材を使う
まとめ
ブログの配色について解説してきました。
どんな配色にするか決まったら、ブログを開設してみましょう!