▼基本情報 ・URL:https://shu-web-test.sakura.ne.jp/stepbyjump/ ・GitHub:https://github.com/Take-Shu/stepbyjump.git ・デザインカンプ:Photoshop ・制作期間:5日 ▼使用技術 ・言語: HTML / CSS / Sass / JavaScript ・CSS設計: FLOCSS / BEM ・使用ライブラリ:Swiper (スライダー実装) 、GSAP (アニメーション制御) ▼実装内容 ・ローディングアニメーション ・FV画像の表示切り替え ・各セクションのフェードアニメーション ▼こだわりポイント ・初期表示速度の向上とユーザー待機時間の短縮 ・プリファレンス設定の検知と適応（視差効果の設定に応じたスクロール挙動の切り替え） ・jQueryに依存せず、バニラJavaScriptのみで全機能を実装 ・dialogタグを活用したドロワーメニューで、フォーカストラップとバックグラウンドスクロール制御を実装 ▼苦労した点 ・複雑なデザインを画像を使わず、HTML/CSSで実装 ・アクセシビリティに配慮したマークアップ ▼学び ・アクセシビリティへの理解がまだまだ足りていない現状を把握することができました。これからも学習を継続し、多様なユーザーへ平等に情報を提供できるコーダーを目指したいと思います。