- 制作概要 -
- 制作時間→80Hほど(1日4~5時間目安)
- 制作内容→コーディング・テスト環境へアップ
- ページ数→12ページ トップページ、ABOUT、SERVICE、WORKS、WORKS詳細、NEWS、NEWS詳細、月別ページ、カテゴリーページ、CONTACT、お問い合わせ確認ページ、お問い合わせ完了ページ
- 仕様スキル→HTML・CSS・JanaScript・WordPress
- 仕様ツール→VScode・Figma・VD・Photoshop
- 実装内容 -
Photoshop
- ロゴの作成
CSS実装
- ボタンのアニメーション
- トップページとニュースの画像のアニメーション
- ハンバーガーメニューボタン
- 下層ページのFVの画像切り替えのアニメーション
- Googleマップの埋め込み
- レスポンシブ(375px〜1440px間、どの幅サイズでも見た目の崩れがなく綺麗な表示がされるように作成いたしました)
JavaScript実装
- 縦に動くスライダー実装
- ハンバーガーメニューの開閉
- 各ページへのスムーススクロール
WordPressでの実装
- クリックすると各ページへ移動するようリンク付け
- パンくずリスト
- 下層ページのFVの画像切り替え
- NEWS一覧と詳細ページ、月別やカテゴリーによる出しわけ
- Worksのカスタム投稿ページでカテゴリーによる出しわけ
- ページネーション
- Aboutのアクセスと会社概要の住所をカスタムフィールド
- Contact Form 7を使ったお問い合わせページ
BEMを用いています