WEBCAN.
Free Check無料診断URLを入れるだけ・30秒でSEOとAI検索対応をチェックFree Consultation無料相談
  1. TOP
  2. デザイン参考集
  3. 介護・福祉
  4. 幕張ケアマネージャー事務所

webcan analyze makuhari-care.com

CARE & WELFARE · 千葉県 · PICKED 2026.10.20

幕張ケアマネージャー事務所介護・福祉のホームページデザイン参考 — 明朝体・縦書き・グリーン

幕張ケアマネージャー事務所のトップページ（PC）
PC（1440px）
幕張ケアマネージャー事務所のトップページ（スマホ）
スマホ（375px）
出典：makuhari-care.com ↗確認日 2026.10.20
幕張ケアマネージャー事務所介護・福祉 · 千葉県
サイトを見る ↗ワイヤーDL

EDITOR'S NOTE編集部の視点

縦書きのコピーと一本の線で、ケアマネージャーの仕事を「生活をつむぐ」と言い表す。

千葉市花見川区幕張本郷のケアマネージャー事務所のサイト。ファーストビューは横顔の人物写真と、縦書きの「生活をつむぐ」に緑の線を絡めた構成で、左下に事務所名と所在地、右下にナビを置いている。考え方・ケアへの姿勢・事務所の特徴・ケアプラン作成の流れを1ページで順に説明し、最後に電話番号とメールアドレスをまとめている。

  1. 01ファーストビューの左下に、事務所名と所在地（千葉県千葉市花見川区幕張本郷）を並べている
  2. 02緑の細い線をコピーやセクションのあいだに通し、縦書きの見出しとともにページ全体の流れをつくっている
  3. 03ケアプランの作成を「ご依頼」から「サービス利用開始」まで6つの番号つきの手順で示している

CONVERSION集客の工夫

－電話番号をヘッダーに常設PC・ファーストビュー
－タップで電話できるSP・tel:リンク 0か所
－SPの追従ボタンSP・画面下に固定
✓予約・問い合わせ導線お問い合わせ
－LINEで相談・予約LINE公式アカウント
－営業・診療時間の明記トップページ内

依頼してからの流れを先に見せる

ケアプラン作成の流れを、ご依頼・原案作成・サービス担当者会議・ケアプラン作成・事業者との契約・利用開始の6段階で説明している。初めて介護サービスを使う家族にとって、相談したあと何が起きるかが分かることは、問い合わせの不安を減らす材料になる。

事務所の特徴を具体的に書く

「新規利用者のうち約40％はターミナルケアのご相談」「書類作業のIT化」と、特徴を数字と取り組みで書いている。抽象的な理念だけでなく、どんな相談に慣れているかが分かる。

求職者向けの入口を常に出す

画面右上に「求職者の方はこちら」のタブを固定している。利用者向けのページの中で、採用への入口を邪魔にならない形で用意している。

チェック項目は 2026.10.20 に実ブラウザで描画したトップページを自動判定したものです。

COLOR配色

#FFFFFF背景
#EBF3F1セクション背景（スマホ） · ペールグリーン
#398D78ブランドカラー（線・タブ・見出しの差し色） · グリーン
#355245濃色 · ダークグリーン
#555555本文テキスト

背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。

TYPOGRAPHYフォント

用途
和文見出し・本文
使用フォント
BIZ UDMincho（約物は YakuHanMP）
無料で近いもの
BIZ UDMincho
用途
英数字（所在地の表記など）
使用フォント
Outfit
無料で近いもの
Outfit
用途
和文（求職者向けタブ）
使用フォント
Zen Kaku Gothic New
無料で近いもの
Zen Kaku Gothic New
要素PC サイズ / 太さPC 行間SP サイズ / 太さ
h252px / 5001.4036px / 500
h332px / 5001.4022px / 500
本文（p）18px / 5001.7516px / 500
ボタン18px / 5001.5016px / 500

実測値（PC 1440px・SP 375px、2026.10.20 計測）。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。

STRUCTUREページ構成（上から順に）

  1. 01

    ファーストビュー

    左に横顔の人物写真、右に縦書きの「生活をつむぐ」と緑の線。左下に事務所名と所在地、右下にナビ。右上に「求職者の方はこちら」のタブを固定。

    ファーストビュー／左コピー・右写真の分割型
  2. 02

    考え方（心地よい生活を共につくる）

    組んだ手の写真と、事務所の考え方の文章。

    コンセプト／写真＋メッセージ型
  3. 03

    ケアへの姿勢

    写真を散らして配置し、コミュニケーションと「ゆとり」についての文章。

    コンセプト／写真＋メッセージ型
  4. 04

    事務所の特徴

    縦書きの見出しで、ターミナルケアと業務の効率化の2つ。

    強み・選ばれる理由／写真とテキストの交互型
  5. 05

    ケアプラン作成の流れ

    縦書きの見出しと写真の横に、01〜06の番号つきの手順。

    流れ／ステップ型
  6. 06

    お問い合わせ・フッター

    電話番号とメールアドレスをアイコンつきで並べ、右に事務所名と所在地。

    フッター／店舗情報＋ナビ型
