このサイトは記事内に広告を含む場合があります。広告や表現について

アイキャッチ・サムネイルの注意点【カラー編】

こんにちはあるです!

今日はサムネイルを作る際にあまりおすすめしない色の組み合わせを紹介します!

あれ?なんか見づらい・・・や
なんかしっくりこない・・・

こんな場合は色味をしっかり直してあげることで解消することもあるのでぜひ参考にしてみてください!

今回は2色で例を作っていきます。少し変えるだけでおしゃれになりますよ!
ドキっとしたあなたはぜひ最後までよんで解決してくださいね!

目次

NGな組み合わせとは?

基本的にNGな組み合わせは「見づらい」です。
あまり良くないなーっていうサムネイルは大体色味が見づらくなっていて重要な文字が読みづらくなっています。

簡単な確認方法としては少し距離を話してみてください!そうすると一眼でわかりますよ!

黄色+白


この組み合わせは「明るい色」と「明るい色」なので視認性が悪くなってしまいます
意外とやりがちでよく見るのがこれですね。

使い方によってはデザインのアクセントになるんですがこの黄色の文字をメインで読ませようとしてしまうと眉間にシワを寄せながら見なければならないくらい見づらいですよね・・・

このように背景の一部として使用してあげるのであればデザインの一部としてなりたっているのでいいと思います!

ではこれの対処法をやっていきましょう!

少しオレンジに寄せてあげる。(少しマゼンタ/ピンクを入れてあげる)
そうすると色味がすこし濃くなって視認性が上がります!

そのほかにはこのように背景を引いて視認性をあげることができます。
このときに同系色を背景に引かないように注意しましょう!

グレー+黒

こんな色味選ばないよ!って思うかもしれないんですが写真を使った際に意外と使用してしまっている人が多いです!

これ、見覚え無いですか?写真が明るいので黒いのを載せるのはいいと思うんですが、その上に載せる色味が黒も文字。

こんな時の解消方は文字を白くするだけです!

全然見やすさが違うと思いませんか?

ここでも文字の色を決める時のポイントですが、明度をふたつにわけて「明るい色」には「暗い色の文字」,「暗い色」には「明るい色の文字」

これさえ押さえておけば完璧です!

オレンジ+赤

この色味に限らず同系色で組み合わせてしまうとどうしても視認性が落ちてしまいます。

その場合は同系色の色味を抜いてあげたり、白抜きにしてあげると一気に視認性が上がります!

緑+赤

この色味は俗に言うハレーションが起きてしまっています。
ハレーションを簡単に言うと目がチカチカしてしまう組み合わせです。

この場合は色味を変えてあげるか明度を変えてあげると見やすくなります!

少し見やすくなりますがハレーションの関係にある色味はできるだけ使わないようにしましょう!

見やすい色味の決め方

先ほどもちらっと話に出ていましたが基本を覚えてしまえばすごく色選びに困らなくなります!

暗い(濃い)色には明るい(薄い)色で

明るい(薄い)色には暗い(濃い)色で

これだけです!!

色に関する記事がほかにも色々ありますので是非是非見てくださいね!

この記事はARU氏の運営していた「ARULOG」より2021年8月に移管された記事です。

この記事を書いた人
ARU

ARU

デザイナー歴11年
ブロガーに寄り添うプロデザイナー
Kindleでブロガーデザイン本発売中
フォロワーが伸びるヘッダーをココナラで販売中
twitterでデザインのヒントを発信 @awdesign6


どんぐり所長のおすすめツール

どこでも、どんなデバイスでも順位チェック

ブログ記事の順位を確認していますか?どんなキーワードが上下しているのか知る事はブロガーでは必須と言えます。

ほとんどの方がダウンロード型の順位チェックツールを使用されていますが、私はコレ。「Nobilista」。クラウド型のチェックツールです。

クラウド型とは、ネット上にあるサーバーにデータが保存されている順位チェックツールです。従って、お家のパソコン以外でも情報にアクセスできちゃうんです。これが想像以上に快適で、一度体験すると戻れなくなっちゃう。詳しい記事を書いていますので是非読んでみてください。

Nobilistaの詳しい記事はこちら >

実は私、Nobilistaの公式アンバサダーをさせて頂いています。使いだしたら超気に入ってしまって、気づいたらアンバサダーになっていました。そんな私が、おすすめする「Nobilista」。今なら7日間無料でお試しができます。クレジットカードなどの情報を入れなくても試せるので、ぜひあなたにも試してほしい。

\場所を選ばない快適さを体験して/

Nobilista公式サイト

当サイト推奨 デザインツール

当サイトでは、ブログ初心者でも簡単・無料で美麗なデザインが作成できる、オンライン画像作成フォーム「Canva」を推奨しています。数万点の素材やフォントが用意されていて、選ぶだけで簡単にプロ並みのデザインを作成する事ができます。これから先、会社員の仕事でも使用する事になるかもしれないほど普及が広まっています。覚えるなら早い方がいいですよ!

当サイトのデザインは、SWELLで再現可能

私はSWELLを2年使用してきました。現在4つのサイトでSWELLを使用しています。
SWELLを使用する理由は、簡単・綺麗・速い
実際このトップページも、SWELLの標準機能だけでデザイン。
お洒落なブログを作りたいあなたにピッタリのWordPressテーマです。
私が実際に使用して実感したSWELLの特徴は以下。

  • 完全ブロックエディタ対応
  • 直感で使える操作性
  • 便利な専用ブロックを多数用意
  • お洒落なトップページが簡単に作れる
  • 最速レベルのページスピード
  • 一度購入すれば複数サイトに何度でも使用可能
  • ユーザーの利便性を考える熱意の運営者
  • SWELLを紹介すればアフィリエイト報酬が貰える(購入者のみ参加可)
  • 販売価格 ¥17,600(税込)

唯一の欠点は価格の高さ。しかしそれは、SWELLがハイクオリティだから。
そして、運営者がとびきりの対応をしてくれる必要経費。

私が実際にSWELLを使用して感じた、本音レビューはこちら

SWELLにはアフィリエイトプログラムがあり、紹介すれば利益を得ることもできます。
よく、「アフィリエイトがあるから紹介しているんでしょ。」と言われますがこれは違います。
惚れ込んだWordPressテーマに、たまたまアフィリエイトがあっただけ。
あなたもSWELLを体験すれば、きっと紹介したくなります。

\圧倒的な操作性を体験せよ/

あなたも今日からSWELLER!

トップページへ戻る

お気軽にコメントください

コメントする

このサイトは reCAPTCHA によって保護されており、Google のプライバシーポリシー および 利用規約 に適用されます。

reCaptcha の認証期間が終了しました。ページを再読み込みしてください。

目次