ホームページのデザインにおいて、非常に重要な要素を担う写真。そんな写真を上手く使って制作されたオシャレなホームページがたくさんあります。
今回は、写真の雰囲気だけでなく、レイアウトや構成などのアイデアなど、オシャレなレスポンシブデザインの参考になるホームページを5つご紹介いたします。

【目次】

Varmea（バーマン）

https://varmen.jp
東京ミッドタウンにあるワインバーVarmenのホームページです。
スクロールとともに写真と少しの文章がスムーズに流れてくるデザインは、もう一回、もう一回とスクロールを促します。写真が連続で現れることで、映像のようにお店の雰囲気を伝えています。

育てるタオル

http://sodaterutowel.com

洗うたびに空気を含んでタオルが育っていく育てるタオルのホームページです。
トップページのメニューに写真を取り入れ、ブランドの世界観と、クリックした先に記載された情報をイメージさせています。メニューとしてのクリックを促す役割と、ブランドイメージを表すイメージとしての役割を持たせた写真の使い方は、綿密に計算されたデザインです。

COCOLO

https://cocolo-gift.jp
伝統的な風呂敷を、新しいカタチで販売するCOCOLOのホームページです。
使用している写真の数が特段多いわけでもないのですが、シンプルで洗練されたデザインに大きめの美しい写真を配置することで、写真の存在感がひときわ目立っています。商品をメインに打ち出すのではなく、写真の中にさりげなく溶け込ませることで、風呂敷を実際に使用した際のイメージを強く印象付けます。

MeDu 梅花酵母

https://www.medu.jp/story
復古創新を掲げて本物の基礎化粧品を提供するMeDuのホームページです。
このホームページは、下層ページ「めづのある一日」ページの写真の使い方が秀逸です。横幅100%で表示させた写真を連続で配置し、スクロールするごとにパララックスで切り替わるデザインは、まるで一本の映画のような存在感を放っています。

前田組

https://maeda-g.co.jp
福岡県で土木工事を行う株式会社前田組のホームページです。
土木工事会社とオシャレなホームページは、どこか意外な組み合わせのように感じますが、働く男の格好良さが上手く表現されており、非常に洗練されたデザインに仕上がっています。土や傷で汚れた部分をあえてクリアな写真で見せることで、飾らない本当の姿の格好良さを非常に上手く表現しています。

今回のまとめ

スマホの普及によって、ホームページを閲覧するスピードがどんどん早くなっている現代は、写真を上手く使って「いかに視覚的に瞬時に情報を伝えるか」が重要になってきています。だらだらと文章で書くのではなく、写真を使ってユーザーが一瞬で情報を把握できるホームページが求められています。
今回ご紹介したような、レイアウトや構成などのアイデアなど、オシャレなレスポンシブデザインの参考にして、写真を上手く使ったホームページを制作してみてください。