Webデザインで避けるべき色

公開: 2016-09-15

広告はトリッキーなビジネスであり、それはすべてあなたが自分自身をどのように提示するかに依存します。色は、ブランド、商品、またはサービスをどれだけうまく宣伝するかを決定する広告の中心です。そのため、すべての製品にはさまざまな形式の広告が必要であるため、ターゲットオーディエンスの注目を集めるために、適切な色調を使用することが今日のビジネスに不可欠になっています。

あなたがあなたのウェブデザインにおける色の選択の基礎を学ぶことに目を向けているならば、この記事はあなたがそれを正しくする方法についてのあなたの知識を増やすのを助けるでしょう。適切な配色は、広告キャンペーンが成功するかどうかを決定する要因になる可能性があるため、完璧な組み合わせを実行するのは簡単な作業ではありません。

配色の重要性

配色の力は過小評価されるべきではありません。適切な露出が与えられれば、それを利用して、あらゆるWebデザインで最大の強みになることができます。クリエイティブに使用すれば、最もシンプルな色でも、ターゲットオーディエンスの心と心をかき立てて注目を集めるように配置できます。色相の適切な組み合わせを利用する配色は、宣伝する能力を高めるだけでなく、ユーザーがWebサイトで平均的に費やす時間を改善します。

ただし、間違った配色を選択すると、控えめに言っても悲惨な結果になる可能性があり、その大きさやテーブルに何をもたらすかに関係なく、製品やサービスを溺れさせる可能性があります。一部の広告主は、ターゲットオーディエンスの注意を引くためにブランドを表示するために派手な色を選択します。彼らは頭を彼らの方向に向けることに成功するかもしれませんが、聴衆は最終的に長距離への興味を失うでしょう。設計者は、顧客の注意をそらし、商品の品質の低さを隠すためにのみこれを行います。これは最終的に、ビジネスのブランドイメージと評判を損なうことになります。

この記事では、オンライン広告で避けるべき配色の種類について説明します。私たちのチームは、あなたが試すための代替方法とともに、「NOTTO」のリストをまとめました。

1つの色を使用する

Webサイト全体を表す色が1つしかないため、ターゲットオーディエンスにとっては無味で面白くありません。より適切な配色で開発された次のサイトに移動する前に、視聴者がそれをスキミングしようとする可能性はほとんどありません。

これを試して：

それに応じて配色を調整することは、ウェブサイトの重要な側面に注意を引くことができるプロのデザインを確実にするための重要なタスクです。ボタン、サブタイトル、引用、ハイパーリンクなどの要素には、それらの重要性を強調するために、それに応じて色を付ける必要があります。

Wrongsの色を選ぶ

ウェブデザインに間違った色を選択すると、マガジンラックで無視されるか、一目で販売されるかの違いを意味する可能性があります。販売する商品や宣伝するサービスがあるウェブサイトの場合、商品の外観やサービスの哲学的特性から色相を簡単に選択できます。いずれにせよ、あなたが提供しているものであなたのウェブサイトの深遠な表現は、ユーザーとのつながりを構築するのに役立ちます。美容製品を販売するために作られたウェブデザインにネイビーブルーなどの暗い色を使用するのは残念です。

これを試して：

あなたのウェブサイトが費用のかかる大惨事に巻き込まれるのを許す前に、色彩理論を使って、製品に密接に関連している、またはその特徴をいくらか示す色相を選択してください。これにより、視聴者はWebサイトへのエンゲージメントを維持し、製品を試してみることができます。

ネオンカラー

ネオンカラーの使用はまったく禁止されていませんが、Webデザインでホーリーを祝うのはばかげているかもしれません。ネオンカラーは、明るさの強さを色合いで上げて、コントラストを際立たせることで作成されます。

彼らがファンキーで楽しいデザインになっていることは間違いありませんが、かなりの量です。テンプレートでそれらを絶え間なく使用すると、視聴者の目を引き裂く可能性がありますが、テキストがコントラストに染み出し、読みやすさが損なわれる可能性もあります。私が間違っていなければ、あなたの目的は、てんかん発作を引き起こさないように訪問者を引き込むことです。

