Japanese style web design いろはクロス
最近空き時間を見つけては和風ウェブサイトを比較分析しています。
今回は50サイト比較して分かったメインカラーについてまとめてみます。
和風サイトに多く使用されている色は何色だろう？
今回の比較サイトについて
今回比較した和風ウェブサイトの定義ですが、ウェブサイトリンク集でカテゴリが「和風」「japanese」等のサイトをピックアップしました。
50サイトで断定づけるのは早計だとは思いますが、制作上の参考になれば幸いです。
サイトの集計結果はこちら。
和風ウェブサイトのメインカラーで最も多いのは白！
可読性を考慮すると白は使いやすい色です。美しい写真＋メインカラー白にすると、モダンでおしゃれな印象を与える事ができます。
白の和サイト事例1.神勝寺 禅と庭のミュージアム
余白をしっかり取っていてモダンな印象のサイト。お寺など日本的な建物の美しい写真を多数掲載しており、和の雰囲気が伝わります。
※画像クリックでもサイトへ遷移できます。
白の和サイト事例2.浄円寺
サイトロゴや縦書きの使い方は伝わりやすい和風表現ですが、ファーストビューに見えるアルファベットや写真の加工はモダンな雰囲気を感じます。お寺のサイトですが、白をメインに使う事により軽さを出しています。
白の和サイト事例3.ヤヱガキ酒造
日本酒のサイトは和風デザインが多く採用されています。ラベルデザインと調和させる為、サイトも和風になるのは必然なのかも。縦書きテキストが印象的なサイト。
和風ウェブサイトのメインカラーで2番目に多いのは黒、薄灰、青！
黒、薄灰、青が同数でした。黒と言っても、サイト全体に黒を使用しているサイトの他に、ナビゲーションなど目立つところに取り入れているサイトもカウントしています。サイト全体が黒の和風サイトは少なめでした。
また、後述しますが、ベースカラーに最も多いのが薄いグレーでした。その影響もあってかサイト全体を薄いグレー系の色でまとめているサイトが多く見られました。
青は、藍色がJapan blueとして知られているので、和風デザインに取り入れやすい色なのだと思います。
黒の和サイト事例1.太秦江戸酒場
黒×金の配色で、豪華さ・賑やかさを演出したサイト。
黒の和サイト事例2.ノロマ
うどん屋さんのサイト。フォント使いからも和の雰囲気を感じ取れます。
薄灰の和サイト事例1.株式会社 BE PROUD
斬新なアニメーションに水墨画風イラストで強靭な印象を与えています。
薄灰の和サイト事例2.超特撰 白鶴 天空 袋吊り 純米大吟醸 山田錦/白鶴錦ブランドサイト
縦書きテキストを効果的に取り入れているサイト。ふわっと遷移するアニメーションにより、柔らかな印象を与えています。
青の和サイト事例1.株式会社 木の屋石巻水産
青×白ですっきりとまとめてあります。各ページにオリジナリティのあるアニメーションを取り入れ、スッキリ感と親しみを感じる事ができます。
青の和サイト事例2.瓢喜
こちらも青×白のサイト。京都の料亭で、上品な和風デザインのサイト。フッターの水墨画風デザインも「和風」を感じられるポイント。
ベースカラーで最も多いのは薄灰
カラーコードで言うと若干の相違があるのですが、系統で言えば薄いグレーが圧倒的に多かったです。
日本の伝統色だと「胡粉色ごふんいろ #fffffc」、「卯の花色うのはないろ #f7fcfe」、「白磁はくじ #f8fbf8」あたりが近いです。
ベタ塗り一色のサイトもありますが、テクスチャを重ねて質感を出しているサイトも多くありました。
また、グレーの濃さによって印象が違ってくるので、サイトコンセプトによって調整すると良いと思います。
最後に
更に多くのサイトを比較したらまた紹介したいと思います。
サイト紹介系の記事、他にも沢山あるので良ければ。
コメントを残す