無料ホームページ工房

お問い合わせ・ご相談

ホームページの印象を左右する色の使い方、統一感を与えるトーン&マナーとは

ホームページの印象を左右する色の使い方、統一感を与えるトーン&マナーとは
初めてホームページの制作する方にとって、ホームページの印象に大きく影響する要素の一つである色を選んだり、ホームページ全体の統一感を持たせるトーン&マナーを考えることは難しいことです。基本的には、色やトーン&マナーはホームページの制作会社が取りまとめますが、基本的な知識を持っていることで、より良いホームページを作ることができます。

今回の記事を書いてる人

  • 元雑誌編集記者
  • オウンドメディアを構築
  • コンテンツマーケティング

KOZA

雑誌編集記者からWeb業界に転身。SEOの内部要因と外部要因とを踏まえたオウンドメディアを構築。CVが獲得できるコンテンツマーケティングを実践

 

ホームページで使う色は、会社のイメージやお客様に合わせて選ぶ

ホームページの印象を大きく左右するのが色です。ホームページの内容が同じでも、使われている色によって、お客様が受ける印象は全く違います。

このホームページの色使いを考えることを、配色・色彩設計といいます。色の嗜好や喚起される感情は、性別や年齢、環境になどによって異なるため、ホームページの目的やターゲットの設定に合わせて、配色・色彩設計を考えます。

ホームページの印象は、色の4つの属性でコントロールできる

色には、色の三属性と呼ばれる色相、明度、彩度と、トーン(色調)の4つの特性があります。これらの特性を理解し、コントロールすることで、意図した表現を導き出すことができます。

「自社のコーポレートカラーが青だから、ホームページ全体を青で統一したい」と、一言で言っても、4つの特性をコントロールすることで、活動的な青だったり、落ち着いた青だったりと、同じ青でもがらりと印象を変えることができるのです。

まず色相から説明します。色相とは、赤、黄、青などの色味の違いのことで、類似色同士では自然な調和が得られます。

明度は光の量で、明暗の度合いを表します。明度を変えるとイメージを明るくしたり、暗くしたりできます。

彩度は鮮やかさの度合いで、彩度が高いと力強く若々しく、低いと穏やかでシックな印象になります。

トーンは明度と再度を複合した色の調子を表します。すべての色を同じトーン内から選ぶと自然な印象になり、トーン差の無い近接するトーンで類似性を持たせると、すっきりした印象になります。

ホームページの制作会社は、依頼されたホームページの要望を踏まえながら、4つの特性を生かしたトーン選択、キーカラーの配色、グラデーションの質感や濃淡、白(余白)の配分などを決め、デザインへ落とし込んでいきます。

同じジャンルのホームページでも、色使いで印象が変わる

ホームページの目的やターゲットで、適切な色使いは異なります。ある大学のホームページでは、教育機関としての安心感や信頼感を表すために、色数を極力抑えています。

スクールカラーである青はナビゲーション部分やポイントとして使用し、白や余白を多めにとることで、文字の可読性を高め、アカデミックで上質感、清潔感のある雰囲気を醸し出しています。色数を減らすと全体的にデザイン統一が図りやすく、洗練された印象になります。

別の学校では、楽しく学べる雰囲気を醸し出すために、5色の多色使いになっています。カラフルな色使いは自然と楽しさが生まれ、好奇心を刺激する効果があります。

多色の場合は、色のバランスがポイントであり、ほかの色に干渉しない白や黒の配分が重要になります。このように教育関連のホームページだけでも、色の使い方次第で印象が異なります。

 

ホームページの制作では、トーン&マナーで統一感を整える

色使いと同じように、ホームページの印象を決める大きな要素として、トーン&マナーが挙げられます。トーン&マナーとは、広告から醸し出される雰囲気や世界観のことを言います。ホームページ全体のトーン&マナーを統一、継承することでお客様に訴求したい内容を的確にし、一貫したブランドイメージを模索できます。

ホームページの制作会社は、依頼を受けた会社の業界におけるポジション、強みを把握したうえで、ホームページのコンセプトとマッチするトーン&マナーに取りまとめます。 すでにある会社案内などの印刷物だけでなく、商品やサービスの情報、企業理念など、トーン&マナーを決めるときは、会社に関係する様々な情報を伝えましょう。似たようなコンセプトを持つ会社や、同じ商品やサービスを伝えることも、トーン&マナーを決めるヒントにつながります。

トーン&マナーの全体の方向性が定まったら、ホームページの制作会社は配色、タイポグラフィ、タイトルルール、リンクアイコン、テクスチャーなど、具体的な内容を決めていきます。ホームページの制作会社からデザインが上がってきたら、トップページだけでなく、下層のページもトーン&マナーが守られているか、確認しましょう。

会社のホームページ以外にも、採用用のホームページや、キャンペーン用のホームページの制作を依頼することがあるかと思います。そうした特設のホームページでインパクトを出したい場合は、目的やターゲットに合わせた、特化したトーン&マナーが必要になります。

 

まとめ

ホームページの制作するうえで、色使いやトーン&マナーを決めるのは、基本的にはホームページの制作会社です。しかし、決めるまでには、会社とホームページの制作会社での話し合いが必要です。よいホームページを作るために、今回の内容を参考に、色使いやトーン&マナーの方向性について、じっくり話し合ってください。どうしてこの色を選んだのか、トーン&マナーのコンセプトは何か、質問に対する答えで、ホームページの制作会社の良し悪しも見えてきます。

福岡の無料ホームページ工房がお届けする
初期制作費用無料のホームページ