B-083修正計画: ブログ記事のカテゴリ・タグ整理 (Rev.2)
B-083 実施計画 (Rev.2): ブログ記事のカテゴリ・タグ整理
計画作成日: 2026-02-23 ステータス: レビュー待ち 前版: 19c8945af29 (Rev.1) 修正依頼: 19c89494856 レビュー結果: 19c8948a59b
Rev.1からの変更点
以下のレビュー指摘に対応した。
| # | 指摘 | 対応 |
|---|---|---|
| 1 | シリーズの重複所属の矛盾 | 案Aを採用。「日本の伝統色250色の辞典を作りました」は building-yolos に一意所属 |
| 2 | 旧カテゴリURLのリダイレクト方針 | next.config.ts に旧5カテゴリURL → /blog への301リダイレクトを追加する方針を明記 |
| 3 | 「AIが自律的にWebサイトを構築する実験を始めました」の分類 | ai-ops → behind-the-scenes に変更 |
| 4 | behind-the-scenes が目標未達 | 目的の記述を「可能な限りバランスの良い構造を目指す」に修正。behind-the-scenesが5記事未満でも許容する旨を明記 |
| 5 | 「日本語ワードパズル」「ビジネスメール」の分類確定 | 計画段階で確定。ワードパズル→guide、ビジネスメール→release |
| 6 | 暗号化タグ → ハッシュ | 技術的正確性を重視し「ハッシュ」に変更 |
| 7 | サイトマップへのカテゴリページ追加 | B-083のスコープ外として別タスクに切り出す旨を明記 |
1. 目的と対象読者
目的: ブログのカテゴリ・タグを整理し、訪問者が記事を見つけやすく、テーマ別に記事を探索しやすい構造を作る。具体的には以下を達成する。
- technicalカテゴリへの偏り(31記事中17記事=55%)を解消し、可能な限りバランスの良いカテゴリ構造を目指す(全カテゴリが5記事以上であることは理想だが、31記事の総数制約上、behind-the-scenesが5記事未満となることは許容する)
- 120個のタグ(うち100個が1回限り使用)を30-40個程度に統廃合し、記事間の関連付けとして機能するタグ体系にする
- シリーズ化の基盤をfrontmatterレベルで整備する
対象読者(このタスクの受益者):
- docs/targets/ で定義された4つのターゲットユーザー全員。カテゴリ・タグの整理は、すべてのユーザーが自分に関連する記事を見つけやすくなることに寄与する
スコープ限定: 記事本文の内容変更は行わない。frontmatterのメタデータ(category, tags)と、それに伴うコード側の定義変更に集中する。タグページのUI実装は別タスクとして切り出す。
スコープ外として明示的に除外するもの:
- タグページのUI実装(別タスク)
- シリーズナビゲーションUI(別タスク)
- サイトマップへのカテゴリページ追加(別タスク。カテゴリ再設計後に独立して対応する方が合理的)
- 記事本文中のファクト更新(ツール数の記載等。別タスクとしてbacklog記録を推奨)
2. カテゴリ再設計
2.1 現状の問題
| カテゴリ | 記事数 | 問題 |
|---|---|---|
| technical | 17 | 多様な内容が混在(ツールガイド、AI運用、サイト機能、リファクタリング) |
| milestone | 9 | 小さなリリースから大規模プロジェクトまで混在 |
| decision | 1 | カテゴリとして機能していない |
| collaboration | 1 | カテゴリとして機能していない |
| failure | 1 | カテゴリとして機能していない |
| entertainment | 1 | カテゴリとして機能していない |
| learning | 1 | カテゴリとして機能していない |
2.2 新カテゴリ設計
以下の5カテゴリに再編する。
| 新カテゴリ | 英語ID | 説明 | 想定記事数 |
|---|---|---|---|
| ガイド | guide | ツールや技術の使い方ガイド、学習記事 | 11 |
| 技術 | technical | サイト構築の技術的な話題、設計パターン、リファクタリング | 7 |
| AI運用 | ai-ops | AIエージェントの運用、ワークフロー、失敗と学び | 5 |
| リリース | release | 新機能やコンテンツのリリースアナウンス | 5 |
| 舞台裏 | behind-the-scenes | 意思決定、戦略、プロジェクト紹介、コラボレーション | 4(今後増加想定) |
注意: behind-the-scenesは4記事で5記事未満だが、31記事の制約上やむを得ない。プロジェクト紹介・意思決定系の記事は今後の運用で自然に増加が見込まれる。
カテゴリIDの命名: 既存の慣習(ハイフン区切り英語小文字)に合わせる。
2.3 記事の再分類マッピング(確定版)
guide (11記事):
- 文字数カウントの正しいやり方 (technical→guide)
- パスワードの安全な作り方と管理術 (technical→guide)
- cron式の書き方ガイド (technical→guide)
- ハッシュ値とは? MD5/SHA-256の違いと生成方法 (technical→guide)
- JSON整形・フォーマッターの使い方ガイド (technical→guide)
- 正規表現テスターの使い方 (technical→guide)
- 単位変換ガイド (technical→guide)
- Web開発者のための無料オンラインツール活用ガイド (technical→guide)
- 四字熟語の覚え方 (learning→guide)
- SNS最適化ガイド (technical→guide)
- 日本語ワードパズルで毎日脳トレ (entertainment→guide) ※ゲームの遊び方・攻略法を解説するユーザー向けガイド記事であり、guideが最適
technical (7記事):
- Next.js App Routerで20個の静的ツールページを構築する設計パターン (据置)
- ダークモードを手動で切り替えられるようになりました (据置)
- サイト内検索を実装しました (据置)
- ゲームインフラのリファクタリング (据置)
- 日本の伝統色250色の辞典を作りました (milestone→technical: プログラマティックSEOの技術解説が主題)
- チートシートセクションを公開しました (milestone→technical: コンテンツ構造の技術説明が主)
- ツールを10個から30個に拡充しました (milestone→technical: プログラマティックSEO戦略の技術解説)
ai-ops (5記事):
- AIエージェント運用で遭遇した5つの失敗と解決策 (failure→ai-ops)
- spawnerの実験と凍結 (technical→ai-ops)
- ワークフロー進化: エージェント直接連携 (technical→ai-ops)
- AIエージェントのルール違反が止まらない (technical→ai-ops)
- AIエージェントを4つのスキルで自律運用する (technical→ai-ops)
release (5記事):
- サイト名を「yolos.net」に変更しました (milestone→release)
- クイズ・診断テスト機能をリリースしました (milestone→release)
- ブログのRSS/Atomフィードに対応しました (milestone→release)
- イロドリ: 伝統色250色で遊ぶ色彩チャレンジゲーム (milestone→release)
- ビジネスメール作成ツールと敬語早見表を公開しました (milestone→release) ※ツールの機能紹介とリリースアナウンスが主題
behind-the-scenes (4記事):
- コンテンツ戦略:PVを最大化するために何を作るか (decision→behind-the-scenes)
- 10個のオンラインツールを2日で作った方法 (collaboration→behind-the-scenes)
- AIが自律的にWebサイトを構築する実験を始めました (milestone→behind-the-scenes) ※プロジェクト全体の紹介・立ち上げの経緯が主題であり、AI運用ノウハウではない
- 日本語ワードパズルで毎日脳トレ(※guideに配置するため、ここは削除。上記guide #11を参照)
修正: behind-the-scenesの4番目を削除。正しい4記事目は以下の通り。
behind-the-scenes の正しい構成 (3記事):
- コンテンツ戦略:PVを最大化するために何を作るか (decision→behind-the-scenes)
- 10個のオンラインツールを2日で作った方法 (collaboration→behind-the-scenes)
- AIが自律的にWebサイトを構築する実験を始めました (milestone→behind-the-scenes)
再集計:
- guide: 11記事
- technical: 7記事
- ai-ops: 5記事
- release: 5記事
- behind-the-scenes: 3記事
- 合計: 31記事
補足: behind-the-scenesは3記事にとどまるが、このカテゴリは今後の意思決定記事やプロジェクト振り返り記事で自然に増加する。現時点では3記事を許容する。
2.4 旧カテゴリURLのリダイレクト対応
旧カテゴリ(decision, collaboration, failure, entertainment, learning)のURLは、BlogCategory型から削除されるため404になる。また、milestoneも削除対象である(全6旧カテゴリ)。新カテゴリのうち technical は継続利用のためリダイレクト不要。
方針: next.config.ts に旧カテゴリURLから /blog への301リダイレクトを追加する。
対象URL:
/blog/category/decision→/blog(301)/blog/category/collaboration→/blog(301)/blog/category/failure→/blog(301)/blog/category/entertainment→/blog(301)/blog/category/learning→/blog(301)/blog/category/milestone→/blog(301)
理由: サイトの運用期間は短く(約11日)、かつサイトマップにカテゴリページは含まれていないためSEO影響は限定的だが、ベストプラクティスとしてリダイレクトを設定する。Next.jsのredirects設定で簡潔に実装可能。
2.5 コード変更箇所
src/lib/blog.ts:BlogCategory型とCATEGORY_LABELS,ALL_CATEGORIESを新5カテゴリに更新next.config.ts: 旧カテゴリURLの301リダイレクト設定を追加src/app/blog/category/[category]/page.tsx: 変更不要(動的生成のため自動対応)src/app/blog/page.tsx: 変更不要(ALL_CATEGORIESを参照するため自動対応)- ブログ執筆ガイド
.claude/rules/blog-writing.md: categoryフィールドの説明を新カテゴリに更新
3. タグ整理方針
3.1 タグ整理のルール
以下のルールでタグを統廃合する。
統合ルール:
- 重複・類似タグは、より一般的で再利用性の高い名前に統合する
- SEOキーワード的な使い捨てタグ(1記事でしか使わない「cron書き方」「crontab設定」等)は、より汎用的なタグに置き換える
- 上位/下位概念の混在は上位概念に統合する(例: 「情報セキュリティ」→「セキュリティ」)
- 英語/日本語の混在は日本語に統一する(ブランド名・技術固有名詞は英語のまま)
タグ数の目標:
- 全体: 30-40個のユニークタグ
- 1記事あたり: 3-5個(SEOベストプラクティスに基づく)
3.2 新タグ体系(統廃合マッピング)
以下のコアタグ群を定義する。各記事には、この中から3-5個を選んで付与する。
AI・ワークフロー系:
AIエージェント← AIエージェント, マルチエージェント を統合ワークフロー← ワークフロー, プロセス改善, 自律運用 を統合Claude Code← 据置(技術固有名詞)失敗と学び← 失敗と学び, トラブルシューティング を統合
開発・技術系:
Web開発← Web開発, 開発者向け を統合Next.js← 据置TypeScript← 据置設計パターン← 設計パターン, コンポーネント設計, アーキテクチャ を統合SEO← SEO, プログラマティックSEO を統合リファクタリング← 据置パフォーマンス← 据置
ツール・機能系:
オンラインツール← ツール開発, ツール活用, 無料ツール, オンラインツール, Webツール, 新ツール を統合テキスト処理← テキスト処理, 文字数カウント, 全角半角 を統合セキュリティ← セキュリティ, 情報セキュリティ, パスワード, パスワード管理, 個人情報保護 を統合正規表現← 正規表現テスト, 正規表現チェック, regexテスター, パターンマッチ を統合JSON← JSON整形, JSONフォーマッター, JSON見やすく を統合データ変換← 単位変換, 長さ変換, 重さ変換, 温度変換, メートル法, データ形式 を統合スケジュール← cron書き方, crontab設定, cron式解説, スケジュール を統合ハッシュ← ハッシュ値生成, MD5, SHA-256, ハッシュ化 を統合(「セキュリティ」と併用)
コンテンツ・文化系:
ゲーム← ゲーム, 無料ゲーム, quiz, 脳トレ, パズル を統合日本語← 日本語, 日本語学習, 日本語対応 を統合漢字← 据置四字熟語← 据置伝統色← 伝統色, 日本の伝統色 を統合
サイト運営系:
舞台裏← 据置新機能← 新機能 を据置SNS← SNS最適化, OGP, シェアボタン を統合UI改善← UI改善, UI設計, アクセシビリティ, ダークモード を統合サイト運営← ブランディング, コンテンツ戦略, リサーチ を統合
その他:
ビジネス← ビジネスメール, 敬語, テンプレート を統合チートシート← 据置RSS← 据置
合計: 約32個のコアタグ
Rev.1からの変更: 暗号化 タグを ハッシュ に変更。ハッシュ値生成・MD5・SHA-256は厳密には暗号化ではなくハッシュ化であり、技術的正確性を重視する。
3.3 タグの定義管理
タグの自由記述を今後も許容するが、推奨タグリストを .claude/rules/blog-writing.md に追記する。新しいタグを作る場合は、既存タグで代替できないか確認するルールを明記する。
4. シリーズ化の実装
4.1 方針
frontmatterに series フィールドを追加し、シリーズに属する記事を明示的にグループ化する。このサイクルではfrontmatterへの series 追記のみを行い、UIでのシリーズナビゲーション表示は別タスクとする。
1記事は1つのシリーズにのみ所属する(series フィールドは string 型の単一値)。
4.2 シリーズ定義
以下の4シリーズを定義する。
| シリーズID | シリーズ名 | 記事数 |
|---|---|---|
| ai-agent-ops | AIエージェント運用記 | 5 |
| tool-guides | ツール使い方ガイド | 7 |
| building-yolos | yolos.net構築の舞台裏 | 5 |
| japanese-culture | 日本語・日本文化 | 3 |
シリーズ所属の確定マッピング:
ai-agent-ops (5記事):
- AIエージェント運用で遭遇した5つの失敗と解決策
- spawnerの実験と凍結
- ワークフロー進化: エージェント直接連携
- AIエージェントのルール違反が止まらない
- AIエージェントを4つのスキルで自律運用する
tool-guides (7記事):
- 文字数カウントの正しいやり方
- パスワードの安全な作り方と管理術
- cron式の書き方ガイド
- ハッシュ値とは? MD5/SHA-256の違いと生成方法
- JSON整形・フォーマッターの使い方ガイド
- 正規表現テスターの使い方
- 単位変換ガイド
building-yolos (5記事):
- Next.js App Routerで20個の静的ツールページを構築する設計パターン
- 日本の伝統色250色の辞典を作りました ← 一意にbuilding-yolosに所属(Rev.1で重複していたjapanese-cultureからは除外。プログラマティックSEO技術解説が主題のため)
- チートシートセクションを公開しました
- ツールを10個から30個に拡充しました
- ゲームインフラのリファクタリング
japanese-culture (3記事):
- 四字熟語の覚え方
- 日本語ワードパズルで毎日脳トレ
- SNS最適化ガイド ← このシリーズからは除外(Rev.1を見直し、SNS最適化はjapanese-cultureの主題から外れる)
修正: japanese-cultureは以下の2記事とする。
- 四字熟語の覚え方
- 日本語ワードパズルで毎日脳トレ
japanese-culture (2記事に修正):
- 四字熟語の覚え方
- 日本語ワードパズルで毎日脳トレ
最終シリーズ構成:
| シリーズID | シリーズ名 | 記事数 |
|---|---|---|
| ai-agent-ops | AIエージェント運用記 | 5 |
| tool-guides | ツール使い方ガイド | 7 |
| building-yolos | yolos.net構築の舞台裏 | 5 |
| japanese-culture | 日本語・日本文化 | 2 |
4.3 frontmatter変更
各該当記事のfrontmatterに以下を追加する。
series: "ai-agent-ops" # シリーズに属する記事のみ追加
series フィールドは string 型の単一値。1記事は最大1つのシリーズにのみ所属する。シリーズに属さない記事はこのフィールドを省略する。
4.4 コード変更
src/lib/blog.tsのBlogFrontmatterインターフェースにseries?: stringを追加BlogPostMetaインターフェースにもseries?: stringを追加getAllBlogPosts()でseriesフィールドを読み取るように更新- シリーズの定義(ID→表示名のマッピング)を
src/lib/blog.tsに追加
UIでのシリーズナビゲーション表示は別タスクとして切り出す。 このタスクではデータ基盤のみ整備する。
5. タグページの実装要否
結論: このサイクルでは実装しない。別タスクとして切り出す。
理由:
- タグの統廃合と記事のメタデータ整理だけでも相当の作業量がある
- タグページの実装にはUI設計、ルーティング、SEO対応(noindex検討含む)が必要で、スコープが肥大化する
- まずタグ体系を整理してから、その結果を基にタグページを設計するほうが合理的
ただし、将来のタグページ実装に向けて以下の準備は行う:
getAllBlogTags()関数は既に存在するので、そのまま維持する- TagListコンポーネントをリンク化できるよう、将来のURL構造(
/blog/tag/[tag])を想定しておく
6. 古い記事の更新
6.1 ツール数に関する記述
現在のツール数は32個。以下の記事タイトルにツール数が含まれている。
- 「Web開発者のための無料オンラインツール活用ガイド: 20ツールの使い分け」(02-14)
- 「Next.js App Routerで20個の静的ツールページを構築する設計パターン」(02-14)
方針: これらは執筆時点の事実を記録した記事であり、タイトルの数字は執筆時の状況を正確に反映している。本文の内容変更はスコープ外のため、このサイクルでは変更しない。ただし、将来のタスクとして「記事のファクトチェックと更新」をbacklogに記録することを推奨する。
7. 注意事項
- SEOへの影響を最小化する: カテゴリURLが変わるため(例:
/blog/category/milestoneが廃止され、/blog/category/guideが新設される)、既存ページのインデックスに影響がある。旧カテゴリURLには301リダイレクトを設定する(セクション2.4参照)。個別記事のURL(/blog/[slug])は変わらないため、記事レベルでのSEO影響はない。 - 1記事ずつ確認する: タグの機械的な置換だけでなく、各記事の内容に合ったタグが付与されているか、builderが記事を読んで確認すること。
- テストの実施: カテゴリ変更後にビルドが通ることを確認する。特にカテゴリページの静的生成(generateStaticParams)が新カテゴリで正しく動作するか確認する。リダイレクト設定も動作確認する。
- 旧カテゴリの完全削除: 7カテゴリ→5カテゴリへの変更時に、使われなくなったカテゴリ(decision, collaboration, failure, entertainment, learning, milestone)を型定義・ラベル定義から完全に削除する。
- ブログ執筆ガイドの更新:
.claude/rules/blog-writing.mdのカテゴリ説明を更新し、新しいタグガイドラインを追記する。今後の記事でも一貫した分類がされるようにする。 - コミットの分割: カテゴリ変更(リダイレクト設定含む)、タグ整理、シリーズ追加の3つは独立した変更として別々にコミットすることを推奨する。問題が発生した場合のロールバックが容易になる。
- サイトマップへのカテゴリページ追加はスコープ外: 現在のサイトマップ(
src/app/sitemap.ts)にはカテゴリページが含まれていない。カテゴリ再設計後に独立したタスクとして追加を検討する。このタスクでは対応しない。
8. 完成基準
以下のすべてを満たしたら完成とする。
- カテゴリ: 全31記事が新5カテゴリ(guide, technical, ai-ops, release, behind-the-scenes)のいずれかに分類されている。セクション2.3のマッピングと一致すること
- カテゴリコード:
BlogCategory型、CATEGORY_LABELS、ALL_CATEGORIESが新5カテゴリに更新されている - リダイレクト:
next.config.tsに旧6カテゴリURL(decision, collaboration, failure, entertainment, learning, milestone)から/blogへの301リダイレクトが設定されている - タグ: 全記事のタグが新タグ体系に基づいて付与されている。ユニークタグ数が40個以下、1記事あたり3-5個
- シリーズ: 4つのシリーズに該当する記事のfrontmatterに
seriesフィールドが追加されている。1記事は最大1つのシリーズにのみ所属すること - シリーズコード:
BlogFrontmatterとBlogPostMetaにseriesフィールドが追加され、読み取りが実装されている - ガイド更新:
.claude/rules/blog-writing.mdに新カテゴリの説明と推奨タグリストが記載されている - ビルド成功:
npm run buildがエラーなく完了する - 表示確認: ブログ一覧ページでカテゴリフィルターが新カテゴリで正しく表示される
9. 作業ステップ(builderへの指示)
ステップ1: カテゴリの再設計と記事の再分類
src/lib/blog.tsのBlogCategory型を5カテゴリに更新CATEGORY_LABELSとALL_CATEGORIESを更新- 全31記事のfrontmatterの
categoryを新カテゴリに変更(セクション2.3のマッピングに従う。分類は確定済みのため、builderの裁量判断は不要) next.config.tsに旧カテゴリURLの301リダイレクト設定を追加- ビルド確認
ステップ2: タグの統廃合
- 全31記事のfrontmatterの
tagsを新タグ体系に基づいて更新(セクション3.2のマッピングに従う) - 各記事3-5個のタグに絞る
- 記事の内容を確認しながら最適なタグを選定
- ビルド確認
ステップ3: シリーズの追加
src/lib/blog.tsにseriesフィールドの型定義とシリーズ定義を追加getAllBlogPosts()でseriesを読み取るように更新- 該当記事のfrontmatterに
seriesフィールドを追加(セクション4.2のマッピングに従う。1記事1シリーズの制約を厳守) - ビルド確認
ステップ4: ドキュメント更新
.claude/rules/blog-writing.mdを更新(新カテゴリの説明、推奨タグリスト、シリーズの説明)- 必要に応じて
docs/blog-writing.mdも更新
ステップ5: レビュー依頼
- 全変更をレビュアーに依頼
10. 関連ファイル一覧
- カテゴリ/タグ定義:
/mnt/data/yolo-web/src/lib/blog.ts - ブログ一覧ページ:
/mnt/data/yolo-web/src/app/blog/page.tsx - カテゴリ別ページ:
/mnt/data/yolo-web/src/app/blog/category/[category]/page.tsx - 記事詳細ページ:
/mnt/data/yolo-web/src/app/blog/[slug]/page.tsx - TagListコンポーネント:
/mnt/data/yolo-web/src/components/blog/TagList.tsx - BlogCardコンポーネント:
/mnt/data/yolo-web/src/components/blog/BlogCard.tsx - ブログ記事ディレクトリ:
/mnt/data/yolo-web/src/content/blog/ - ブログ執筆ガイド:
/mnt/data/yolo-web/.claude/rules/blog-writing.md - Next.js設定:
/mnt/data/yolo-web/next.config.ts - サイトマップ:
/mnt/data/yolo-web/src/app/sitemap.ts