これを試して：

ただし、本当に粘り強い場合は、ネオンカラーから不要な明るさをいつでも削除できるため、テキストが少し暗くなり、強度が弱くなります。また、テーマにネオンカラーを追加することをすでに決定している場合は、読者が簡単に見られるように、小さい要素にネオンカラーを使用するようにしてください。

振動する色

これで、色を悪い血と混ぜたり組み合わせたりすることは、訪問者の視界を意図的にぼかすようなものです。これは、彩度の高い色が相互作用し、光る動きをする「振動効果」を鳴らすときに発生します。この振動効果は、ユーザーには非常に嫌われています。

これらの鮮やかな色相を組み合わせることで、視界が煩わしくなり、視界を台無しにする残像効果が生まれます。それは、ユーザーがコンテンツを読むのを防ぐだけでなく、あなたのテキストをめちゃくちゃにすることにもなります。

これを試して：

また、振動する色を組み合わせることはお勧めしませんが、必要に応じて、2つの明るい色の間に中間色を導入して、2つの色のどちらかが暗い色になるようにするのが最善の方法です。

また、どの色が振動するかを見つける必要がある場合は、それらを並べて配置すると、次のことに気付くでしょう。

それらの間に存在する色の高彩度
カラーホイール上で補完的で180度間隔で配置
色をグレースケールに変換すると、コントラストがほとんど表示されません。

レインボーテーマ

私の意見では、色彩理論のルールに違反するものは、遅かれ早かれあなたのウェブデザインに危険を及ぼす可能性があります。だからそれに直面しましょう、虹色のウェブサイトはうまくいきません。これを読んだ直後に、頭の中に虹をテーマにしたテンプレートを作成するために、いくつのルールを削除したか想像してみてください。

虹色のウェブデザインは、型にはまらないだけでなく、誤解を招くものでもあります。あなたは何かを宣伝、宣伝、または販売したいのですが、クライアントや訪問者に虹を見せても役に立ちません。

これを試して：

ただし、3色を超えるマルチカラーのWebデザインを作成する場合は、テンプレートにカラーブロッキングまたはカードスタイルを使用してください。これにより、デザインのカラーバランスを損なうことなく、ブロックごとにカテゴリに色を割り当てることができます。

白地に明るい色

この間違いを見るたびに、顧客が興味を失い、他のWebサイトに移動する傾向があることに気付きます。明るい色の背景に対して明るい色を使用することは、パンで満たされたサンドイッチを販売することと同じです。明るい部分と暗い部分のバランスを取り、読者がWebサイトを放棄するのではなく、スムーズに検索できるように、適度な差を設定する必要があります。最新のWebデザインのトレンドでは、ヘッダー画像の使用の増加により、これが一般的な事故になっています。

これを試して：

これを回避する最善の方法は、背景色をカラーホイールのパレットと比較することです。コントラストの良さを確認することで、適切な組み合わせを簡単に区別できます。適切に組み合わせると、コンテンツとデザインが統合され、Webデザインに自然な魅力が生まれます。

詳細な背景を試す

これはおそらく、Webデザインの色に関する最も致命的な間違いです。ビジネスオーナーは、デザイナーを雇って最高の作品を制作し、ビジネスと収益をトップにするために必要なものを備えたWebサイトを構築します。しかし、それは時々物事が少しバランスを崩すところです。ウェブサイトのデザイナーは、請負業者に印象を与えるための新しい方法を常に模索しており、その追求において、背景に過剰な量の色の詳細を追加することがよくあります。一時的にはそれほど悪くはありませんが、すべての要素とコンテンツを設定してデザインが最終段階に進むと、1つの醜いテンプレートになります。

これを試して：

この問題を回避する唯一の方法は、Webデザイナーに、背景に色の詳細を追加することを控え、元の計画で新しいものがテストまたは実装されている場合はチームをループ状態に保つように指示することです。

淡い黄色と明るい青色

