【2022年】人気WordPress 無料・有料テーマ比較

ブログの配色は心理学で考えると悩まない|カラーコード付き

ブログの配色

\WordPressの運営におすすめの高速・簡単レンタルサーバー/

 人気ワードプレステーマSANGO・JIN割引で購入可能

レンタルサーバーConoHa(キャンペーン詳細)

セルフバックでお得に商品やサービスも申し込める

\アフィリエイト広告を始めるなら/

A8.netに無料で登録

  • ブログの配色に悩みっぱなし
  • ブログの配色が納得いかない
  • ブログの配色が悪いと言われた
  • ブログの離脱率が高すぎるから改善したい

ブログを運営する上において配色ほど大事なものはないと言ってよいかもしれません。

配色ひとつで印象が変わってしまうので、あらゆるデザイン物は配色が非常に重要です。

ブログの配色は心理学で考えると悩まない

カラースキーム

ブログは誰でも書くことができます。

個人や企業に関わらず多くの人がブログを検索してアクセスします。

プロがデザインした企業メディアもライバルになりますし、個人ブログだって素敵な配色のものはたくさんあります。

ブログ初心者が適当に作ったブログではほぼ勝ち目はないです。

勝てるブログを作るには、この記事を参考にするだけでOKです。

配色設定を適切に行えば、ユーザーに無意識のうちに好印象を持ってもらえます。

memo
  • 即離脱されるようなきつい配色にしない
  • 淡い色を使う
  • メインカラーは3色までにする
  • キャッチーなアクセント色を入れる

NGな配色

カラースキーム
NGな配色
  • 黒背景は基本的にNG(とても目が疲れます)
  • 目が痛くなるようなきつい配色
  • 背景色と同化して読めない文字の色
わーぷれ
わーぷれ

ブログ初心者のブログやアイキャッチでよくみかけるにゃ。

秒で離脱したくなるにゃ。

強い色を使いすぎると非常にうるさくなるんだにゃ。

ビビッドなはっきりした色は一見するとかっこいいかもしれませんがダサくなりがちです。

ブログ全面に強い色を使っていると、長時間読むのが疲れるので離脱率が高くなります。

いくら好きな色でも、配色バランスを考えると使いすぎると逆効果になる場合もあります。

チラシ広告と違い、何度も読んでもらいたいブログの場合は特に気をつける必要があります。

離脱率を下げて、何ページも読んでもらうには「心地よい」と感じてもらえるやさしい配色にする必要があります。

ブログの配色・テーマカラーの決め方

