TAKUMI Web Works
S-013 自主制作

少年院の記録|公式情報の調査・独自機能を備えたWordPress制作事例

全国42施設の公式情報を調査し、検索・地図・詳細ページへ整理。オリジナルテーマ、寄稿の本人確認と審査、質問受付、出典管理を備えた「少年院の記録」の制作事例。情報収集からサイト制作・運営の操作案内まで対応しました。

種別自主制作
対象・用途全国の施設情報を探すご本人・ご家族・支援する方のための情報サイト
制作範囲・成果物公式資料の調査・情報設計・原稿作成/オリジナルテーマ・プラグイン/地図・寄稿審査/本番設定・操作案内
表現・設計の特徴紺色と白、明朝体、空と木々のイラスト。何ができるかが最初に伝わる画面設計
Share

この制作事例を共有

制作画像プレビュー

目次

制作内容

施設や支援制度の情報が、公式ページやPDFに分かれていると、必要な住所・連絡先・教育内容を探すだけでも時間がかかります。「少年院の記録」は、そうした公開情報を調べ、全国42施設の検索・地図・詳細ページへ整理した情報サイトです。

TAKUMI Web Worksでは、情報の調査と原稿づくりから、オリジナルデザイン、WordPressテーマ、独自プラグイン、管理画面の使い方までを一貫して制作しました。自主制作として設計・開発し、2026年10月に公開した実際のサイトを紹介します。

公開サイト「少年院の記録」を見る

完成したトップページを、全体画像で見る

PC版とスマートフォン版を、ページの先頭からフッターまで保存しています。画像を大きく確認したい方は、次のリンクから原寸の縦長画像を開けます。

誰が、何を探すためのサイトか

ご本人・ご家族・支援する方が、少年院の所在地や面会前の確認事項、学びや仕事に関する公的な情報へたどり着けることを目指しました。施設の名前を知っている人も、地域しか分からない人も使えるよう、施設名・都道府県・キーワード・地図という複数の入口を用意しています。

「何ができるページか」「ここで何が分かるか」を最初に伝え、ボタンも「住所・面会・教育課程を詳しく見る」など、移動した先の内容が分かる言葉に整えました。初めて訪れた人の立場から、文章と操作の順序を設計しています。

公式資料を調べ、出典付きの施設情報にする

法務省の全国一覧、各施設の紹介資料、教育課程を定める資料などを照合し、掲載項目をそろえました。PDFをそのまま並べるだけでなく、知りたい内容から探せる情報に組み直しています。

  • 全国42施設の名称・所在地・電話番号と、それぞれの公式ページや紹介PDFへのリンク
  • 現在の教育課程、学習・職業指導などの取組、進級の仕組みを読むための案内
  • 現在の制度と昔の名称・処遇区分を分けた説明、確認できた旧称・移転・沿革
  • 資料の基準日、当サイトでの確認日、説明の根拠となる原典へのリンク

昔の名称を現在の区分へ機械的に置き換えず、資料で確認できた事実と、確認できない点を分けて記載しました。施設の写真も画像ごとに利用条件を確認し、現在の写真と以前の建物の写真を区別しています。

デザインと、スマホで迷わない画面づくり

紺色と白を基調に、明朝体の見出し、空や木々のイラストを組み合わせたオリジナルデザインです。施設の実際の写真とイメージイラストは、役割が混ざらないように表示しています。

トップページだけでなく、施設一覧・施設詳細・記事・お知らせ・フォームまで同じ世界観で制作。PC、スマートフォン、狭い画面幅で、文字の切れ、ボタンの押しやすさ、フォームの説明、次に進む導線を確認しました。

オリジナルテーマと独自プラグインで実装した機能

地図から施設を選び、写真付きカードを開く

全国表示から地図を拡大し、ピンを選ぶと、施設の写真・住所・電話番号と詳細ページへのリンクが開きます。都道府県や施設名による選択、全画面表示にも対応。MapLibreとOpenFreeMapを利用し、有料のGoogle Maps APIは導入せず、Googleマップで確認したい方には外部リンクを用意しました。

原文を残し、本人に確認してもらってから公開する寄稿審査

「人生の記録」は、18歳以上のご本人が匿名で文章を寄せられる仕組みです。原稿は非公開で暗号化して保管し、管理者は原文を残したまま、編集用コピーで掲載案を整えます。

  1. WordPressの「人生の記録審査」で、届いた原文を確認する
  2. 編集用コピーを作り、掲載案を非公開で保存する
  3. 任意のAI利用に同意がある場合だけ、必要最小限のAI用コピーを作り、人が内容を確認する
  4. 保存した掲載案の全文を、ご本人の確認画面へ提示する
  5. ご本人が承認した版を最終確認し、専用画面から公開する

