このページの本文へ

2008年10月29日 10時57分更新

コンテンツをパワーアップ!Webサイト編集術

第28回 

ホームページの色のナヤミを解決(1)――メインカラーには「安心」と「信頼」を得る色を選ぶ

文● 朝日奈 ゆか/株式会社ユンブル 代表取締役

  • はてなブックマークに登録
  • del.icio.usに登録
  • livedoorクリップに登録
  • Buzzurlに登録
  • StumbleUponに登録
  • Google Bookmarksに登録
  • Facebookでシェア
  • Yahoo!ブックマークに登録
  • お気に入りに登録
  • 本文印刷

永遠にナヤミがつきないWebサイトの運営

 Webサイトを制作する上で何かとアタマをひねってしまうのはなぜか。それは、「正解がないから」です。正しい答えはこれだ!と悩みに対して解答があるものならそのとおりにすればいいのですが、いかんせん、無い答えを追っているわけですから、追うほどに悩みは深まるばかりです。まあ、ヨノナカのほとんどがそうですが。

 ECショップのオーナーたちに「Webサイトを作るうえでどんなことに悩みますか」と聞いてみると、「これでいいのかどうか不安」という答えが実に多く返ってきます。
 ECショップのサイト運営はそうした不安との闘いともいえるでしょう。ともすれば、サイト運営の向上という本来の目的を外れ、半ばノイローゼのようになってサイトに手を加え続けている人もいます。

 まず、「Webサイト制作とは永遠に悩み続けるもの」と思って運営にとりかかった方がよいでしょう。ほとんどの場合は、運営していていく過程で次第にブラッシュアップされていくものですが、ひとつのナヤミをクリアしても、また新たな、さらにレベルアップしたナヤミと直面することになります。

 どうしても判断に迷った場合、たとえば、「トップの画面の背景色と文字の色を2パターン作ったけれど、どちらを選んでいいのかわからない」といった具体的な悩みがあるときは、3日ほどの間を置いてから、オーナーもしくはWebサイト制作に権限がある人が、「えいっ」と決断するほかに方法はありません。
 そうして出した結果には、みなさんがこれまで見てきたこと、勉強してきたことがしっかりと反映されています。

 さて今回は、オーナーたちの具体的な悩みとしてよく聞くことのひとつ、「色使い」に関する“コツ”を伝授しましょう。

自然な色使いが訪問者の信頼を獲得する

 Webディレクターとしてデザイナーの方々に接していると、優秀なデザイナーの共通点として実感することの一つに、「色使いの巧みさ」があります。
 プロはいつも「配色って難しいわー」と口にしながら試行錯誤しているのですが、逆に言えば、色使いはデザイナーの腕の見せどころでもあるわけです。

 色にはその人のセンスや心理状態がしっかりと表れます。
Web制作の素人でも、「色の大切さ」に気付いている人が作ったサイトはやはり洗練されています。ぱっと見てダサイと感じるサイトは、デザインうんぬんよりも、色の組み合わせの相性が悪い場合が多いものです。

 Webサイト制作において、色使いは訪問者に大きな「何か」を印象付けます。
あなたのWebサイトの第一印象は、あなたが決めたメインのカラーで決まる可能性があります。
 たとえば、若い女性向きファッション雑貨を販売するショップであれば、通常は赤系やピンクなどの色を選びますね。中高年向きの高級インテリア販売なら、茶色など濃い目の渋い色を選ぶでしょう。これが逆になると、あまりにちぐはぐというものです。
 すべての色には、人間が日々の生活や習慣の中で身につけてきた「共通認識」があります。その共通認識を素直に取り入れながらイメージカラーを決めていくと、多くの人に愛されるサイトに近づくことができるでしょう。

 若いオーナーにありがちなのが、共通認識の反対に走って目立とうとすること。
 たとえば、背景色を真っ黒にして個性を出そうと試みたものの、結果的に商品も文字も判読しにくくしてしまっているケースなどはよくある失敗例です。黒はよほどスタイリッシュにキメないと、サイトを訪れた人は、その商品やショップに「黒=不気味」というイメージを感じてしまうというデータもあります。
 個性の出し方を間違ってはいけません。まずは色の共通認識を理解し、訪問者に受け入れてもらってはじめて「安心」してもらえるのです。
 訪問者に良い第一印象をあたえる色使いを選ぶことは、サイトの信頼獲得の第一歩です。つまり、扱っている商材に適していて、なおかつ訪問者が好んでくれるかどうか、自然な色かどうか。それをベースに企画、文章、デザインの面で個性を発揮していくことが、売れるWebサイトへの第一歩と言えるでしょう。
 色使いは、文章や写真、レイアウトと同様に、とても重要な要素なのです。

 次回は、具体的に色を決めて配色を考える方法についてお話しします。 

著者プロフィール

名前 朝日奈 ゆか info_email_01[アットマーク]yumble.com
※著者に直接問い合わせをする際は、お名前、会社名、サイトURLなどを明記してください。
会社 株式会社ユンブル
サイト http://www.yumble.com/

カテゴリートップへ

この連載の記事

ASCII.jp RSS2.0 配信中

Webディレクター江口明日香が行く

みんなが買ってる最新アイテムはコレだ!

VOCALOID3 スターターIA ARIA ON THE PLANETES

VOCALOID3 スターターIA ARIA ON THE PLANETES

ヤマハ

17,745円〜

24人が購入

標準HTML5タグリファレンス (WEB PROFESSIONAL)

標準HTML5タグリファレンス (WEB PROFESSIONAL)

アスキー・メディアワークス

2,205円〜

70人が購入

Google上位表示 64の法則 (WEB PROFESSIONAL)

Google上位表示 64の法則 (WEB PROFESSIONAL)

アスキー・メディアワークス

2,499円〜

69人が購入

Speck MacBook Air 13型 See Thru - Clear SPK-MBA13-SEE-CLR

Speck MacBook Air 13型 See Thru - Clear SPK-MBA13-SEE-CLR

スペックコンピュータ

4,262円〜

21人が購入

jQuery Mobile スマートフォンサイト デザイン入門 (WEB PROFESSIONAL)

jQuery Mobile スマートフォンサイト デザイン入門 (WEB PROFESSIONAL)

アスキー・メディアワークス

2,499円〜

38人が購入

メモリーカード 32GB (PCH-Z321J)

メモリーカード 32GB (PCH-Z321J)

ソニー・コンピュータエンタテインメント

7,772円〜

9人が購入

iPhone 4S/4 防指紋性・高光沢機能性フィルム PRO GUARD AF for iPhone 4S/4 / PGAF-IPH4

iPhone 4S/4 防指紋性・高光沢機能性フィルム PRO GUARD AF for iPhone 4S/4 / PGAF-IPH4

マイクロソリューション Micro Solution Inc.

60人が購入

Amazon.co.jp