おしゃれな色使いのホームページにしたら、「神社のイメージじゃない」って氏子さんに言われちゃったわ。なんでなのかしら？
今回はホームページの見た目についてまとめました。ホームページのデザインを知りたい人、神社らしいホームページにしたい人、デザインセンスに自信がない人向けに書きました。
デザインについて難しい知識はいりません。デザインはよりも色使いが重要です。色が与えるイメージを知ることによって、神社のブランド化につながります。ホームページのテーマカラーについて、色使いやデザインの参考になるホームページを紹介します。
目次にはリンクが張ってありますので、気になるところに飛ぶことができます
色はブランドを表す
ある特定の色を見ると、私たちはそれがどんな店か何の店か、または商品をイメージすることができます。何度も見ることによって「色が表すもの」を無意識で認識するようになりました。
上の色の組み合わせは大手コンビニのブランドカラーです。なんとなくわかりますよね？この色をみたらあそこのコンビニと分かるように、色とものは結ばれています。また「色彩のみからなる商標」といって組み合わせにも注意しなくてはなりません。
色が人に与えるイメージを利用する
色が人に与えるイメージがあります。下に、Canavaサイトより色から連想されるものとその色が使われる業界を表にしました。
| 色 | 色のイメージ | 業界 |
| 白 White | 誠実、純情、清浄、平和 | 健康、科学技術、医療 |
| ピンク Pink | 女性性、柔らかさ、育成 | 美容、玩具、ランジェリー |
| 赤 Red | 活動、興奮、刺激、最新 | 小売り、ヘルスケア |
| オレンジ Orenge | 興奮、活発、エネルギー、外向 | フィットネス、物流、科学技術 |
| 黄色 Yellow | 楽観、外向、フレンドリー、幸福、快活 | フィットネス、デジタル、予算 |
| 青 Blue | 能力、知性、信頼、効率性、義務、議論、コミュニケーション | 金融、ヘルスケア、科学技術、保険 |
| 黒 Black | 洗練、魅力、力、荘厳、尊厳 | ファッション、金融、自動車 |
| 紫 Purple | ランジェリー、信憑性、品質 | ランジェリー、科学技術、デザイン |
| 茶色 Brown | 耐久性、真剣、自然、土質 | 菓子、コーヒー |
| 緑 Green | 自然、安全、アウトドア | エコ、ヘルスケア、アウトドア |
表のように、色が人に与えるイメージは違います。これを利用して企業はブランディングを行っています。
たとえば、子供向けのお菓子を売りたいときに紫を使うよりも、黄色やピンクを使う方がいいでしょうし、自動車メーカーでエコをアピールしたいときは緑を効果的使うと、洗練された感じでありながら自然を破壊しないイメージを与えられます。
神社のホームページも戦略的に色を使いましょう。色のイメージは国、世代によって異なります。表を参考にしつつ自分の感覚も信じてホームページのテーマカラーを決めましょう。
・神社サイトに訪れる人にどんな印象を与えたいですか？
・あなたの神社の教えや大切にしていることはなんでしょうか？
・神社を通してどんな世界を作りたいですか？
ホームページのテーマカラーを決める
神職になじみの深い「色が表すもの」といえば、袴ではないでしょうか。袴の色が赤だったら巫女さん、緑だったら事務の方か総代さん、浅黄色だったら、紫だったら、紋がはいっていたら・・・。と、袴の色が階級や役職を表します。そのため、好きな色の袴を勝手にはいてはいけませんよね？
色にも神社に対するイメージカラーがあるはずです。的外れな色を選ばないように「和色」から選びます。
和色を選ぶ
まずは日本の伝統色 和色大辞典から選べば、大体日本的なイメージになります。ここにない色がどうしても好きな場合は、似た色をとりあえず選びます。
淡くて薄い色よりも、なるべく暗めの落ち着いた感じを選びます。例えば「藍鉄」にします。
配色サイトでイメージをつかむ
配色を勝手に選んでくれるサイトを利用して、ホームページの配色をイメージします。
ウェブ配色ツールVer.2.0が簡単で分かりやすいのでオススメします。（現在は閉鎖されました）
右の基本色と書いてあるところに「#393f4c」と入力すると、藍鉄をテーマカラーにした配色を勝手に作ってくれます。ホームページイメージの下に文字の色や背景などの色の表示があります。
色相差を右左にスライドさせると、配色のバリエーションが広がります。
ホームページのデザインを決める
デザインよりも使いやすさを優先に考える
下のサイトを参考にして頂けば、ホームページのデザインは理解できます。
最近では、ワンカラムのデザインが増えてきました。ただ、これだとパソコンで見たときに「おなかいっぱい」感があります。できたら、パソコンと端末は別のデザインがいいでしょう。
「見やすい、読みやすい」サイト作りに、気をつけて欲しいことをまとめました。
- 文字は見やすい大きさを使う
- ユニバーサルデザインの書体を使う
- 行間は広めにとる
- 全体を文字で埋めない、余白と画像を使う
- 目に優しい色使いにする
- 何回もスクロールが必要な長いページをつくらない
- 動きが多いデザインは目障りになる
- 文字の色は読みやすい色にする
- 見出しや文字の大きさを効果的に使う
ホームページは中身で勝負する
神社のホームページにセンスの良いデザインが必要かどうかといえば、必要ありません。こういうと拍子抜けかもしれませんが、それよりも神社が伝えたいことに注力するべきです。
神社のホームページのデザインで参拝しようかどうかは決まりません。それよりも、ホームページの見やすさ、読みやすさ、理解しやすさにこだわりましょう。こういうところに作り手の思いやりがでます。また、それがＳＥＯ対策にもなります。
色の参考になるサイト
「ノンデザイナーこそ押さえておきたい！グッとくるWebサイト配色パターン」
ベース、メイン、アクセントカラーとイメージしやすいです。鮮やかな配色が多いです。
「配色の見本帳」
一色を選ぶと論理的に配色にぴったりの色を教えてくれます。
「反転色と補色を求める」
シンプルです。とりあえず迷ったらこのサイトで調べるといいですよ。このサイトを見てmikimikan.comのサイトアイコンはテーマカラーと反転色で作りました。
「Colorable」
背景と文字の色を効果的に使いたいときに参考になります。「Random」をクリックして面白い組み合わせが見つかるといいですね。
「PALX」
basecolorのところにテーマカラーの数字を入力するだけで、その色に違和感なくぴったり合う色を計算してくれます。
色使いって大事ね！
色使いを変えたら、氏子さんに「センスがいいね！」と褒められたわ