WebGallery

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

*

サイト全体の装飾を抑えてコンテンツに動きをつけることでさらに魅力的なデザインに

   

名称未設定 1

KinKi Kidsのオフィシャルサイト「KinKi Kids 20th Anniversary」です。

20周年を記念した特設サイトに使用されているロゴがとてもかっこいいサイトです。
ロゴ自体はとても重みを感じるようなデザインなのですが、サイト全体の雰囲気が重くなってしまわないようにフォントや線はとてもシャープなデザインになっています。
ファーストビューで使用されているジャケット写真もピンク系のピンクから水色のグラデーションになっているので、淡く優しい印象を受けます。

下にスクロールすると、グレーの背景色に明るい茶色を使用した落ち着いた雰囲気になります。
ひし形のタイトルや、斜めに切り取られたコンテンツやボタンはサイト全体に動きが出ています。さらにタイトルにはボックスシャドウをかけることでコンテンツに奥行きが出ています。
他のページに移動するときもコンテンツが斜めに切り替わって表示されてカッコいいです!

サイト全体の装飾は抑えている分、コンテンツが表示されるときやページが切り替わるときに動きをつけることで、ひと味違ったデザインになりますね!
スマホ版ではメニュー部分も斜線を使ったデザインになっていて、さらに動きのあるサイトになっています。

 - 色で表現 , ,

  関連記事

選ばれるポイントを綺麗にまとめたホテルのサイトがオシャレでカッコいい!

福岡県北九州市にあるホテル「ステーションホテル小倉」のホームページです。 青と黄 …

「木」のイメージを大切にした注文住宅建築

愛知県津島市にある輸入住宅・注文住宅を建築している「STYLE COMPANY」 …

写真や色を使って華やかな雰囲気を表現した生花店

東京都府中市にある生花店「花智」のホームページです。 トップページの綺麗な花の写 …

美容品を販売している会社のサイトがオシャレでカッコいい!

「株式会社MEGMALE(メグマーレ)」のホームページです。 ファーストビューの …

写真や配色の白面積を多くして、清潔感を出している木々に囲まれたリハビリテーション病院

千葉県成田市にある「 成田リハビリテーション病院」のホームページです。 ファース …

記事の写真を活かしたシンプルなレイアウト

造花やドライフラワー・クリスマスグッズやディスプレイグッズを製造・販売しているメ …

豊富な情報量をコンパクトにまとめた自動車教習所のサイトが可愛い!

大阪府高槻市にある大阪府公安委員会指定校の自動車教習所「高槻自動車教習所」のホー …

サイト全体を白黒にして写真を際立たせて、さらにコンテンツを斜めに切り取って動きを演出したスイーツ屋さんがオシャレ!

パティスリー・サダハル・アオキ・パリ日本公式サイトです。 白と黒を基調とした、シ …

デニム・ジーンズブランドのサイトがカッコいい!

メンズのデニム・ジーンズを取り扱っている「BMC JEANS – B …

医療系とは思えないほどカラフルでポップなデザインのサイトが可愛くて楽しそう!

兵庫県神戸市にある医療福祉専門学校「神戸医療福祉専門学校」のホームページです。 …