本文へスキップ

歯科ホームページサイト「みなみ歯科クリニック」

歯科ホームページサイト「みなみ歯科クリニック」のキャプチャ
案件区分
サンプル制作(仮想案件)
サイトの種類
WordPress
使用テーマ
オリジナルテーマ
使用技術
  • HTML
  • CSS・Sass(FLOCSS)
  • JavaScript(jQuery)
  • PHP
  • WordPress
デザインツール
  • Figma
担当範囲
  • コーディング
制作期間
制作工数
20日間(コーディング)
デモ認証
user: demo / pass: demo

概要

歯科医院のコーポレートサイトを想定して制作したサンプルサイトです(仮想案件)。
担当はコーディングで、Figma のデザインカンプをもとに忠実に実装しました。医院サイトに求められる「清潔感」「信頼感」をデザインどおりに崩さず再現しつつ、WordPress による更新しやすい運用を両立させています。
制作会社さまの視点では、支給されたデザインを崩さず WordPress 化し、公開後の更新まで見据えた構築ができる点を確認いただける一例です。

課題

医院サイトでは「お知らせ」や「診療案内」を、院内のスタッフが手間なく更新できることが欠かせません。
一方で、デザインカンプの完成度をそのまま再現することも求められます。更新のしやすさとデザイン忠実性をどう両立させるかが、想定した課題でした。

解決アプローチ

更新性への配慮: WordPress による動的出力を採用し、カスタムフィールドを用いたカスタム投稿で診療案内などを構造化しました。専門知識がなくても管理画面から最新情報を保てるため、公開後の更新を院内で完結できます。お問い合わせには ContactForm7 を用いてメール送付機能を実装しました。

デザイン再現性への配慮: デザインカンプに忠実なコーディングを徹底し、レスポンシブでも崩れない適切な画像配置を行いました。PC からスマートフォンまで、医院の印象を損なわない見た目を保っています。

表示・検索への配慮: SEO を意識した HTML 構造で見出しや要素を適切にマークアップし、検索エンジンが内容を理解しやすい土台を整えました。

工夫したポイント / 想定効果

カスタムフィールドで診療情報を構造化したことで、更新の負荷を下げられる想定です。
SEO を意識した HTML 構造により、地域名や診療科目での検索流入も見込める設計としました。
デザインカンプを崩さず WordPress 化しているため、公開後も医院の世界観を保ったまま運用できることが期待できます。

お問い合わせはこちら

Web 制作・業務委託のご相談はこちらから。3 営業日以内に返信いたします。