「儒城区文化観光」モバイルウェブレビュー
こんにちは:) アルシタウンです。
今日は役所サイトを持ってきました！
さまざまな形のアニメーション
引き立つページなので、一度レビューしてみます！
反応型
さまざまなサイズでレスポンシブタイプが機能しているようです。
width値によって壊れずに表現しようとしたようです。
反応型サイズが多ければディテールは生き残るが、
それだけ管理しにくくなる欠点があります。
大メニュー
大メニューをホバーしたとき、
3depthの構成を見ることができますが、
depthがすぐ下にリストされている形式ではありません
リストのように整理して、視覚的に各メニューの情報を
一目でわかるように製作した点が際立っています。
ハンバーガーメニュー
ハンバーガーボタンはpcとmobile上で両方露出されますが、
公開される方法は異なります。
パソコンサイズでは、ハンバーガーボタンを押したとき、
サイトマップページに進む
mobileサイズでは、ハンバーガーボタンを押したとき、
サイドメニューが公開され、depth 3まで見えるようになっています。
個人的にはサイドメニューデザインの統一が残念だと思います。
slide-active
auto-playになっていませんが、
ページをめくると地図に強調（位置表示）が変更される
形の方法をとっています。
アニメーション
ホームページで目立ったものの一つ
アニメーション効果なのに、やや硬い官公署サイトで
このようなポイントを挿入して緩和する努力が見られました。
scroll-eventを使ったアニメなのに、
その位置に達すると、穴の図形から人と吹き出しが上に
登場するアニメーションが挿入されています。
その下にも
建物の輝く効果を与えるために同じ場所に
交互に画像が出るアニメーション効果
人が走る姿を表現するために
影は下に固定され、
人だけを上下に動かせるアニメーション効果
水が揺れる姿を表現するために
波が両側に動くアニメーション効果
などサイトの生気を吹き込むための効果が目立ちました。
トップボタン
トップボタンにもアニメーション効果がありますが、
クリック後、ロケット状トップボタンが上がり、
数秒後に上に上がる様子を見ることができます。
（topボタンに待つことがあることが致命的な欠点として感じられます。）
セクションの設定
上記の反応型とつながる
部分だと思いますが、
widthの値に基づいてsectionの設定がうまくいったと感じました。
（役所のサイトは explorer 環境に使用できるようになっている必要があることがわかっています。）
explorerの使い勝手に合わないフレックスを使わず、
floatメソッドを使用したようです。
今、explorerはサービスを終了したので
flexを使用しても構いませんが、
flex, float 両方とも長所と短所があります
自分に合ったスタイルを使えばいいと思います。
以上：）アルシータウンでした~~
댓글
댓글 쓰기