Figmaのデザインデータをもとにコーディングした架空のサイトです
TOPページと下層9ページをコーディングし、WordPressで構築しています
実際の案件を想定し、実装だけでなく、制作会社様との確認時に使用する品質チェックリストを作成。コードや最終納品までのやりとりを、現役フリーランスの方にチェックしていただきました
主な仕様
・headerはスクローに合わせてトップに固定、メインビジュアルを過ぎると半透明から不透明に変化し、headerの文字を見やすくしています
・TOPページと制作実績のページにswiperを使ってスライダーを実装しています
制作実績のページにはプラグインACFを使用し、実績に応じたコメントや投稿した写真がスライダーとして表示されるようにしています
・お問い合わせフォームにはプラグインcontact form7を使用し、必須項目が未入力の場合はエラーの文字が表記され、その項目のみ入力欄に色をつけてエラー箇所をわかりやすくしています
その他
・スマホファーストでコーディングしています
・BEMを用いてコーディングし、再利用しやすい設計を意識しました
・gulp環境にて構築、githubで管理しています
*画像は一部です。