ブログのデザインと色について解説！第三者に愛される「おしゃれなブログ」を作ろう！

この記事を訪れたあなたはこのような悩みを持っていませんか？

ブログのデザインはサイトを立ち上げた時だけでなく、サイトを運営しながら周りのサイトをみて、

と迷いが生じるものです。

ですが、他のサイトと自分のサイトを比べながら、一つずつ改善していくことで、負けないおしゃれなサイトを作ることが可能です。

ブログのデザインは第三者が見て信頼が持てるかが大切！

ブログに求められるデザインとは「第三者が見てどう感じるのか」が大切です。

趣味ブログであり、収益も不要であれば、この限りではありませんが、収益を少しでも求めるのであれば、ユーザーファーストにしなければいけません。

自分のサイトのテーマとペルソナを明確にし「使いやすくて、伝えたいことが正確に伝わる」ことを第一にデザインを行いましょう。

商用目的のブログであれば第三者の意見を聞くこと

特に商用目的であるブログに関しては、第三者の意見を聞くようにしましょう。

友人でも、家族でも、彼氏彼女でも構いません。

と聞いて、客観的なアドバイスをもらって改善することが大切です。

ブログのメインテーマ色は何が良いの？

サイトの色はサイトの雰囲気が大きく変わる重要事項です。ほとんどのサイトは「これから紹介する色」と「白色」の組み合わせが良いです。

色によって第三者に与えるイメージについて解説していきます。

① グレー・ネイビー

与える印象 心理効果

控えめの上品さ、知性、清潔さ、誠実さ、落ち着きなど

特にネイビーは統計学上、最も日本人が好む色合いです。

② 青色

与える印象 心理効果

集中力を高める、冷静にさせる、リラックスさせる、涼しさを感じる 誠実さ、真面目さ、寂しさを与える、気品がある

青白の組み合わせは、ブログテーマ「SANGO」が最も有名であり、人気があります。

無難に行くなら間違いない組み合わせです。

③ 白色・黒色

白色が与える印象 心理効果	清潔さ、純粋さ、シンプル、新しさ
黒色が与える印象 心理効果	高級感、重厚感、スタイリッシュ、シンプル、圧倒的な存在感、暗さ

白黒の組み合わせもシンプルでかっこいいおしゃれなブログになります。

高級感を出したい時などにもおすすめです。

④ オレンジ

与える印象 心理効果

暖かさ、元気、フレンドリー、カジュアルさ、フランクさ、健康的

オレンジ色のサイトであれば「ヒトデブログ」が有名ですね。心理的にも印象の良い組み合わせです。

⑤ 緑色

与える印象 心理効果

リラックス、目を休める、緊張を抑える、環境にやさしい エコ、自然的、保守的

緑色白の組み合わせは競合サイトが少ない割には良い組み合わせです。

⑥ 赤色

与える印象 心理効果

興奮する、情熱的、やる気を出す、エネルギーに溢れる、 怒り、生命力に溢れる、熱さ、暖かさ、怒りなど

赤白の組み合わせが意外と良く、あまり見かけないテーマ色である為、かなり目立ちます。ただし、赤の配色は少なめにした方が良いです。

周りと差別化したい場合に使用するのも手です。

⑦ 黄色

与える印象 心理効果

注目させる、活力を与える、明るさ、活動的にさせる、陽気さ、アクティブさ、緊張を与える

黄色白の組み合わせは、競合サイトを見ても少ない傾向にあります。希少性は高いですが、テーマによっては合わない可能性もあります。試行錯誤やってみましょう。

⑧ 紫色

与える印象 心理効果

上品さ、神秘的、アーティスティック、感覚を敏感にさせる、妖しさ、不気味さ

かなりマニアックな色です。うまく紫色を使うとオシャレに見えます。占いなどのサイトでは見かけますが、個人ブログではほぼ見かけません…。

まとめ

ブログのデザインをおしゃれにするコツ9選