幕張ケアマネージャー事務所の構成をWEBCANの部品で組んだワイヤーフレーム（PC）

PARTSパーツ別に見る

01ファーストビューファーストビュー／左コピー・右写真の分割型
幕張ケアマネージャー事務所のファーストビュー（PC）PC
幕張ケアマネージャー事務所のファーストビュー（スマホ）SP
04事務所の特徴強み・選ばれる理由／写真とテキストの交互型
幕張ケアマネージャー事務所の事務所の特徴（PC）PC
幕張ケアマネージャー事務所の事務所の特徴（スマホ）SP
05ケアプラン作成の流れ流れ／ステップ型
幕張ケアマネージャー事務所のケアプラン作成の流れ（PC）PC
幕張ケアマネージャー事務所のケアプラン作成の流れ（スマホ）SP
06お問い合わせ・フッターフッター／店舗情報＋ナビ型
幕張ケアマネージャー事務所のお問い合わせ・フッター（PC）PC
幕張ケアマネージャー事務所のお問い合わせ・フッター（スマホ）SP

番号は上のページ構成の順番です。部品名から、同じ部品を使っているほかのサイトの実例を見られます。スクリーンショットは 2026.10.20 以降に撮影したもので、現在の表示とは異なる場合があります。

DOWNLOADワイヤーフレームをダウンロード

この構成を、Figmaで編集できるワイヤーに

上のページ構成を、WEBCANのワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。

PC版（1440px）SVG スマホ版（375px）SVG

Figmaでの使い方

  1. SVGをダウンロードする
  2. Figmaのキャンバスにファイルをドラッグ＆ドロップする
  3. セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める

文字はテキストレイヤーとして入ります（フォントは Noto Sans JP）。

REPRODUCEこのサイトを参考にするときのポイント

  1. 01ファーストビューに、事務所名と所在地を並べて「どこの事務所か」をすぐ伝える
  2. 02依頼から利用開始までの流れを、番号つきの手順で示す
  3. 03特徴は「どんな相談が多いか」を数字で書く
  4. 04一本の線と縦書きの見出しで、文章の多いページにも流れをつくる

FAQよくある質問

幕張ケアマネージャー事務所のサイトで使われているフォントは？

和文の見出しと本文は BIZ UDMincho（約物は YakuHanMP）、所在地などの英数字は Outfit、求職者向けのタブは Zen Kaku Gothic New です。いずれも Google Fonts などで無料で使えます。

居宅介護支援事業所のサイトには、何を載せればよいですか？

このサイトのように、考え方・事務所の特徴・ケアプラン作成の流れ・連絡先を1ページにまとめるだけでも、相談前に知りたいことの多くに答えられます。どんな相談が多いかを具体的に書くと、相談する側が自分に合うかを判断しやすくなります。

どんな業種の参考になりますか？

居宅介護支援事業所のほか、訪問看護ステーション・相談支援事業所・地域包括支援センターなど、相談から始まる福祉のサービスに応用できます。

スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利は幕張ケアマネージャー事務所および各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成をWEBCANの部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。

MOREほかの介護・福祉の参考サイト

介護・福祉のすべてを見る5件
webcan design --sitemap makuhari-care.com

幕張ケアマネージャー事務所のサイトマップ

  • 1ページ
  • 6ページ内セクション
  • トップページ/
    • 考え方/#conceptページ内
    • 事務所の特徴/#featureページ内
    • プラン作成の流れ/#planページ内
    • 会社概要/#aboutページ内
    • お問い合わせ/#contactページ内
    • ページの先頭へ/#pagetopページ内

2026.10.27 にトップページのヘッダー・メニュー・フッターのリンクから整理したものです。記事や事例などの個別ページは1件ずつではなく、件数つきの1項目にまとめています。サイトの更新で現在の構成とは異なる場合があります。

FROM REFERENCE TO YOUR SITE

このテイストで、
御社の介護事業所サイトを。

「幕張ケアマネージャー事務所のような構成で」とお伝えいただくだけで構いません。無料相談で御社の現状サイトを拝見し、地域と業種に合わせた構成案をお持ちします。

無料相談はこちら