ポートフォリオとして制作を進めていた「鍼灸院ホームページ制作」が、この度ひと通り完成しました。
今回は「地域密着型のホームページ」と「Web予約機能の実装」をテーマに、WordPressを用いて制作を行いました。本記事では、制作の意図や工夫したポイントについて解説します。
＜ファーストビュー＞
＜各情報へのリンク＞
＜店舗情報・CTA＞
＜Web予約画面＞
地域密着型のホームページ設計
今回のホームページ制作では、「特定の地域に絞った設計」を行いました。
鍼灸院や治療院は、基本的に地域密着型のビジネスです。
そのため、
・「近いのかも？」
・「ここなら通えそう」
と感じてもらうことが重要になります。
そこで、地域名を含んだキャッチコピーをファーストビューに配置し、さらに「地域の風景画像をカルーセルで表示」しました。
視覚的にも「この地域の鍼灸院である」と伝わる構成にしています。
ファーストビューでサービス内容を明確化
ホームページ制作において、ファーストビューは非常に重要です。
今回の鍼灸院サイトでは、
・キャッチコピー（テキスト）
・施術中の写真
・鍼や経穴人形の画像
を組み合わせることで、「何のサービスのサイトなのかが一目で伝わる設計」にしました。
サービスサイトではテキストによる情報伝達が重要なため、
最初に目に入るコピーで「鍼灸院であること」を明確にしています。
専門分野を明確にした治療院設計
今回のホームページでは、ターゲットを明確にするために、専門分野を絞りました。
・自律神経の乱れ
・不定愁訴
といった症状に特化した鍼灸院を想定しています。
ファーストビュー内で専門分野を提示し、訪問者が「自分に関係のあるサイトかどうかをすぐ判断できる構成」にしました。
また、専門用語は分かりにくい可能性があるため、
詳細ページへ遷移できるリンクボタンも設置しています。
WordPressとElementorによるホームページ制作
今回のサイトは、「WordPress＋Astraテーマ＋Elementor」で構築しました。
画像を多用したやや複雑なレイアウトでしたが、Elementorを使用することで、
「デザインカンプに近い形での実装が可能」となりました。
また、レスポンシブ対応も行っており、スマートフォンでも見やすい表示になるよう調整しています。
Web予約機能（Amelia）の実装
今回のホームページ制作では、「Amelia」という予約プラグインを導入し、Web予約機能を実装しました。
■Amelia無料版でできること
【基本機能】
・複数の施術メニュー設定（初回／再来／学生料金など）
・カレンダーからの日時選択
・管理画面での予約管理
・メール・電話の入力必須設定
・送信ボタンの文言変更
【予約制御】
・営業時間の設定
・休日設定
・予約可能期間の設定（例：30日先まで）
【メール通知】
・予約完了メール（顧客）
・予約通知メール（管理者）
・メールテンプレート編集
【キャンセル機能】
・顧客側からキャンセル可能
・管理画面からのキャンセル対応
・キャンセル通知メール送信
■Amelia無料版でできないこと
・キャンセル期限の設定（直前キャンセル防止）
・予約期限の設定（直前予約の制御）
・リマインドメールの自動送信
CTA設計｜Web予約と電話導線の両立
今回のホームページでは、「予約導線（CTA）」も重視しました。
・ヘッダー
・ファーストビュー
・ページ下部
といった複数箇所にWeb予約ボタンを設置しています。
また、Web予約に不慣れな方のために、電話番号もCTAとして明確に表示しました。
スマートフォンではタップ可能なボタンとして機能するよう設計しています。
まとめ｜鍼灸院ホームページ制作が完成
今回の鍼灸院ホームページ制作では、
・地域密着型の設計
・専門分野の明確化
・Web予約機能の導入
といったポイントを意識して制作を行いました。
やや複雑なファーストビュー構成や予約機能の実装も、
ElementorやAmeliaといったプラグインを活用することで無事に実現できました。
今後もホームページなどの制作を継続し、制作の過程やノウハウを発信していきたいと思います。
引き続きよろしくお願いいたします。
