決め手は配色?魅せるホームページを作ろう!

公開日: : 最終更新日:2015/04/03 ホームページデザイン

000ホームページを作りたい!
原稿も用意できたし、写真も撮れた!
…さて、次はデザインについて考えてみましょう。

ホームページデザインにおいて、配色は会社のイメージを左右する重要なキーとなります。
どんな会社なのか、どういったイメージを見る人に伝えたいのか。
分かりやすく見やすい配色にすることで、興味を引き、魅せるホームページをつくることができます!

まずは
①ベースカラー
②メインカラー
③アクセントカラー
の3色を使用する配色に挑戦してみましょう。
全体の割合としては、
ベースカラー:60%、メインカラー:30%、アクセントカラー:10%、くらいの比率にすると上手くいくと言われています。basemainaccent

メインカラーは文字通り「メイン」になる色を選びます。
クールなイメージにしたいなら青系…
パッと印象に残るよう赤系…など、テーマに沿って決めても良いですね。
企業サイトの場合はコーポレートカラーをメインカラーにすると、統一されたイメージにできます。

ベースカラーはホームページで言うと背景色になります。
全体の60%を占める色なので、文字を乗せても読みやすいよう
白やクリーム色、ベージュ、グレーなど、薄い色を選びましょう。base

最後にアクセントカラーです。
これはメインカラーに選んだものと全く反対の色にすると効果的です。
お問合せボタンや資料請求ボタンなど、目立たせたいものにはアクセントカラーを使いましょう。

普段何気なく見ている他社のホームページやニュースサイトなど、
配色の視点で見てみると、いろんな発見がありそうですね。

関連記事

sp

PCサイトとどこが違う?スマホサイトのデザイン

スマホサイトのデザインとは スマートフォンが年々普及しているのは、ニュースにもなっていますよね。

記事を読む

shingou

購買意欲アップも可能!?色が与える心理効果

色というのは無意識のうちに「心理」に影響を与えているものなのだそうです。 例えば「信号」だと、

記事を読む

blog

ウェブデザインにもトレンドがある?最近の流行を見てみよう

ウェブデザインのトレンドとは ファッションやスイーツと同じように、実はウェブデザインにもトレンドが

記事を読む

aaaUAL

スマホ用ホームページに載せるべき情報とは

スマートフォン用ホームページの重要性はこのブログでも何度も強調してきましたが、これからはホームページ

記事を読む

img

ブラウザサイズからホームページを考えよう

普段使用していないパソコンを使った時やパソコンを新調した時に日々閲覧しているホームページが少し違って

記事を読む

2012110505

PC、スマホ、タブレット…最近のデバイス事情とは

ホームページを作成、運用するのに、パソコンのことだけ考えておけばよい、というのは、残念ながら間違いで

記事を読む

150123

「コーポレートカラー」って何?色に込めたい企業戦略

あなたの会社の「コーポレートカラー」は何色ですか?決まっていますか? 「コーポレートカラー」という

記事を読む

viewport

SEO対策に効くスマートフォンサイトのデザインとは?

2015年2月27日、Googleが公式に発表した「ウェブサイトがモバイルフレンドリーかどうかをラン

記事を読む

font

知っておきたい!TPOに応じたフォントの選び方

ご存知の通り、フォントにはたくさんの種類があります。 かっこいいフォント、おしゃれなフォント、スマ

記事を読む

150731

お客様を上手に導く!ランディングページの考え方

ホームページの目的は ・企業のPRのため ・ショップサイトで商品を購入してもらうため ・商談に

記事を読む

img
ブラウザサイズからホームページを考えよう

普段使用していないパソコンを使った時やパソコンを新調した時に日々閲覧し

1707
ポイントは写真映え!?instagramを活用しよう

スマートフォンが普及するとともにSNSを利用する人が増え、企業でもSN

icon
新着情報だけじゃない!CMSでコンテンツもしっかり更新!

CMSについては、こちらの投稿をご覧ください! http://www

1706
ネタ切れで困ってない?会社ブログを続ける秘訣

会社でスタッフブログをやっているのって、最近ではめずらしいことではなく

illust3684
鮮度が命のホームページ!CMSで更新しよう

ホームページは「鮮度が命」です。 常に最新の情報を掲載し、タイムラグ

→もっと見る

PAGE TOP ↑