なんとなく色について理解したところで、ブログのデザインをおしゃれにするコツを9つ紹介していきます。

基本的には、あなたが「このブログ見やすいな。」と感じたサイトを真似るのが良いです。

① デザイン・色は統一すること

デザインは基本的に統一すると良いです。

あくまで個人的な主観ですが、サイトのテーマカラーで使用する色は2色、補完的に使用するもので1〜3色あれば良いと考えます。

あまりにカラフルにしてしまうと、読み手の目が疲れてしまいます。

サイトテーマカラーは好きな色と白の2色の組み合わせ、表やボタンなど部分的に使用するもので1色〜3色あれば十分です。

人気のあるブログのほとんどは、目が疲れないシンプルなブログが多いはずです。

色を考える必要があるもの
見出し	サイトテーマと合わせるのが基本 当テーマは「水色」
表	サイトテーマと合わせるか、グレーか黒 当テーマは「水色 or グレー」
ボタン	目立たせる為に、サイトテーマと別の色を使うのが良い ボタンは統計上、オレンジまたは赤色が最もCVRが高い 当テーマは「赤とオレンジのグラデーション」
枠線	自由 当テーマは「ピンク」「青色」「緑色」
文字色	赤文字と黒文字と黄色下線の使い分けが最も人気 当テーマも同上

② 画像を適切なサイズで使用する

ブログでは基本的にアイキャッチ画像以外にも使用した方が良いです。場合によりますが、見出し(h2)の下は画像があった方が良いです。

文章だけのブログは目が疲れますので、読み手の目を休める意味でも入れるようにした方が無難です。

③ 本文の文字は拡大しない

本文の文字の大きさは統一した方が綺麗です。

このように部分的に大きくしてしまうと、違和感が生じてしまい、読みづらくなってしまいます。

④ 枠線・箇条書き・表を使用する

ブログはだらだら書き続けるより、まとめられる内容は、枠線・箇条書き・表があると一目で伝えたい内容が伝わるので便利です。

私が第三者に伝える上で、「分かりにくいな。」と感じる内容であれば必ず使用するようにしています。

雑記ブログ	ジャンルに拘らず、好きな内容を書いていくブログのこと
特化ブログ	特定のジャンルに絞って書いていくブログのこと

上記のように、枠線、箇条書き、表があるだけで、非常に分かりやすくなり、サイトの信頼性も向上します。

⑤ 漢字・ひらがな・数字のバランスをよくする

本文を書いていく上で下記のように、「ひらがな」が続くと読みづらくなります。

適度に漢字や数字を入れることが大切です。

どうしても「ひらがな」が続く場合、カギカッコなどを使用すると分かりやすくなります。

⑥ 吹き出しを使用する

吹き出しは他のブログと差別化できる内容です。

吹き出しがあるだけで、サイトがとても見やすくなります。

ただし、吹き出しが多すぎると、スマホで文章が読みづらくなるので、使いすぎないように注意しましょう。

⑦ 改行後の行間を調整する

文章が長くなると、ダラダラ書いている本文は非常に見づらくなります。

適度に改行や行間を調整すると見やすくなるので、試してみてください。

⑧ 表記ゆれは原則避ける

文章の中で表記が統一されていないことを「表記ゆれ」と言います。

例えば下記の内容です。

読者はあなた以上にブログをしっかり見ているので、違和感に感じることが多いです。

⑨ 有料のWordPress(ワードプレス)テーマを使用する

ブログはデザインの自由度が高いWordPress(ワードプレス)が最も良いですが、おしゃれなブログを作るなら、有料テーマを検討した方が良いです。

無料ブログと比べ、文字や見出しの装飾、枠線、ボタンなど、最初から装備されていることが多いので、初心者でもおしゃれなブログを作りやすいです。

ブログのデザインと色 まとめ

いかがでしたか？

ブログのデザインと色について詳しく解説してきました。

これまでの内容をまとめると

上記のようになりました。