WebGallery

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

*

コンテンツ毎にスクロールボタンを配置し、移動しやすく

   

名称未設定 1

高知県にある「サイバラ建設株式会社」のホームページです。

まず、中央に配置されたスクロールボタンはコンテンツ部分に移動してくれます。ボタンが出現する時に右からスライドされるのが癖になります。縦長な構成だと面倒なスクロールも、こうしてボタンが配置されているととても便利ですね。スクロールされる時だけオリジナルのスクロールバーが表示されるのも、こだわりを感じます。

施工例を掲載している部分では、画像にマウスオーバーさせると、建物の名前が表示されるようになっています。ジャンルごとに閲覧することも出来るので、施工例が増えてもレイアウトが変わることなく更新できるので、参考になります。動きも滑らかなので、ついついボタンを押してしまいますね。

 - 動きで表現

Message

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

  関連記事

浴衣の色合いや金魚を使って清涼感を出した「鈴乃屋ゆかたコレクション2018」のサイトが綺麗!

鈴乃屋ゆかたコレクション2018「2018 YUKATA COLLECTION」 …

カラコンの色味を背景で表現したサイトがとにかくオシャレ!「PLAY / UP(プレイアップ)」

カラーコンタクト「PLAY / UP」のホームページです。 丸ドットで作られた背 …

今後の参考に!スタイリッシュなアニメーション効果を使ったサイトをご紹介!

コーディングをしているときに「どんなアニメーションをつけようか」と考えるのが1つ …

昼間とは違う雰囲気を演出した八景島シーパラダイスの「ナイトアクアリウム」

2016年の11月19日から2017年の2月28日まで開催している「音と光と映像 …

特殊なアニメーションを使って展示された作品を紹介している美術展のサイトが、ユニークな動きで面白い!

2018年の4月14日(土)から7月8日(日)まで、東京都美術館で開催されている …

パララックス効果を使ったデザインの、建設会社のサイトがカッコいい!

熊本県熊本市にある建設会社「快建設」のホームページです。 全体のレイアウトがとて …

動きのあるグローバルナビでサイトの雰囲気を暖かくする

秋田市にある写真館「岩田写真館」のホームページです。このサイトは何といってもグロ …

ロゴマークの表示を統一することで、ページにアクセントをつける

福岡県福岡市にある「がんこクリニック」のホームページです。 まず初めに、画面いっ …

ついついボタンを押したくなる「伊勢丹新宿店 食品フロアのツボ」

伊勢丹新宿店の食品フロアガイド「伊勢丹新宿店 食品フロアのツボ」のホームページで …

曲に合わせて鍵盤が動く「MAP」

2015年の7月に販売されたgroup_inouのアルバム「MAP」というアルバ …