現在、ポートフォリオ制作の一環として鍼灸院ホームページ制作を進めています。
前回の記事ではデザインカンプを公開しましたが、今回はそのカンプをもとに実際のサイト実装を開始しました。
今回のホームページ制作では、WordPressとElementorを使用しています。
この記事では、現在制作中の治療院サイトの構成とデザイン意図について紹介します。
WordPressとElementorで鍼灸院サイトを構築
今回のホームページ制作では、WordPressとElementorを使用しています。
ElementorはWordPressで利用できるページビルダープラグインの一つで、
ノーコードでも自由度の高いレイアウトを作成できるツールです。
今回の鍼灸院ホームページでは、ファーストビューに複数の画像を配置したやや複雑なレイアウトを採用しています。
通常のブロックエディターでは再現が難しいレイアウトでも、
Elementorを使用することでデザインカンプに近い形で実装することが可能です。
ポートフォリオ制作においても、実際のホームページ制作に近い環境で構築できる点は大きなメリットだと感じています。
治療院ホームページで重要な情報をトップページに整理
今回の画像は、ファーストビューの下に配置する情報整理セクションです。
鍼灸院や治療院のホームページでは、多くの閲覧者が次のような情報を知りたいと考えています。
・どんな症状に対応しているのか
・施術料金はいくらなのか
・施術者はどんな人なのか
そのため今回のホームページ制作では、
トップページ内で概要を紹介し、詳細は個別ページで説明する
という構成にしました。
トップページでは、
- 対応症状
- 営業時間・料金
- 院長紹介
などをセクションとして配置しています。
それぞれのセクションには**「くわしく見る」ボタン**を設置し、
詳細ページへ自然に誘導できる導線設計にしました。
また、グリッドレイアウトや写真を活用することで、
クリックするとどんな情報が得られるのかが一目でわかるデザインを意識しています。
鍼灸院ホームページの色彩設計
今回の治療院ホームページでは、若草色をテーマカラーとして採用しました。
若草色には次のようなイメージがあります。
・安心
・生命力
・健康
・癒し
・リラックス
鍼灸院や治療院のホームページでは、
「ここなら安心して通えるかもしれない」
と感じてもらうことが重要です。
そのため、閲覧者に安心感や回復のイメージを与える色彩設計を意識しました。
フォントは丸ゴシックで親しみやすさを表現
フォントには丸ゴシック系フォントを採用しています。
丸ゴシックは
・やわらかい印象
・親しみやすさ
・安心感
といった特徴があります。
体調不良や不安を抱えてホームページに訪れる人も多いため、
少しでも心を落ち着かせるデザインを意識しました。
文字の雰囲気も、治療院サイトにおいては重要なデザイン要素だと考えています。
まとめ、鍼灸院ホームページ制作はまだ進行中
今回は、鍼灸院ホームページ制作の進捗として、
WordPressとElementorを使用したサイト構築の様子を紹介しました。
治療院のホームページ制作では、
・必要な情報を整理すること
・安心感を与えるデザイン
・わかりやすい導線設計
が非常に重要になります。
現在も制作を進めており、今後は
・予約システムの実装
・SEO設計
・スマホ表示の調整
などを行っていく予定です。
今後もポートフォリオとして、ホームページ制作の進捗をブログで紹介していきたいと思います。
