Webの世界の技術的な進歩とともに、世界中でクールなデザインのホームページがたくさん生まれています。一方で、日本人Webデザイナーだからこそ得意とする分野があります。

それが、"和"のテイストを取り入れたホームページです。

今回は、日本的でどこか懐かしいレトロな雰囲気を醸し出すサイトをまとめました。

"和"のテイストを取り入れたホームページ15選

1.Donguri Consulting

01_Donguri_Consulting.png
http://www.don-guri.com/doncon/
東京のデザインコンサルティングファーム「Donguri Consulting」の企業ページです。
『日本人の戦い方』をテーマに、戦国の合戦を彷彿させるアニメーションを視差効果(パララックスエフェクト)とともに楽しむことができます。

2.kie nakazawa

02_kie_nakazawa.png
http://www.kienoe.com
イラストレーター・絵描きの中澤季絵さんのポートフォリオサイトでは、自身の作品がスクロールするごとに、水彩で描いているかのように現れます。
著作権の文言やソーシャルメディアの配置も、全体性の中で収まっています。

3.HOSHINOYA

03_HOSHINOYA.png
http://hoshinoya.com
星野リゾートの中でも圧倒的非日常感を追求した日本発のラグジュアリーホテル「星のや」。
こちらのホームページでは、動画や写真を使って日本人の心を楽しませてくれます。
『軽井沢』や『富士』など、それぞれのリゾートの横には、リゾートアイデンティティを示すロゴマークが切り絵のようになっています。

4.東京 日本橋

04_東京_日本橋.png
http://nihombashi-tokyo.com/jp/
『日本文化のいまとむかしを体験できるまち』というキャッチコピーで、東京・日本橋の良さを紹介する、コンセプトのホームページです。
ホームページ全面を使ったフェードで切り替わる背景画像はややコントラストを落とし、ロゴ文字や説明文が読みやすいように工夫されています。
ページ下部には切り絵を想像させる白い絵がアニメーションで動き、見ている人を退屈させません。
一方、その他のページでは、メニューがトップで固定配置されており、背景画像も和紙のような素材に変わります。

5.さかした製菓

05_さかした製菓.png
http://wagasi-sakasita.jp
福岡県宗像市の老舗菓子処「さかした」の企業ページでは、和菓子がフェードで次々と現れます。
メニューが縦書きで配置されているのも、日本語のページならではです。
店主の坂下長男さんの挨拶ページでは、自身のあいさつの最後に『印鑑』を押したような画像も付されています。

6.株式会社かじせ 建築事業部

06_株式会社かじせ_建築事業部.png
http://kajise.com/architect/
株式会社かじせの建築事業部のホームページでは、エンジの色合いが引き立つサイトの作りになっています。
背景は、和紙のような素材を白と薄いグレーで使い分けています。「創業85年の築き上げた信頼と実績」というコンセプトが、ホームページにも体現されています。

7.西尾維新オフィシャルサイト

07_西尾維新オフィシャルサイト.png
http://ni.siois.in
小説家・西尾維新さんの公式ホームページでは、原稿用紙に文字が入力されるようなアニメーションが飛び込んできます。
ハンバーガーメニューやロゴデザインの位置も下部に配置されており、かなりユニークな作りとなっています。

8.堺菊守

08_堺菊守.png
http://chouyou.kikumori.co.jp
600年の伝統を誇る本職用包丁。
その歴史を現在に伝え、今年で創業90年を迎える「堺菊守」の包丁ブランドの紹介するページです。
余計な装飾はせず、写真を引き立たせる作りになっています。

9.BE PROUD

09_BE_PROUD.png
http://www.beproud.asia
歯科医院に特化したホームページ制作を専門としているクリエイティブカンパニー「BE PROUD」の企業ページでは、筆で描いた戦国の将軍がアニメーションで動き出します。筆のレタッチを活かしつつ、「BE PROUD」というロゴやキャッチコピーには明朝ではなくゴシックが使われており、伝統を大切にしつつも先進的な技術も兼ね備えていることが印象付けられています。

10.伊藤久右衛門

10_伊藤久右衛門.png
http://www.itohkyuemon.co.jp/
京都は宇治にあるお茶屋「伊藤久右衛門」のホームページでは、江戸時代からの伝統を引き継いだ懐かしい雰囲気のデザインになっています。和的な茶色の色も活かしながら、お茶屋らしく深緑も引き立てています。商品紹介ページでは、ヒーローイメージとしてぜんざいに抹茶シロップをかけるシネマトグラフが使われており、食欲をそそります。

11.京都 おだしのうね乃

11_京都_おだしのうね乃.png
http://odashi.com
京都の無添加おだし「うね乃」の企業ページです。こちらのページでも、背景にコントラストを落とした写真が全面に広がり、フェードでおだしをとる様子が切り替わります。カラムの使い方も独特です。

12.SAKUZAN

12_SAKUZAN.png
http://www.sakuzan.co.jp
岐阜県土岐市に工房を構える、美濃焼のSAKUZANの企業ページでは、プロダクトの和的なよさを写真で引き立てながらも、あえてトップメニューをイタリックの英語表記で並列しています。美濃焼の写真には、お皿の上にエクレアや苺のムースなども飾られており、現代の生活にもマッチする美濃焼の良さが伝わってきます。

13.振袖新作コレクション

13_振袖新作コレクション.png
http://www.suzunoya.com/furisode/
北海道から九州まで、日本全国展開している鈴乃屋の振袖紹介ページです。振袖といえば、成人式に女の子が着る『晴れ着』ということもあり、ターゲットに合ったビビッドなピンクを和的なレイアウトとともに使用しています。まるでティーンズ雑誌で振袖を選んでいるかのような感覚になります。

14.高野山真言宗総本山 金剛峰寺

14_高野山真言宗総本山_金剛峰寺.png
http://www.koyasan.or.jp
小学校の歴史の教科書にも空海のくだりで登場する、高野山真言宗総本山の「金剛峰寺」のサイトは、なんと英語とのコラボレーションでカッコいいエフェクトをふんだんに使用しています。動画も効果的に使用しています。

15.清水へ参る道

15_清水へ参る道.png
http://feel.kiyomizudera.or.jp
京都・清水寺の特設サイト「清水へ参る道」です。冒頭の画像のフェードトグルや、鈴虫の鳴き声などを見ると、今すぐにでも京都に行きたくなる気持ちが抑えられなくなります。写真もあえてお昼時ではなく、夕暮れや朝焼けの写真が多く、写真の見せ方も非常に参考になります。

まとめ

和のカラーを取り入れたり、写真を活かしたり、明朝体を取り入れることで、日本のレトロな雰囲気を醸し出す懐かしいデザインのサイトをまとめました。余計な装飾がなく、「洗練された」シンプルなイメージのサイトが多く、ピックアップした15サイトいずれも印象的なものばかりでした。

今後、ホームページを制作する際、ご紹介した15サイトを参考に、ぜひ和のテイストを取り入れてみてはいかがでしょうか。