「百聞は一見にしかず。」
ということわざがありますが、写真は言葉よりも伝わりやすいときもあります。
ではウェブデザインにおいてはどうでしょう。
海外デザインブログTrip Wire Magazineで、背景にフルサイズ写真を利用したウェブサイトを20個まとめたエントリー「20+ Stunning Web Sites With Full Size Photo Backgrounds」が公開されていたので、今回はご紹介します。
ページの読み込み時間などの問題もあると思いますが、デザインアイデアの参考にしてみてはいかがでしょうか。
詳細は以下から。
フルサイズ写真を利用したウェブサイト20個まとめ
カラフルな色使いでコンテンツを分けているウェブサイトデザインのひとつ。
テキスト部分が半透明に透けて見えておりクールです。
イタリア発のアパレルブランドのウェブサイトで、商品でもあるTシャツを撮影したフルサイズ写真を利用しています。
やはり半透明を使ったスタイルが主流なのでしょうか。
デザイナーさんのポートフォリオサイトのひとつで、シンプルでわかりやすいメニューが好印象。
暗くなりがちなダーク系デザインも写真を使うことでうまく表現できそうですね。
太字ヘルベチカフォントがインパクトのあるウェブデザイン。
色使いも水色を中心としたやさしい印象を与え、半透明ボックスはスタイリッシュに演出するときに参考になりそうです。
個人のソーシャルネットワーク関連をまとめたVカードのような使い方をしているシングルページ。
背景に使われている南国を連想させるトロピカルなデザインがナイス。
モノクロ写真を背景に使うことで、サイトのアクセントカラーでもあるピンク色がとてもおしゃれに魅せることができます。
他の色でも応用することができるのではないでしょうか。
大画面テレビに映し出されたような粗さを同時に表現しているウェブサイトのひとつ。
背景にインパクトがあるため、コンテンツエリアはシンプル。
イベント用フードケータリングを行っている企業サイトのひとつ。
メニュー部分に使われている水色の配色がエレガントでおしゃれな印象を与えてくれます。
個人的に配色をメモとしてエントリー。
きっと日本が好きな方なんでしょうね、背景にたたみとぞうりをレイアウトした渋いウェブサイト。
通常のホームページではコンテンツ量が少なく感じますが、写真を使うことでそれをカバーしています。
背景にレイアウトされた写真を自動的にスライドさせているユニークなアイデア。
読み込み時間に問題はありそうですが、デザイン性、オリジナル性の高いウェブサイトを作成することができますね。
雲ひとつない青空の下にそびえる雪山を撮影した透明感たっぷりなウェブサイトデザインのひとつ。
こちらは写真ではなく、動画をそのまま背景で再生させているウェブサイト。
音楽関連のウェブサイトを作成するときに参考になるかもしれませんよ。
※音がでます、ご注意ください。
ぱっと見は見づらい感じがするのですが、右下にレイアウトされているサムネイルをクリックすると、、。
こんな仕掛けが隠されていたのですね。
ファッション関連のサイとでは季節ごとにコレクションを撮影し、オンライン版カタログのような使い方もできるかもしれません。
フリーランスで活動されているウェブデザイナーさんのポートフォリオサイトなのですが、色使いがとてもポップでオシャレ。
使われているフォントも読みやすく、親しみやすい印象を与えてくれます。
こちらのウェブサイトデザインでは、写真と手書きでペイントされたデザインを合体させたユニークなサイトのひとつ。
※ 音がでます、ご注意ください。
ウクライナにあるカフェのホームページですが、とてもエレガントでオシャレな印象を与えてくれます。
写真加工において赤のコントラストを強くすることで、温かみのあるデザインとなりますね。
こちらも背景画像を大胆にスライドさせることができるウェブサイトのひとつ。
個人的に立体的にデザインされたロゴ、メニュー部分がお気に入り。
参照元サイトには今回見紹介のウェブサイトがいくつかまとめられていますので、こちらもよろしかったら一緒に合わせてどうぞ。
[参照元 : 20+ Stunning Web Sites with Full Size Photo Backgrounds – Trip Wire Magazine]