- 使用技術
-
HTML / CSS / JavaScript
詳細内容
デザインカンプをもとにコーディングを行い、ロゴ・配色・画像・テキストを調整し、オリジナル要素を加えて制作した架空の農園サイトです。 安心・安全な食品を選びたいと考える20〜50代の家庭層をメインターゲットにし、自然のやさしさや温かみが伝わるデザインを意識しました。 ファーストビューではコピーを段階的に表示することで印象的な演出とし、その後に農園について→製品一覧→お知らせ→FAQ→アクセス→お問い合わせといった構成で、農園のこだわりを伝えながら購入や問い合わせにつながる導線を設計しています。 デザイン面ではやわらかい配色と余白を意識し、安心感や親しみやすさを表現しました。また、テキスト量が多いセクションでも読みやすくなるよう、改行やレイアウトを工夫しています。 実装はHTML・CSS・JavaScriptを用い、レスポンシブ対応のほか、商品スライダーやFAQのアコーディオン、ハンバーガーメニューなど、操作のしやすさを意識した動きを実装しています。
