WebGallery

Webデザインの初心者がスマートフォン対応しているWebサイトを淡々と紹介していくサイトギャラリーです。

*

背景を白の透明度を変えたグラデーションにすることで、爽やかな印象に

   

名称未設定 1

東京都港区にあるカフェ「Thrush Cafe」のホームページです。

トップページはスクロールをなくし、写真を画面いっぱいに表示させたとてもシンプルな構造になっています。画面上部にあるメニューは背景色を薄くすることで写真の邪魔になることはなく、メインビジュアルの写真を目立たせています。

他のページに移動すると、内容がふわっと浮き出るように出てくるアニメーションがデザインと合って落ち着いた感じになります。タイトル部分の背景を白の透明度を変えたグラデーションにすることで、爽やかな印象になります。また、文字を細くし、内容ごとの余白を大きく取ることでコンテンツを目立たせています。

内容が切り替わる時に横幅いっぱいに写真が配置されているのもいいですね!写真の位置を左右で変えたり、英語の文章を下につけたり、まるで雑誌を見ているようなデザインです。

 - 写真で表現 ,

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

左側にスライダー、右側にコンテンツのレイアウトでデザインされた花火大会のサイト2選!

あっという間に6月も中旬ですねー! 今回は、少し先ですが8月に開催される花火大会 …

左側に交通アクセスや最新情報を掲載して情報を伝わりやすくする

滋賀県大津市にある食事処「洗心寮」のホームページです。 全体的に文章が縦書きで背 …

幻想的な空間のファーストビューが綺麗なイベントサイトがおしゃれ!

2017年7月8日の土曜日から10月1日の日曜日まで、東京都品川区にある「アクア …

思わず家を買いたくなる不動産屋さん

岡山県岡山市にある住宅建設業「昭和住宅岡山支店」のホームページです。 緑を基調と …

手描きのようなアイコンで視認性だけでなく、見た目にも可愛らしさを

東京都中央区新川にある和菓子屋「翠江堂(すいこうどう)」のホームページです。 左 …

ヘッダーに固定された屋根と黒い背景で奥行きを出す

群馬県前橋市にある料理店「登利平」のホームページです。 ヘッダー上部にある屋根が …

文字間や行間をあけて見た目をすっきりさせることで、文章を読みやすくする

愛知県名古屋市にある「名古屋外国語大学」の受験生サイトです。 写真を多様に使い、 …

北海道にあるホテルのサイトが、写真を使ったデザインでオシャレ!

北海道亀田郡七飯町にあるホテル「大沼鶴雅オーベルジュ エプイ」のホームページです …

写真をたくさん使って会場の様子を伝えているイベントサイト

東京都千代田区にある東京国際フォーラムで開催される舞曲の祭典「ラ・フォル・ジュル …

ワンちゃん・ネコちゃんをメインに作られたサイトが、どれもオシャレで可愛い!

今年でうちの愛猫も2歳になるのですが、大きくなるのは早いですね… 大きくなっても …