学習塾サイト(デモサイト)
あすなろアカデミー
中学生・高校生に向けた、個別指導型の学習塾デモサイトを制作しました。学習の悩み・選ばれる理由・コース紹介・成績アップ事例・講師紹介・教室案内・無料体験までを1ページに整理し、保護者にも生徒にも安心感が伝わる構成にしています。
別のタブで開きます
- 業種
- 学習塾・個別指導塾
- 担当範囲
- 構成・デザイン・HTML/CSS実装
- 使用技術
- HTML / CSS
- ページ構成
- シングルページ

このサイトについて
定期テスト対策や受験対策に悩む中高生と、その保護者に向けた学習塾サイトを制作しました。
青を基調にした清潔感のあるデザインで、誠実さ・信頼感・前向きな学びの印象が伝わるようにしています。ファーストビューでは「その一歩が、未来の選択肢を広げる。」というコピーで塾の姿勢を伝え、学習の悩み、解決策、選ばれる理由、コース、成績アップ事例、講師紹介、教室案内、無料体験へ自然につながる流れを意識しました。
デザインのポイント
-
信頼感が伝わる明るいブルー基調
学習塾らしい誠実さや清潔感が伝わるよう、ブルーを基調に、白背景と余白を活かした見やすいデザインにしました。
-
不安から無料体験へつなげる導線
勉強の悩みを提示した上で、解決策・選ばれる理由・成績アップ事例へつなげ、保護者が安心して問い合わせを検討できる構成にしました。
-
成果とサポート内容が伝わる情報設計
コース内容、成績アップ事例、生徒・保護者の声、講師紹介を整理し、塾の強みが具体的に伝わるようにしました。
ページの流れ
トップから順に、どんな順番で情報を見せているかをまとめました。画像を押すと、セクション全体を拡大して見られます。
-
01 / 05
TOP
メインビジュアルとキャッチコピーで、未来に向けて学ぶ前向きな印象を伝えました。
-
02 / 05
お悩み・解決策
勉強が続かない、成績が伸びないなどの悩みを提示し、個別指導で解決できる内容へつなげました。
-
03 / 05
選ばれる理由
地域密着、個別指導、保護者連携など、塾の強みを3つに整理して伝えました。
-
04 / 05
コース紹介・成績アップ事例
高校受験、中学生、高校生、大学受験などのコースと、成績アップ事例を掲載しました。
-
05 / 05
講師紹介・教室案内・無料体験
講師や教室情報を紹介し、最後に無料体験・資料請求へつながる導線を設計しました。
こんなサイトを作りたい、
というご相談も。
新しくホームページを作りたい。今のサイトを見直したい。まだ内容が固まっていなくても大丈夫です。お話を伺ったうえで、いま必要なものだけをご提案します。
ご相談・お見積もりは無料です。
