営業資料でも使える配色バランス「70:25:5」の比率!勝手にお寺のホームページを診断! | 日本文化 好き やすの超易しいWEBブログ!

日本文化 好き やすの超易しいWEBブログ!

九州地域を対象にブログのカスタムデザインや、ホームページの制作をやっている会社です。「これからブログを始めたい」と思っている方には初期設定からアドバイスもさせてもらっています。ソーシャルメディアの特性を良く理解したWEBデザイナーがサポート致します。

こんにちは、福岡から日本文化を密かに広げたいと思っている、WEB制作者のヤスです。


今日の午前中はキャナルシティーで打ち合わせ!

やっぱり天気が良いと建物も映えますね^^




今日の福岡、天気も良く気持ちが良い一日でした。


さて今日は久々に、お寺のホームページを診断♪

今日診断するお寺は、京都市 東山区 本町にある「東福寺」


このお寺(東福寺)のホームページの何が良かったのかと言うと、

配色のバランスが、「70%:25%:5%」の割合でほぼ割り振られていたところです。


ホームページ画像。



配色のバランス。


ベースカラー(白)が約70%。
メインカラー(黒)が約25%。
アクセントカラー(赤茶)が約5%。



この比率何かというと、

バランスが一番良く見える法則で、

見る人にとっても分かりやすく、そして伝わりやすい配色バランスなんです。
(もちろん色の選択によっては分かりにくくなりますが・・・ あくまでもバランスのみでお考え下さい。)


実際に、

サントリーさんのWEBサイト
(白 : 薄い水色 : 水色)

アメブロさんのWEBサイト
(白 : グレー : 黄緑)


も、ほぼこのバランス(70%:25%:5%)ですし、


モノでも、

金麦(ビール)
(青 : 金 : 白)

カップヌードル
(白 : 金 : 赤)

このバランス(70%:25%:5%)です。

ほんとに様々なものに、この比率が使用されているんです。

ですから、東福寺のホームページがこのバランスで構成されていたので、
「あ~いいな~」と思い、今日の診断で紹介させて頂きました。



さっ、ここからは番外編です。

僕なりの配色バランスの使い方!



じゃ~、その配色、身近なモノで何に使うことができるのか?


僕が良く利用するのは、営業資料とプレゼン資料です。


まず、お客さんに与えたいイメージを考えます。

例えば、「安心感を持ってもらいたい」

すると、青や緑で構成します。


その時、まず考えるのはベースカラーです(70%)の部分。


基本的に、お客さんに読んでもらったり、見てもらったりすることが前提なので、

明度の高い色(白に限りなく近い色)や、淡い色(等ブログのような、柔らかく、ちょっと色がついているもの)を選びます。


そして次に、メインカラー(25%)の部分。

ここは、自分がお客さんに与えたいイメージなので、緑や青など、統一した色を使用します。


このくらいの色↓


(もちろん、緑や青もたくさん緑や青があるので、これだけじゃないですよ)



そして最後に、アクセントカラー(5%)の部分。

これは、メインカラー(25%)と補色の色を使います。

補色(ほしょく)とは、反対の色(お互いの色がお互いの色を引き立たせる色)のこと。


例えば、赤だったら緑。 青だったらオレンジぽいやつ。


そんな感じです。


ですから、
メインカラー(25%)が 青っぽく若干くらい色だったので、

ほんの少し明るい(明度を上げた)濃い赤オレンジを使用します。


資料としてまとめると、こんな感じです。


(ゴメンなさいざっくりとした作り方で・・・;)

すると、全体的に配色のバランスがとれて、且つ、伝えたいところが目立つようになります^^



っと、ちょっと話は長くなりましたが、

このバランス(70%:25%:5%)は本当に様々なところで使うことができるので、覚えておくと大変便利ですよ^^


最後まで読んで頂きありがとうございます。
日本の良き文化がもっともっと広がりますように。

今日も最後まで楽しみましょう♪



インスタグラムもやっています。
気に入ったらフォローして下さい。
yasu.ambition

ツイッターもやっています。
気に入ったらフォローして下さい。
@fanclip



やすのホームページ(fanclip)
http://www.fanclip.jp/