おしゃれなブログにしたいけど、どうしたらいいの～？！
アイキャッチがごちゃごちゃしてるんだけど…
こんにちは、管理人のゆきママ（@yukimama_345）です。
おしゃれなブログ運営を夢みている、おしゃれブロガーのタマゴです！
時々DM等で相談を頂くことがあるのですが、冒頭のような「おしゃれなブログにしたい」「アイキャッチが上手く作れない」といったお悩み、あるあるですよね。
デザイン初心者の私ですが、ブログデザインはそこそこ褒めて頂けています。（…勘違いじゃないよね？笑）
そこで、今回は誰でも簡単におしゃれなブログにできるコツをご紹介します。
一部のおしゃれブロガーさんにご協力いただき、実際のブログを例として紹介しながら解説していきます。
実例付きはありがたい！
おしゃれブロガーの皆様。突然のオファーにも関わらず掲載を快諾頂き、ありがとうございました♪
- おしゃれなブログ作りのコツ
- 色の選び方
- 実際のおしゃれブログのデザイン（真似しちゃおう！）
- 無料テーマでもおしゃれブログにできる実例
- アイキャッチ作りのコツ
※完全に自己流なので、絶対にオシャレになる保証はしないよ！笑
おしゃれなブログを作るにはどうしたら良い？
おしゃれなブログを作りたい。これは総じて皆が思う願望じゃないでしょうか。
それなのに、試行錯誤しているうちに、おしゃれだけど雰囲気がしっくりこなかったり、アイキャッチのテイストがバラバラになったり、
ブログ全体がゴチャゴチャ/チカチカしてしまったり、はたまた統一しすぎて寂しくなってしまったり…
おしゃれなブログを作るのは険しい道のりになりがちです。
まさにそれ。僕のブログはギラギラしているよ…
でも、コツさえ押さえておけば、誰でも簡単におしゃれに作れるんですよ♪
- テーマにあったメインカラー
- 配色の統一感
- アイキャッチの統一感
ずばり、「配色」と「統一感」。これだけ押さえておけば基本はOKです！
これだけ？！でも具体的にどういうこと…？
あくまで素人の自己流だけど、次から解説していくよー！
STEP1｜ブログのイメージ戦略に合うメインカラーを選ぶ
まずはメインカラーを選びましょう！
ブログのメインカラーはとても重要なポイントなのですが、軽視していませんか？
え、自分の好きな色使ってるけど…？
もちろん、赤が好きだから赤メイン等の選び方でも良いのですが、
作りたいブログのイメージに合った色を選択すると、ブログ訪問者が記事をすべて読まなくてもどんな内容（テイスト）のブログなのかイメージが湧きやすくなりますよ。
- 【赤】 熱い、強い、明るい、興奮
- 【ピンク】 かわいい、やさしい、ロマンチック、女性的
- 【オレンジ】 暖かい、明るい、親しみやすい
- 【茶】 落ち着いた、安心、地味、渋い
- 【黄】 希望、喜び、躍動、にぎやか
- 【緑】 安らぎ、癒し、健康、公平
- 【青】 冷静、知的、さわやか、誠実
- 【紫】 高貴、神秘的、大人、古典的
- 【白】 純粋、清潔、善、未来
- 【灰】 控えめ、悲しみ、曖昧、シック
- 【黒】 恐怖、クール、高級感、シック
上記はほんの一例ですが、色にはそれぞれイメージがあるので、
- 育児がテーマ：ピンクや黄色を使用して、女性的で可愛らしく
- 投資がテーマ：青や緑を使用して、知的で公平性を
- インテリアがテーマ：茶や灰/黒を使用して、シックで高級感を
といったようにブログのメインテーマに合った色をメインカラーにすることで、読者が安心してブログに滞在してくれるようになります。
例えば、「黒」メインの子育てブログだと、嫁姑トラブルとか産後鬱とか暗い内容が多いのかな？とミスリードしちゃうかも
なるほどね！書いてある内容にあったカラーにすると違和感がなくて、「しっくりくる」から安心するのかな
でも、投資だからピンクがダメ、ってことではないですよ。
女性が苦手としやすいテーマだからこそ敢えてピンクを選んで、女性読者に親しみやすいブログにすることもイメージ戦略です。
つまり、あなたの作りたいブログのイメージ戦略（なければメインテーマ）に合った色をメインカラーにすればOKです。
ちなみに、パパのブログは「投資」テーマだけど、「オレンジ」がメインカラー！親しみやすくて良いと思うよ！
えーたパパのインデックス投資
難しいテーマだからこそ、イラストのあったかいファミリー感もあって良いんじゃないかな？
うんうん！（ヘッダー画像の素案がママだったこと忘れてるな…笑）
STEP2｜メインカラーに合わせる色を2～3色選ぶ
おしゃれなブログにするには色の統一感も重要なポイント。
STEP1で選んだメインカラーに合わせる色を2～3色選びましょう。
ブログに使う色を3～4色に限定すると、簡単に統一感が出る！
え、たった3～4色？アイキャッチも？？
アイキャッチの色も揃えると、とてつもなくオシャレになるよ！
ミミィのところ（𝚖 𝚒 𝚖 𝚢さん）
the okaki no heya（おかきさん）
ときどきとざん（みちゃんさん）
おもちブログ（おもちさん）
アカデミアノート（りつさん）
いつ見ても美しいわ…泣ける。笑
ね！統一感があってオシャレでしょう？
写真に使われている色をアイキャッチに使用したり、アイキャッチを完全に統一すること等で色数を抑えています！
いや、これ全部、有料テーマのSWELL使ってるじゃん！！というツッコミは受け付けません（笑）SWELLのブログっておしゃれなものが多いですよね。本当に。
しかも冒頭2つはSWELLカスタマイズの神ががっつり有償で作っているので、匠の技が随所に散りばめられています。モデルも美しいので本当に眼福。このまま真似っこは素人には絶対無理だけど色使いは参考になります♪
ただ、アイキャッチを揃えるのは結構難しいし、今のブログからイメチェンするにはハードルが高いですよね。（サイト型への変更も、アイキャッチ作り直しもしんどすぎる…）
なので、ブログの色設定だけを変えるのが簡単でおすすめです。
色の設定変えるだけで良いんだね！了解！
ちょっと待って！何色を選べばいいの？！
設定変えるってどうやるの？！
大丈夫♪参考記事があるよ！
「具体的に何色にしたらいいの？」「色の合わせ方なんてわからん！」といった方は、
おすすめの配色パターンをこちらの記事の中で紹介しているので、作りたいブログのイメージに合うものを真似してみてくださいね。
WordPressでの色設定の変更方法も紹介しています。（ちなみに使用テーマはJINです）
第一印象が大事なのはブログも人も一緒。
パッと見て「あ、なんかステキ」「このブログ居心地良いわ～」と読者に思わせたら勝ちということですね！
＼ おすすめ参考書籍はこちら♪ ／
どちらもおしゃれな配色パターンが多数紹介されています。
「3色だけでセンスのいい色」はパステルカラーに強くて女性向き。
「ひと目でわかる配色デザインの基本。」は満遍なく網羅されているので、性別・年齢問わず参考にしやすいです。私はこっちの本の方が勉強になるから好き！
STEP3｜アイキャッチのテイストを合わせる
STEP3は余裕があったら是非チャレンジしてみてほしいところです。
STEP2で紹介したサイトのように、ブログ全体の統一感を出すにはアイキャッチのテイスト/色を揃えることが不可欠です。
ですが、記事テーマによってはアイキャッチのデザインを揃えづらい（例えば全部写真orイラストで統一できない等）ですし、
記事数が多ければ多いほど何が書いてあるのか、アイキャッチ内の文字や、記事のリード文を読まないと伝わりづらくなります。
統一しすぎるとぼやけてしまうんだね
そこで、おすすめなのが
- STEP2で選択した色を使う
- 色調を合わせる
- イラストか写真か、で統一する
といった3つの手法です。
と言われてもイメージできないし、いきなり実践するのは難しいですよね。
そんなときは、自分好みのおしゃれブロガーのブログを真似しちゃいましょう♪
手法1｜STEP2で選択した色を使う
一番取り入れやすいのが、STEP2で選択した色3～4色をアイキャッチに使用することです。
すみこのくらし(すみこさん）
ヘッダー画像で使用している色をアイキャッチにも使用しているので、アイキャッチのデザインが完全に揃っていなくてもブログ全体にまとまりが出ます。
レイアウトを揃えるのも、簡単に統一感が出るのでおすすめ♪
ちなみに使用テーマは無料のcocoon。
有料テーマじゃないから…ってオシャレを諦めるのは勿体ない！こんなにオシャレに作れますよ！
可愛くてポップで賑やか！子育てママブログらしい配色！
手法2｜色調を合わせた別の色を使う
紹介するモノの写真等を載せたい場合など、STEP2で選択した色だけを使うのは不可能ですよね。
そんな場合は、なるべく色調を合わせることでゴチャゴチャすることを防ぐことができますよ。
かしみやblog（かしみやさん）
メインカラーはオリーブ色、サブカラーにペールブルーを選択しているブログ。
写真を使用したアイキャッチがあるのですが、タイトル部分の背景色をベージュで統一することでまとまりを出しています。
また、イラストを使用する場合はオリーブ色とペールブルーを使いつつ、残り1～2色は色調を合わせた他の色に変えるという遊び心も！
こちらのように色調を合わせることで、カラフルなのにまとまりを出すことも可能です。
よく見るといろんな色なのに、まとまって見える不思議！
そして、先ほどの「かしみやブログ」さんと当ブログは同じ、有料テーマJINを使用しています。（配置は双子のようにそっくり！笑）
みんなほど上手くまとまってないけど、当ブログもなるべく同系色/同色調を使うよう意識しています（改めて見るとゴチャゴチャしてきたな…涙）
商品紹介記事はその商品カラーを使用するから完全一致は無理だけど、馴染ませることはできるんだね～
手法2の良いところは、ブログ全体をまとめつつも個々のアイキャッチを目立たせることができること。
当ブログのように、商品・サービスの紹介記事があるブログでは1番取り入れやすい手法だと思います。
＼ 原色カラーのプラレールを馴染ませた例 ／
＼ 馴染まず目立ちまくる例 ／
目立たせたくない場合は、合わせる色の色調を抑えるか、原色部分の面積を減らすことがポイントです。
ちなみに上記のアイキャッチのような画像の背景透過は、Canvaの有料プラン（Canva Pro）ならワンクリックで出来ますよ♪
画像加工がしやすいのは勿論、写真素材やイラスト素材も7,500万点以上と豊富！
30日間無料、解約金無しでいつでも解約できるので、proトライアルは本当におすすめ♪
しかも、有料プランを試して無料期間内に解約した場合でも、数カ月後に「30日間無料お試し」のPOP広告が出るよ！
結局一度も課金せずに合計4カ月以上、Canva Proを使っているわが家です（笑）
手法3｜イラストor写真で統一する
最後は、アイキャッチのテイストを統一する方法です。
イラスト/写真のどちらを使うかを統一し、タイトルのレイアウトを揃えると、色はバラバラでもまとまりが出ますよ。
好きなモノと北国の日々（ことりさん）
アイキャッチのタイトル部分を統一しているので、写真を使用したアイキャッチも写真集的にまとまっています。
リード文がオリーブ色なのもブログの雰囲気を優しくしていて、すっきり見せているコツですね！
そして使用テーマは無料のcocoon。有料テーマじゃなくてもオシャレに作れる良い例です♪
写真を使うとバラバラになりがちなのにスゴイ！
（旧）おかきの部屋（おかきさん）
こちらも写真を使用しているのに、まとまりが出ているブログ！そして、こちらはなんと先ほど紹介したSWELLのブログ（2つめ）の「おかきの部屋」（旧Ver）です。
旧Verはcocoon使用していましたよ。
アイキャッチの背景色をブログの背景色と同一にすることで余白を多くすることと、テキストの書体・色を統一することで、うまくまとめています。
おかきさんのコダワリの詰まった思い入れのあるサイトデザインだそうなので、旧Verも紹介させていただきました♪
リニューアル前も、余白でスッキリさせつつも個性的でオシャレ！
まとめ｜おしゃれブログのコツは「配色」「統一感」
今回は、おしゃれなブログの作り方のコツを紹介しました。
簡単にまとめると、
- テーマにあったメインカラーを選ぶ
- 配色の統一感
- アイキャッチの統一感
という鉄則を守ると簡単におしゃれなブログにすることができます。
①メインカラーを選ぶ際には、色の持つイメージを味方につけるのがおすすめ。
そして、②配色の統一感については、以下がポイントです。
ブログに使う色を3～4色に限定すると、簡単に統一感が出る！
ここまで出来たらもう十分おしゃれなブログになっているのですが、
③アイキャッチの統一感までやり切って、更なる高みをめざすのもおすすめですよ♪
実際のおしゃれブログも紹介させていただいたので、皆さんの好みのものや参考になるものがあれば嬉しいです。
ぜひ真似しちゃいましょう♪おしゃれは模倣からですね♪
あれ？終わろうとしてる？！で、僕のブログはどうしたらいいの…？
あ、覚えてた？笑
パパのブログについては、別に悪くないのですが…
原色が多いのと強調させたい気持ちが強すぎて補色（青と黄色の組み合わせなど）を使いがちなせいで、若干目がチカチカするカラーリングになっています。
ですが、その分、各アイキャッチは強調されるのでTwitter等で記事を宣伝する際は目立って良いという面も…。（パパは滅多にTwitterしないけど笑）
つまり、まぁこのままでも良いんじゃない？
めっちゃ投げやり！！おいー？！
真面目に回答すると、メインカラーのオレンジをごり押しするとクドイので（パパの選んでいるオレンジは強い色調すぎる）
アイキャッチはもう少し色調を抑えたサブカラー2～3色で統一しつつ、差し色でオレンジを使えば、まとまると思います。
もしくは、パパ好みの強いカラー同士を組み合わせるなら、
ブログ全体でパッと目に入る強い色を2～3色までに抑えて、ベースカラーは色調をぐっと落とせば色が喧嘩しないと思います。
な～んだ！ちゃんと考えてくれてるじゃん！じゃあ、そんな感じで作って？？
イヤだよ！！！だからアドバイスしたくないんだよ！笑
と、初心者なりにアドバイスしたところですが、
アイキャッチをポスターや広告と捉えると、原色を使用、補色で強調させる等の手法は全く間違ってないです。むしろ大正解。
＼ 原色でゴリ押し！目立つ！ ／
でも、ブログ全体のまとまり感を大事にしたいなら、ちょっと作り方を工夫した方が綺麗に見えますよ～！
それでは楽しいブログライフを♪
↓↓ブログを応援していただける方はぜひポチお願いします↓↓
