架空のWebサービスサイト
ランディングページ
制作概要
学習で制作した架空のWebサービスのLPです。
| 担当範囲 | コーディング |
|---|---|
| 制作期間 | 6日 |
| 使用ツール | HTML、CSS、jQuery、Sass、Gulp |
| 依頼者 | - |
| サイトURL | https://www.hassakuworks.com/work05/ |
※デモサイトのユーザー名:hassaku、パスワード:hassaku
サイトの概要
学習で制作した架空のWebサービスのLPです。FLOCSSで構築し、保守性の高い・維持管理のしやすいサイト設計を意識して制作しました。
デザインの指示により、全体を通じてアニメーションは付与せずシンプルな仕上がりとなっております。
実装機能
▼ハンバーガーメニューの実装
スマートフォンサイズになると、右上のメニューがハンバーガーメニューに切り替わります。
▼ホバーアクションの実装
ボタンの上にマウスを合わせると、ボタンデザインが切り替わります。全体を通してシンプルな動きとなるようまとめました。