プロジェクトの背景と目的
「総合新川橋病院」様は、川崎市で地域医療を支える総合病院であり、眼科・整形外科・循環器内科といった専門性の高い診療科を持っています。
旧Webサイトは長年運用されてきたものの、次のような課題が顕在化していました。
- 課題①：情報量は豊富だが、診療科ごとの導線が複雑で、ユーザーが目的の情報にたどり着きにくい
- 課題②：TOPページで病院の「強み」や「専門性」が十分に伝わらない
- 課題③：モバイルユーザーへの最適化不足、直帰率の高さ
このため、「集患力の強化」×「ブランドイメージの刷新」×「ユーザー体験の向上」を同時に達成するリニューアルを目指しました。
制作上の工夫・設計ポイント
1. 集患戦略を意識した情報設計
- ターゲット診療科（眼科・整形外科・循環器内科）に特化したページ構成
- 各診療科に専用ページを用意し、「症状別」「治療法別」「Q&A」など、患者の検索意図に対応。
- SEO対策と連動したコンテンツ設計
- 「川崎 眼科」「川崎 整形外科」「川崎 循環器内科」など、地域＋診療科の複合キーワードを意識。
- 症状別の詳細説明を掲載することで、ロングテールキーワードもカバー。
2. ビジュアルで“総合病院の信頼感”を演出
- メインビジュアル：病院外観を下から見上げた写真を採用し、威厳・安心感を伝えるため、広角レンズを使用したダイナミックな構図。
- 色彩設計：医療機関らしいブルー基調をベースに、ホワイト＋グレーで清潔感を表現。
- ファーストビュー：「地域に根差した総合医療」「高度な専門診療」「信頼と実績」をキャッチコピーで明示。
3. TOPページに“強み”と“導線”を集約
- TOPから診療科へのスムーズな遷移：眼科・整形外科・循環器内科を3つの大きなバナーで表示。
- 病院の特徴をわかりやすく掲載：「診療科一覧」「初診の流れ」「地域医療連携」「アクセス」を一画面で確認可能。
- CTA（Call To Action）の強化：「診療時間」「アクセス」「予約・問い合わせ」ボタンを常時固定表示。
4. モバイルファースト設計
- モバイルでは最重要情報（診療時間・アクセス・予約）を上部に固定。
- フォントサイズ、行間、余白を最適化し、読みやすさを確保。
- ハンバーガーメニューは診療科を優先表示する仕様に。
SEO施策の詳細
- title / meta description 最適化：例：「川崎の総合病院｜眼科・整形外科・循環器内科なら総合新川橋病院」
- hタグの階層設計：H1：診療科名 or ページの主題 / H2：症状、治療、流れ
- 構造化データ（JSON-LD）：病院情報（名称・住所・診療時間）、FAQスキーマを導入し、検索結果のリッチリザルト対応
- 画像のSEO：alt属性を全画像に設定、WebP形式で軽量化＋Lazy Load対応
- 内部リンク強化：診療科ページ ⇔ よくある質問 ⇔ 初診案内 を相互リンク
CMS設計
WordPressをベースに完全オリジナルテーマを構築。
「お知らせ」「採用情報」「診療科」をカスタム投稿で分類し、管理画面にツールチップを追加し、非エンジニアでも更新可能なUIを実現。
想定ターゲット
- 川崎市・横浜市・都内在住で、専門診療を求める患者
- シニア層、または持病を持つ方で、総合的な医療を希望する方
- 地域医療機関との連携を必要とする医師・医療従事者
使用技術
- CMS：WordPress（完全オリジナルテーマ）
- 言語：HTML5 / CSS3 / JavaScript / PHP
- 画像最適化：WebP / Lazy Load
- SEO：構造化マークアップ / パンくず / metaタグ最適化
- UX改善：レスポンシブデザイン、モバイルUI最適化
