さくらオンライン塾様（サービスサイト）｜Web制作実績 レスポンシブ対応｜制作実績

サイトは1ページのみのサイトとして構成されていたため、コンテンツの拡張やSEO対策がしづらい構成でした。

そのため今回のリニューアルでは、お客様自身で簡単にサイト内にページを増やしていける「ブログ」をCMS開発いたしました。

ブログはサービス情報をより充実化させられるだけでなく、SEO対策も同時に行える機能になっており、お客様にも大変好評をいただけております。

ヘッダーではメガメニューを取り入れており、少ないマウス操作で各ページを回遊できるようにユーザビリティを向上させております。

また、CVとなる「無料体験申し込み」と「LINE無料相談」のリンクは視認性を高める形でデザインをしているほか、各リンクの配置順は人間の心理に基づき、訴求したいページ順に左から設置することでクリック率の向上を図りました。

さらに、ページの構成としてはメインターゲットである保護者の方が信頼を寄せて頂けるようなコンテンツ内容を意識しました。例えば、「当塾の特徴」では学校の授業に参加ができなかったり、学校に行くことが難しい状況の子供に最適な塾であることを明記し、「保護者の方へ」では、不安を払拭できるように笑顔の子供の写真や明るいイラストをページに多く含め、通塾後の子供の姿をイメージしていただけるように意識しました。

これらのページにはプロのライターによる原稿作成サービスもご利用いただいているため、お客様の想いが伝わる文章作成も行わせていただきました。

デザイン面では、子供と保護者が一緒にサイトを閲覧される状況も想定し、堅い印象や通塾への不安を感じさせないデザインを心がけました。

具体的には、ポップで楽しい雰囲気が感じられるメリハリをつけた配色や、見出しに柔らかいフォントを用いることで柔らかいWebサイトの雰囲気を演出いたしました。

また、ホームページ内の画像は子供らしい遊び心をイメージした切り抜きを行い、オンライン授業に興味を持っていただけるようなトレンドデザインに仕上げました。

ユーザーからの流入が多く想定されるモバイル用サイトでは、メインビジュアルのすぐ下に「学習コース・料金」と「保護者の方へ」の2つのボタンを設置し、”お客様へ訴求したいコンテンツ”への導線を強化いたしました。

特に「保護者の方へ」のボタンでは、吹き出しで具体的な子供の状況をあえて表示し、塾としての強みをファーストビューでアピールしております。

ハンバーガーメニューでもユーザーが申し込みを検討するうえで必要な情報となるページの閲覧を促せる導線設計を行っております。

訴求したいページを上からに並べて表示し、ボタンのレイアウトはバナーのような形で実装を行う事で訴求度を分けております。

また、「学習コース・料金」や「保護者の方へ」など、下層ページが枝分かれするコンテンツにおいてはアコーディオンを取り入れることで、メニューがコンパクトに見えるように細部までユーザビリティにこだわる制作も弊社の強みです。

サイト内で使用している写真選定は、「学習を終えた未来の子供」をイメージできるように明るく笑顔な写真や柔らかさが伝わるイラストにこだわって選定を行いました。

旧サイトはテキストが中心のサイトだったため、写真やイラストを多く用いることで全体の印象を明るくし、通塾に対してのイメージアップを図りました。

デザイン面では、ロゴのカラーである青とオレンジをベースにポップさを演出したほか、メインビジュアルには上下に動く丸いテクスチャと桜をほのかにあしらうことで、塾に対する堅いイメージを取り払い、「ここの塾で勉強してみたい」と子どもに思っていただけるようなデザインテイストを心がけました。

実際の反響として、リニューアル後にアクセス数の大幅増加が確認されており、お客様からは、自社でコンテンツを増やせるシステム開発やページ内設計に特に好評をいただくことができました。