ほとんどのデザイナーは、ウェブサイトの背景に関しては、明るい青と淡い黄色がひどい色の選択であることをよく知っています。明るい青は強烈で、その領域に含まれる他の色に対して常に攻撃的です。淡い黄色は反応が異なり、訪問者の気分に影響を与え、他の色相を過激化させることにより、背景色の目的を無効にします。これが、決してそれらを使用しようとすべきではない理由です。

背景として明るい青

今、私はそれがウェブサイトの背景としてひどいように見えると言って明るい青色の愛好家を怒らせるつもりはありません、それはコントラストのために設定する色の良い選択ではありえない、決してそうなることはないという事実です。 1つは、明るい青が強すぎてWebサイトのコンテンツに対して設定できないこと、2つは、デザイナーがパレットの別の色相と組み合わせるためのオプションが少なすぎることです。それはそれをネオン色に近づける振動効果を持っています、そしてあなたが私が上で議論したことを読んだならば、ネオン色は大きなNOPEです！

これを試して：

あなたがあなたのウェブサイトのためにカードスタイルのデザインを持っているときは特に、あなたはより明るい青の色合いを使うことができます。それは振動効果を中和するだけでなく、背景に青い色を付ける必要性を提供します。

背景の淡い黄色

ヘッダーに少し黄色を追加し、タイトルのテキストを追加しても問題ないように見えるかもしれませんが、背景でそれを溺れさせることは、頻繁にアクセスするWebサイトとインターネット上の浮遊ゴミの違いを意味する可能性があります。それは魅力のない色合いを与えるだけでなく、クライアントに対するビジネスの味の悪さを反映しています。黄色は、聴衆の中で幸福と歓喜のメモを打つための感傷的な重要性を持っています。したがって、視点なしでそれを使用すると、コストと顧客の損失の点であなたのウェブサイトに不可逆的に損害を与える可能性があります。

これを試して：

ブラウン、ダークレッド、オレンジのいずれかで使用すると、レトロな外観に火をつけ、後で他のインスタンスでも使用できます。黄色がかった白い背景は、オレンジなどのヘッダーとフッターに適切な色を組み合わせると、訪問者を驚かせる可能性があります。

カラーマッチングツールを無視する

ただし、色の計画は簡単な作業ではありません。顧客を引き付けるために色の完璧な組み合わせを着陸させることは、口で言うほど簡単ではありません。これは、混色についての深い知識と、どの組み合わせが聴衆から好ましい反応を引き出すかについての深い知識を持っていることは、非常に少数の人々が受け入れるようになる芸術であるためです。これは試行錯誤の方法に大きく依存することにつながり、広告にとって非常に危険です。 1つのミスで、キャンペーン全体が失敗する可能性があります。

幸いなことに、このカラースキームの障壁を克服するソリューションがあります。これは、この分野のベテランに匹敵する結果とともに、さまざまな色を組み合わせるために構築されたカラーマッチングツールの形で現れます。

これを試して：

Adobe Color CCツールなどのカラーマッチングツールは、ドミナントカラーを選択したときにアクセントカラーを選択する選択プロセスを簡素化するために開発されました。ツールは複雑に見えるかもしれませんが、実際にはシンプルで効果的なように設計されています。

カラーマッチングツールには、次のようなカラースキームを簡素化するオプションが備わっています。

アクセントカラーを選択するためのドミナントカラーの選択
アクセントカラーを選択する写真の選択

アクセントカラーの重要性

Webページの重要な情報は、アクセントカラーを使用して強調表示し、重要性を示すことができます。それらは、ハイパーリンクから、視聴者の注意を引きたいWebページ上の他のコンテンツにまで及ぶ可能性があります。アクセントカラーの数が増えるとWebサイトの訪問者が混乱するため、1つまたは2つのアクセントカラーを使用することをお勧めします。

結論

色はウェブサイトにドレスコードと魅力を与える上で重要な役割を果たしますが、ビジネスを成功させるには、デザインテンプレートで色を正しく使用することが不可欠です。あなたの側に正しい色合いがなければ、あなたのウェブサイトは笑い株になるだけでなく、費用のかかる失望にもなります。