スマートフォンサイトを表示する

  1. TOP
  2. 自分のホームページに合う色の選び方 : 第1回 色でお店・会社のイメージを伝えよう

エキスパートコラム

自分のホームページに合う色の選び方(全12回)

第1回:色でお店・会社のイメージを伝えよう

執筆:坂本 邦夫(フォルトゥナ)

2015年4月13日更新

  • このエントリーをはてなブックマークに追加

閲覧数15,459views

このコラムをPDF形式でダウンロードする

色のイメージとホームページの色が合わなければ、せっかく内容がよくできていても、訪問者は中身を読まずに去ってしまうこともあります。このコラムでは訪問者のイメージに合わせることができるように、色のイメージとその心理的な効果を説明し、色によって向いているサイトと向いていないサイトを解説していきます。

第1回目の今回は色を決めるにあたって、最初に知っておきたい点をまとめています。

みんなに受け入れられやすい色を選ぼう

ホームページの色を選ぶときには、つい好きな色を選びがちですが、それだけでいいデザインになるわけではありません。

たとえばあなたがオレンジ色を好きだったとしましょう。オレンジ色は楽しい印象を受けます。人でにぎわってほしいホームページには最適な色かもしれません。

もしあなたの運営するホームページが高原のペンションであったなら、オレンジは合う色と言えるでしょうか?ホームページへの訪問者は高原のさわやかな緑やきれいな空気を味わうことを期待してホームページを訪れたのではないでしょうか?静かな環境と落ち着いた休暇を取りたいのであれば、にぎやかな印象に見えるホームページは、訪問者の期待に応えているとは言えないでしょう。

旅行者が期待する色はどっち?

ホームページにいくら静かで落ち着いた宿と書かれていたとしても、それを理解される前に、帰られてしまうかもしれないのです。

Googleなどの検索結果からは、訪問先のホームページの画面を見ることはできず、訪問したときにはじめてその色を目にすることになります。

訪問するまでホームページの色はわからない

ホームページにおける色の最初の仕事は、訪問者を追い返さないことです。それができて、ようやく内容を読んでもらい、注文や予約・お問い合わせにつなげていくことができます。

そのためにも好きな色だけで色を決めるのではなく、訪問者が何を知りたいか、どのようなイメージを期待しているかを基準に色を選ぶようにすることが大切です。

好きな色は使ってはいけないの?

だからと言って、好きな色をまったく使ってはいけないということではありません。自分の好きな色を見ていると、気分が明るくなったり落ち着いたりすることもあります。もし色で元気が出て、ブログを更新できて、それによって帰られる以上の人を呼び集めることができれば、それでもよいという考え方もできるでしょう。

ですが、ちょっと考え方を変えてみましょう。同じ色の組み合わせであっても、使う大きさによって、受ける印象はまったく変わるのが色のおもしろいところです。

同じ色の組み合わせでも分量で印象が変わる

自分の好きな色は小さく目立つような使い方をして、大きく使うのはホームページに合った色という使い方をすることもできます。

色は大きさによって使い分けができるということもぜひ覚えておいてください。

読みやすいように色を配置しよう

もうひとつ覚えておきたいのは、どの色を使う場合であっても、けして文章や写真の邪魔をするような使い方をしてはいけないということです。あくまでも主役は文章や写真という訪問者が知りたいこと、あなたが伝えたいことなのです。

それを実現するためには実際に文章や写真が入る場所の背景は白か黒、あるいはごく薄い灰色やベージュなどの目立たない色を配置することです。この部分に強い色を置いてしまうと、その色の印象ばかりが目に入り、内容をきちんと読んでもらえないこともあります。

文章の背景に強い色を置くと読みにくくなる

この例の場合、下の鮮やかな色が大きく使われているブロックが目立っていて、目に入りやすくなっています。ところが、文章を読みやすいのは上の薄い色が背景に敷かれているブロックです。たとえ緑のイメージを強く伝えたい場合でも、文章が読みにくければ、書かれている内容の理解が進みにくくなります。

色は使い方によっては、情報を伝える邪魔になることもあるのです。

どの色を使えば伝わりやすくなるのかを考えて色を決める

色を見せるためにホームページを作ったのではないはずです。どの色を選べば、ホームページの内容がよく伝わるか、理解してもらえるかを考えていくことが色選びではもっとも大切なのです。そのことを頭の片隅において忘れないようにしてください。

次回からは赤・黄・緑・青・白・黒・ピンク・オレンジ・茶・紫・灰の11色の持つイメージや効果、与える印象やその色に合う業種や合わない業種などを解説していきます。

色を考える基本となる11色

  • このエントリーをはてなブックマークに追加
このコラムをPDF形式でダウンロードする

坂本 邦夫(さかもと・くにお)

坂本 邦夫(さかもと・くにお)

カラー&Webデザイン フォルトゥナ 代表
http://www.color-fortuna.com/

1973年、大阪府東大阪市生まれ。関西大学文学部史学地理学科卒業。
2004年、色彩に関するノウハウをまとめたウェブサイト「基礎からわかるホームページの配色」を公開。以後、Web制作コンサルティングを主な業務としながら、書籍や雑誌などへの寄稿・セミナーなどで、ウェブにおける色彩環境の向上を使命として活動。日本色彩学会正会員。

主な著書に『ウェブ配色 決める! チカラ - 問題を解決する0からスタート ホームページ配色入門』(ワークスコーポレーション)、『ウェブ配色 コーディネートカタログ』(技術評論社)など。

ウェブデザイン&配色の見本帳

  • 「はじめてWEB」でホームページをはじめよう!
  • Jimdoリメイク | プロがあなたのホームページを50,000円(税抜)でリニューアル!
  • 問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール
  • 文具、通信、オフィスのことなら何でもお任せ!まとめてオフィス

ホームページを作るのがはじめてのかたはまずこちらをご覧ください

コラム週間アクセスランキング[期間:2017/6/11~2017/6/17]

おすすめコンテンツ

はじめてWEBおすすめ本

創業・経営のお役立ち情報

  • ソウギョウノート

    飲食・小売・サービス業の開業スケジュールから、融資申込に必要な書類までをカンタン作成

  • 経理通信

    経営者と経理ご担当者必見!中小企業・小規模事業者のための経理サポートサイト

  • まとめてオフィス

    文具、通信、オフィスのことなら何でもお任せ

  • フリーコールS

    問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール

  • auオフィスナンバー

    事務所開設するなら固定電話番号で信頼アップ
    今ならキャンペーン実施中!