■URL
https://onomichi-234533.netlify.app/
■工夫した点
・Swiper.jsの実装
-途切れなく流れ続けるループスライダーを実装
-レスポンシブに応じて表示枚数を切り替えるなどデバイス対応を工夫
-ユーザーが直感的に操作できるようナビゲーションを実装
・画像配置の工夫
-position: absolute; を用いて複雑なレイアウトを再現
-レスポンシブ時にも崩れないように調整
・フォームのバリデーション
-JavaScriptで必須入力やメール形式チェックなどを実装
・アコーディオンメニュー
-スムーズな開閉アニメーションを実装
-スマホ表示ではナビゲーションをアコーディオン形式に切替
・モーダルの実装
-画像クリックで拡大表示するモーダルをJavaScriptで実装
-背景クリックやESCキーで閉じられるようにし、操作性を向上
・その他の工夫
-Sass(SCSS)とBEM記法を活用し、保守性の高いCSS設計を実現
-画像最適化やlazy loadによるパフォーマンス改善
-meta情報・OGP設定などSEO対策も意識
■言語・ツール
HTML, CSS, Sass(SCSS), JavaScript (jQuery, Swiper.js)