あなたはベテランのデザイナーとして、クライアントの目的を満たすデザインを作り上げることで定評があります。以下の内容をもとにLPを作成してください。
認知症カフェ LP 構成案(あおば福祉会) 0. メタ情報 想定タイトルタグ:「認知症カフェ|家族と地域をつなぐ安心の場―あおば福祉会」
想定ディスクリプション:認知症のご家族を介護する方がほっと一息つき、専門職に相談できる“地域開放型カフェ”。介護職を目指す方や地域住民の交流の場としても機能します。開催概要・参加方法はこちら。
1. ヒーローセクション H1/キャッチコピー:「介護も、地域も、笑顔でつながる——認知症カフェへようこそ」
ファーストビュー写真:温かい木調インテリアで家族・スタッフ・地域住民が談笑しているイメージ。
一次CTA:「次回開催に申し込む」〈ボタン〉(フォームまたは電話リンク)
サブコピー:あおば福祉会の理念「地域社会を笑顔にする福祉」 社会福祉法人あおば福祉会 あおばの郷
2. 認知症カフェとは 介護する家族が情報・仲間・専門的助言を得られる“サードプレイス”であることをわかりやすく説明。
認知症当事者も地域住民も参加でき、偏見をなくし地域包括ケアを進める場であることを強調。
3. 対象者ごとのメリット 3‑1 介護家族(メイン) 認知症介護の孤立感や不安を共有し、専門職に気軽に相談できる。ストレス軽減プログラムやミニ講座も実施。
3‑2 介護施設で働きたい方 現場スタッフと直接話し、ボランティア体験を通じて職場の雰囲気を確認できる。「共に高め合えるスタッフを募集」する福祉会の採用理念を紹介。 社会福祉法人あおば福祉会 あおばの郷
3‑3 地域住民 「認知症を正しく理解し、助け合えるまちづくり」に参加できる。子ども向け認知症サポーター講座や地域イベント連携も予定。
4. サービス特徴(価値提案) 専門職常駐:介護福祉士・看護師・認知症ケア専門士が随時相談対応。
多世代交流:保育園・グループホーム利用者との合同イベントで世代間ギャップを解消。
低負担/予約不要:参加費ワンコイン(¥500)・途中入退室自由。
医療連携:近隣病院と協力し、医療相談会を定期開催。
5. 開催概要セクション 開催日程:毎月第1水曜 10:00‑12:00(※変更可能。最新情報はカレンダーで提示)
会場:あおばの郷 交流スペース(愛知県海部郡蟹江町西之森5‑23)
参加費:500円(当日払い)/ドリンク・お菓子付
定員:20名(先着順)
予約方法:Webフォーム/TEL 0567‑96‑6623
6. 参加の流れ フォーム入力 or 電話予約
リマインドメール(開催前日に自動送信)
当日受付(名札とプログラム配布)
アイスブレーク → テーマ別テーブル交流 → 専門家ミニ講座 → フリーカフェタイム
次回案内・アンケート記入
7. 利用者の声(テキスト+顔写真サムネ) 介護家族:「ここで学んだ口腔ケアで父の食欲が戻りました」
ボランティア:「就職前に現場感覚をつかめたのが大きい」
地域住民:「認知症サポーター講座で“困ったときの声掛け”を実践できました」
8. フォトギャラリー/動画 施設外観、交流風景、手作りお菓子、ミニ講座の様子をカルーセル表示。
9. FAQ Q. 認知症の診断がなくても参加できる? → 可能。興味があればどなたでも歓迎。
Q. 途中参加・退室は? → 自由。負担なくご利用ください。
Q. 駐車場は? → 施設横に20台分を用意。満車時は近隣コインP紹介。
Q. 介護相談は個別対応してもらえる? → 専門職が個室で対応(要予約)。
10. アクセス 近鉄蟹江駅 徒歩15分/お散歩バス「保健センター」停 徒歩1分。
Google マップ埋め込み+駐車場案内図。
11. セカンダリー CTA ブロック 「ボランティア体験・職員採用情報を見る」〈別タブで求人LPへ〉
「地域イベントに協賛したい企業・団体はこちら」(PDF資料DL)
12. フッター あおば福祉会ロゴ・理念引用
電話・メール・SNSアイコン(Instagram/LINE公式/X)
個人情報保護方針・サイト利用規約リンク
13. コンテンツ後の技術設計メモ(制作者向け) LCP 対策:ヒーロー画像を WebP 形式・優先読み込み。
フォーム:Google フォームか no-code CMS の問い合わせAPIを活用し、送信→サンクスページでCV計測。
構造化データ:Organization, Event を schema.org でマークアップし、イベント開催日をリッチリザルト対応。
計測:GA4 のキーイベントに「form_submit」「tel_click」を設定。
認知症カフェのランディングページを作成しました。温かみのあるデザインで、介護家族、施設で働きたい方、地域住民それぞれにメリットを伝える構成になっています。
このランディングページは、認知症カフェの目的と価値を明確に伝えるデザインになっています。主な特徴は以下の通りです:
明確な情報構造:
ユーザーフレンドリーな要素:
信頼性の構築:
明確なCTA:
このランディングページは、介護家族、施設で働きたい方、地域住民それぞれに向けたメッセージを伝えながら、認知症カフェの社会的価値を強調する構成になっています。
現在のコードではプレースホルダー画像を使用していますが、実際の施設や活動の写真に置き換えることで、ランディングページの魅力と信頼性が大幅に向上します。以下に、画像を置き換える方法と各セクションに適した写真の選び方を説明します。
上記のコードでは、以下の機能を実装しました:
画像ファイルの配置:
/public/images/
ディレクトリに配置しますhero-cafe.jpg
)フォールバック機能:
ImageWithFallback
コンポーネントを作成画像アップロード機能:
/admin/upload
)/api/upload
)で画像ファイルを保存Next.js の Image コンポーネントを活用:
画像フォーマット:
パフォーマンス向上:
priority
属性: ヒーロー画像など重要な画像に設定object-cover
: アスペクト比を維持しつつ、コンテナにフィットアクセシビリティ:
alt
テキストを設定alt=""
を使用/public/images/
ディレクトリに画像ファイルをアップロード/admin/upload
)から画像をアップロードこれらの変更により、プレースホルダー画像が実際の施設や活動の写真に置き換わり、ランディングページの魅力と信頼性が大幅に向上します。