学習制作 01 | 架空カフェ「Café Soleil」コーポレートサイト
HTML構造の正確性、CSS設計、レスポンシブ対応を主目的にした実装課題です。
実装範囲
- トップページ構成(Hero / Concept / Menu / News / Access)
- SP向けハンバーガーメニュー
- スムーススクロール、ページトップボタン
- IntersectionObserver によるフェードイン演出
設計意図
- 見出し階層とセクション分割を明確にし、可読性を担保
- Grid と Flex の使い分けで保守しやすいレイアウトを実現
- アクセシビリティ配慮として skip link と alt を配置
改善予定
- メニュー情報の外部データ化(JSON読み込み)
- ニュースの更新運用を想定したコンポーネント化