【勝手にWEBサイトレビュー#29】動きに統一感のあるコーポレートサイト

こんにちは!

Webデザインアワードで入賞しているWebサイトのご紹介第29回です。

今回も引き続き「CSS Design Awards」または「Awwwards」の中から特に目に留まったWebサイトをご紹介していきます!

https://unisve.it/en/

今回ご紹介するのは、ヴェネチアの美術品の修復を行っているところのコーポレートサイトです。
CSS Design Awardsに入賞しています。

▼CSS Design Awards掲載ページ
https://www.cssdesignawards.com/sites/unisve/38836/

真似したいポイント

スライダーのページャーの見せ方

サイト内のスライダーのページャーがよく見かけるようなスライダーの下やコンテンツの左右の位置ではなく、片方に縦並びに置かれています。
あまり見ない位置に置いているのは面白いですし、タブレットやスマホの指で押す端末の時に片方に固まっているのは押しやすくて便利だと思いました!

ページ全体の統一感

ホバーの動きはボタン、テキストリンク、ページャーとそれぞれに別の動きを取り入れがちですが、こちらのサイトでは基本的に上下、左右にくるっと回る動きに統一されています。
統一をされていると「この動きの部分は押せる!」と直感的にわかるため真似してみたいなと思いました。

すごい!と思ったポイント

アクセス時の動画の見せ方

サイトのトップページにアクセスをすると、小さい動画とテキストが画面の中央に表示され、一定時間後に拡大して全画面表示となりその他のテキストが表示されます。
小さい動画が気になりそのまま見入ってしまう工夫だと思いました。

コンテンツ内のナビの見せ方

修復をしたものを紹介しているページは一見そのページしかないコンテンツに見えますが、FVの画像をよく見ると左下にさり気なくコンテンツ内のナビのボタンが設置されています。
探しにくさはありますが、優先度の低いページへのリンクを設置する方法としては良いと思いました。

まとめ

全体的に動きやデザインの統一感がしっかりとあるため、すっきりとしていて見やすいサイトだと思いました。
シンプルなデザインを作るときこそ統一感を意識していきたいですね!

前回のレビューはこちら!

0

関連記事

  • 2021.05.04

    【勝手にWEBサイトレビュー#32】建築とWebのデザインが調和している!ポルトガルの建築デザインスタジオのWeb……

    サイトレビュー

  • 2021.04.30

    【勝手にWEBサイトレビュー#31】映像の見せ方が多用な映像制作会社のコーポレートサイト

    サイトレビュー

  • 2021.04.23

    【勝手にWEBサイトレビュー#30】スタイリッシュかつ見やすい!ギリシャにあるオープンスペースの紹介サイト

    サイトレビュー

おすすめ記事

  • 2021.04.05

    【jQuery】jQueryのみでPC/SPの画像を切り替える方法

    JavaScript

  • 2021.02.06

    【CSS】疑似要素(before, after)に画像を表示させる方法【サイズ変更も可能】

    CSS

    HTML5

  • 2019.03.15

    【WordPress】固定ページにページネーションを効かせる方法

    WordPress

株式会社スピカデザイン

渋谷のWEB制作会社「スピカデザイン」の現役コーダー達が、WEB制作のヒントになるような情報をお届けします。

https://spiqa.design/

spiqa_design

質問・感想などはこちら!

REQUEST

ご意見、感想や記事のリクエストなど
メッセージお待ちしております!