テーマカラーの決め方
  • 配色は3色までに決めてそれ以外の色は極力使わない
  • 3色とは「キーカラー」「アクセントカラー」「アクセントカラー2」の3種類
  • 文字色に黒ベタ(#000000)以外を使うと、全体的にお洒落になるし文字が読みやすくなる
中の人
中の人

こういう色構造で色を決めると格段に好印象の配色を作ることができます。

キーカラーが決まれば、その他の色も自然と決まります。

色の組み合わせで人の印象が変わる|色彩心理学

人間心理を理解すれば配色パターンで悩まない

人間は色によって無自覚に印象を抱きます。

明るい気持ちになったり、爽やかな気持ちになったり、元気になったり、興奮したり、恐怖を感じたり、不安を感じたりします。

色だけで匂いを感じる場合もあります。

現代広の心理技術101」の306ページにも書かれている通り、消費者が一番好む色の結果が出ています。

詳しく知りたい人は本を読んでみるとよいでしょう。

そのほかにもブログに役立つ消費者心理が学べます。

あなたの好きな色はなんですか?

青?

赤?

緑?

黄色?

オレンジ?

紫?

次の配色スキームは最も好まれる組み合わせです。

カラースキーム

これはこのブログの配色スキームです。

一般的に最も好まれる配色パターンを使っています。

アクセントカラーがあることで、魅力的な配色構成を作ることができます。

アクセントカラーの選択をミスるとブログの魅力が半減してしまうので慎重に選びたいところです。

迷わない配色サンプル、マネするだけ

配色スキームの例を用意しました。

ブログの色をカスタムするときにカラーコードをコピペして設定すればOKです。

1:基本は軽いブルーカラー

カラースキーム

青はもっとも好まれる色です。

ブログ初心者は青を基調にした配色にするとよいでしょう。

#42A0FF

#A9DAFF

#81D0CB

#FFDC5D

#3C3C3C

SANGOテーマのベースカラーがブルーになっているのも、もっとも好まれる色がブルーだからだと思います。

SANGOテーマ メリット・デメリットSANGOテーマの評判レビュー|ブログ初心者におすすめのWordPress有料テーマ

2:イエローとレッド系をアクセントカラーに

カラースキーム

キーカラーはブルー

アクセントカラーを強めにイエローとレッド系を配色しました。

#42A0FF

#A9DAFF

#FFDC5D

#E37A60

#3C3C3C

3:さわやかなミントカラー

カラースキーム

さわやかさや清潔感を出したい人へ。

イエローのアクセントカラーとの相性もバッチリです。

#81D0CB

#B6E6E3

#FFDC5D

#A9DAFF

#3C3C3C

4:ヘルシーなグリーン

カラースキーム

ヘルシー系の情報ブログで。

元気の出るイエローをアクセントに。

#96C23D

#C9E265

#FFDC5D

#91DBEF

#3C3C3C

5:元気がでるイエロー

カラースキーム

イエローはパワフルです。

エクササイズや健康食品系の情報ブログに合う配色です。

アクセントカラーの淡いブルーが爽やかさを感じさせます。

#FBC60E

#FFDC5D

#FFB36B

#A9DAFF

#3C3C3C

6:元気が出るオレンジ

カラースキーム

オレンジ系も元気が出る色です。

イエローと淡いブルーとのバランスもバッチリです。

#FFB36B

#F6CAA1

#FFDE59

#A9DAFF

#3C3C3C

ブログに最適な配色パターンは実はあまりないです。

常にいろんなものの配色パターンを研究しておくと参考になります。

「サルワカ配色」からブログ配色を選ぶ

サルワカというサイトに配色パターンをプレビューできるツールのようなものがあります。

スマホ画面のイメージプレビューがでるので、具体的にイメージしやすいです。

》サルワカ配色|配色パターン見本40選

まとめ ブログの配色は心理学で考えると悩まない

ブログ初心者はブログの配色で失敗している場合が多いです。

自分の好みで適当に配色するのは危険です。

一般的に心地よい配色に設定しておけば、印象もよくなり離脱率は下がります。

結果的にアクセス数が上がり収益アップも期待できます。

WordPressブログの始め方

わーぷれ
わーぷれ

WordPressブログを始めるならConoHa WINGがおすすめです。

中の人
中の人

当ブログもConoHa WINGSANGOテーマを使用しています。

SANGOテーマの評価
総合評価
 (4.5)
ブロックエディタの使いやすさ
 (4)
高速化設定
 (4)
Google広告設定のしやすさ
 (4)
開発頻度
 (5)
お得感
 (5)

ConoHa WINGの特徴とキャンペーン

  • 初期費用無料
  • 申し込み月は無料(つまり月初に契約するとお得)
  • 独自ドメイン が2つ、永年無料
  • サーバーと独自ドメインがセットで利用できる
  • プランはベーシックがオススメ(SSD300GB・転送量目安27.0TB/月・ドメイン無制限・データベース無制限)
  • 最低3ヶ月プランから(月額1210円・税込)
  • ベーシック1年プランは月額931円(税込)
  • 人気の有料テーマが割引で買える SANGOは9,900円(税込)1,100円お得

WordPressの有料テーマ「SANGO」は、公式サイトから購入する方法と、レンタルサーバーConoHa WINGのオプションとして購入する方法の2種類があります。

SANGO公式サイトConoHa WINGで購入
11,000円(税込)9,900円(税込)1,100円お得
「BOOTH」pixiv IDが必要》ConoHa WINGで割引購入

レンタルサーバーConoHa WING キャンペーン詳細

WordPressが使いやすいレンタルサーバー ConoHa WING

  1. ConoHa WINGの評判|7つのメリットと他社にないキャンペーン
  2. 【10分で完了】ConoHaのWordPressかんたんセットアップでブログを始める手順
  3. ConoHaサーバーの料金 WINGパックと通常プランの違い
  4. ConoHa WINGの障害は多い?正直な感想とデメリット|よくあるエラー・障害
  5. ConoHa WINGパックを確実に解約できる手順をていねいに解説
  6. ConoHa WINGの割引やキャンペーンまとめ

WordPressテーマ SANGOの使い方

  1. SANGOテーマの評判レビュー|初心者におすすめのWordPress有料テーマ
  2. SANGO Gutenbergの使い方・ブロックエディタ機能のサンプル
  3. SANGOテーマのおすすめの使い方|ブログジャンルの選び方
  4. SANGOコンテンツブロックの使い方|カテゴリごとに表示を切り替える
  5. SANGOテーマの非公式カスタマイズガイド・使い方まとめ
  6. 【ブログで月3万円稼ぐ】SANGOテーマを使ってを収益ブログを作った方法
  7. SANGO・AFFINGER・SWELLの比較レビュー |買うならこれ