AI用コピーは、個人を特定できる情報を削除・一般化した本文を、人が確認して手動で使うための機能です。ChatGPT・Codexへの自動送信は行いません。AIの出力も原文と比べ、体験や感情を作り足さずに掲載案へ戻す運用にしています。

公開の質問と、非公開の問い合わせを分ける

質問は公開への同意を得た専用フォームで受け付け、最初は非公開で保存します。管理者が質問文を整え、根拠を確認した回答と一緒に掲載する仕組みです。非公開のお問い合わせやご意見を、そのまま質問コーナーへ転用しません。

ご意見・ご要望は、閲覧中のページから小さなフォームを開いて送れます。ページの指定を利用者に求めず、開いたページを自動で記録。返信を希望する方だけメールアドレスを入力できるようにしました。

お知らせ・記事・情報検索を、日々の運営につなげる

  • トップページにお知らせを表示し、一覧や記事へ進める導線
  • 講演・活動情報の絞り込みと日付による並び替え
  • 記事ページの右サイドバー、検索、カテゴリー、タグ、関連記事などの案内
  • 施設写真・記事のアイキャッチ・共通画像を使い分けるシェアカード
  • 検索向けのタイトル・説明、サイトマップ、構造化データ、画像の軽量化

表示はオリジナルテーマ、サイト固有のデータや審査は独自プラグインに分け、更新やテーマ変更を考えた構成にしました。お問い合わせにはContact Form 7とFlamingoなどの既存プラグインも活用し、メール通知だけに頼らず受信履歴を確認できるようにしています。

作って終わりにしない、更新と操作の案内

「最新情報との差を確認して」と依頼されたときに、全国一覧から全施設を照合できる更新手順と、公式資料の変更を確認するためのツール・記録を用意しました。名称・所在地・教育課程・資料・写真の利用条件まで、何を確認して更新するかを残しています。変更の自動公開は行わず、内容を確認して反映する運用です。

WordPressの「質問と回答」と「人生の記録審査」には、初心者向けの手順を常設しました。毎回別の資料を探さなくても、原文と掲載文の違い、途中保存、本人確認、公開後の修正を、操作する画面で確認できます。

公開前には機能・表示・入力の確認、公式のPlugin Check、配布ファイルの検証、更新と復旧の確認を実施しました。これらの確認は、将来の不具合や検索順位を保証するものではありません。情報の再確認、バックアップ、権限管理などを継続する前提の設計です。

同じような情報サイトの制作を相談したい方へ

公共施設や地域の支援窓口の一覧、団体の活動情報、資料が多い分野の案内サイトなどでも、「調べる → 項目をそろえる → 読者に伝わる文章にする → 検索・地図・詳細ページへ載せる」という流れで制作を検討できます。

見た目の制作に加え、公開資料の調査・出典整理・掲載原稿・更新方法・独自の受付機能まで、必要な範囲を相談できます。資料の種類と件数、届けたい相手、欲しい機能、更新する頻度をお知らせください。利用条件や専門的な確認が必要な内容を確かめたうえで、制作範囲を決めます。

画面と画像の出典について

掲載画面は2026年10月25日時点のものです。PC版のトップページ全体、スマートフォン版、地図と施設カード、施設詳細を実際の表示から保存しました。サイトの内容やデザインは、その後の更新で変わる場合があります。管理画面の画像は操作案内の表示例で、投稿者の原稿や連絡先は含みません。

画面内の施設写真の出典:法務省「紫明女子学院 公式紹介資料」1ページ、「盛岡少年院 公式紹介資料」1ページ、「東北少年院の公表ページ」、「新潟少年学院 公式紹介資料」1ページ。写真部分の切り出し・縮小・WebP変換は「少年院の記録 編集部」。公共データ利用規約(第1.0版)に基づく利用で、法務省による推薦・公認を意味しません。

地図:OpenFreeMap、© OpenMapTiles、© OpenStreetMap contributors。地図の権利表記は画面内にも残しています。

制作のポイント

  • 公式資料の調査から、出典付きの掲載原稿と施設データを作成
  • 全国42施設を、都道府県・名前・キーワード・地図から検索
  • スマホとPCに対応したオリジナルデザイン・WordPressテーマ
  • 原文を残す編集用コピーと、同意・人の確認を分けたAI用コピー
  • 本人が全文を承認した掲載案を、最終確認して公開する寄稿審査
  • 公開の質問・非公開のお問い合わせ・ご意見フォームを用途別に設計
  • 写真の利用条件、現在と昔の情報、出典と確認日を管理
  • 管理画面に初心者向けの手順を常設し、運営開始後も使える形へ

この事例を参考に、必要な制作物・機能・情報整理の目的や範囲をご相談いただけます。正式な範囲と金額は内容確認後にご案内します。