seo-review
JavaScriptのコンセプトページを対象に集中的なSEO監査を実施し、検索表示の最大化・フィーチャースニペットの最適化・ランキングポテンシャルの向上を図ります。
description の原文を見る
Perform a focused SEO audit on JavaScript concept pages to maximize search visibility, featured snippet optimization, and ranking potential
SKILL.md 本文
スキル: 概念ページのSEO監査
このスキルを使用して、33 JavaScript Concepts プロジェクトの概念ドキュメンテーションページに対して焦点を絞ったSEO監査を実施します。目標は、JavaScriptの開発者にとって検索可視性を最大化することです。
使用時期
- 新しい概念ページを公開する前
- パフォーマンスの低いページを最適化するとき
- 定期的なコンテンツ監査
- 大規模なコンテンツ更新後
- 新しいキーワードをターゲットにするとき
目標
各概念ページは、以下のような検索でランク付けされるべきです:
- 「[概念] JavaScript とは」
- 「[概念] JavaScript の仕組み」
- 「[概念] JavaScript 解説」
- 「[概念] JavaScript チュートリアル」
- 「[概念] JavaScript 例」
SEO監査方法論
完全なSEO監査には、以下の5つのステップに従います。
ステップ1: ターゲットキーワードの特定
監査の前に、概念のキーワードクラスターを特定します。
キーワードクラスターテンプレート
| タイプ | パターン | 例(クロージャー) |
|---|---|---|
| プライマリ | [概念] JavaScript | closures JavaScript |
| 何か | what is [概念] in JavaScript | what is a closure in JavaScript |
| 仕組み | how does [概念] work | how do closures work |
| 使い方 | how to use/create [概念] | how to use closures |
| 理由 | why use [概念] | why use closures JavaScript |
| 例 | [概念] examples | closure examples JavaScript |
| 比較 | [概念] vs [関連] | closures vs scope |
| 面接対策 | [概念] interview questions | closure interview questions |
ステップ2: オンページSEO監査
すべてのオンページSEO要素を体系的にチェックします。
ステップ3: フィーチャードスニペット最適化
コンテンツがフィーチャードスニペットを獲得するための構造になっているか確認します。
ステップ4: 内部リンク監査
内部リンク構造をチェックします。
ステップ5: レポート生成
レポートテンプレートを使用して結果を文書化します。
概念別キーワードクラスター
各概念用の事前構築済みキーワードクラスターを使用します。
<AccordionGroup> <Accordion title="Call Stack"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript call stack, call stack JavaScript | | 何か | what is the call stack in JavaScript | | 仕組み | how does the call stack work | | エラー | maximum call stack size exceeded, stack overflow JavaScript | | ビジュアル | call stack visualization, call stack explained | | 面接対策 | call stack interview questions JavaScript | </Accordion> <Accordion title="Primitive Types"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript primitive types, primitives in JavaScript | | 何か | what are primitive types in JavaScript | | リスト | JavaScript data types, types in JavaScript | | 比較 | primitives vs objects JavaScript | | typeof | typeof JavaScript, JavaScript typeof operator | | 面接対策 | JavaScript types interview questions | </Accordion> <Accordion title="Value vs Reference Types"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript value vs reference, pass by reference JavaScript | | 何か | what is pass by value in JavaScript | | 仕組み | how does JavaScript pass objects | | 比較 | value types vs reference types JavaScript | | コピー | how to copy objects JavaScript, deep copy JavaScript | </Accordion> <Accordion title="Type Coercion"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript type coercion, type conversion JavaScript | | 何か | what is type coercion in JavaScript | | 仕組み | how does type coercion work | | 暗黙的 | implicit type conversion JavaScript | | 明示的 | explicit type conversion JavaScript | | 面接対策 | type coercion interview questions | </Accordion> <Accordion title="Equality Operators"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript equality, == vs === JavaScript | | 何か | what is the difference between == and === | | 比較 | loose equality vs strict equality JavaScript | | ベストプラクティス | when to use == vs === | | 面接対策 | JavaScript equality interview questions | </Accordion> <Accordion title="Scope and Closures"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript closures, JavaScript scope | | 何か | what is a closure in JavaScript, what is scope | | 仕組み | how do closures work, how does scope work | | タイプ | types of scope JavaScript, lexical scope | | ユースケース | closure use cases, why use closures | | 面接対策 | closure interview questions JavaScript | </Accordion> <Accordion title="Event Loop"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript event loop, event loop JavaScript | | 何か | what is the event loop in JavaScript | | 仕組み | how does the event loop work | | ビジュアル | event loop visualization, event loop explained | | 関連 | call stack event loop, task queue JavaScript | | 面接対策 | event loop interview questions | </Accordion> <Accordion title="Promises"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript Promises, Promises in JavaScript | | 何か | what is a Promise in JavaScript | | 使い方 | how to use Promises, how to chain Promises | | メソッド | Promise.all, Promise.race, Promise.allSettled | | エラー | Promise error handling, Promise catch | | 比較 | Promises vs callbacks, Promises vs async await | </Accordion> <Accordion title="async/await"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript async await, async await JavaScript | | 何か | what is async await in JavaScript | | 使い方 | how to use async await, async await tutorial | | エラー | async await error handling, try catch async | | 比較 | async await vs Promises | | 面接対策 | async await interview questions | </Accordion> <Accordion title="this Keyword"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript this keyword, this in JavaScript | | 何か | what is this in JavaScript | | 仕組み | how does this work in JavaScript | | バインディング | call apply bind JavaScript, this binding | | アロー | this in arrow functions | | 面接対策 | this keyword interview questions | </Accordion> <Accordion title="Prototypes"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript prototype, prototype chain JavaScript | | 何か | what is a prototype in JavaScript | | 仕組み | how does prototype inheritance work | | チェーン | prototype chain explained | | 比較 | prototype vs class JavaScript | | 面接対策 | prototype interview questions JavaScript | </Accordion> <Accordion title="DOM"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript DOM, DOM manipulation JavaScript | | 何か | what is the DOM in JavaScript | | 使い方 | how to manipulate DOM JavaScript | | メソッド | getElementById, querySelector JavaScript | | イベント | DOM events JavaScript, event listeners | | パフォーマンス | DOM performance, virtual DOM vs DOM | </Accordion> <Accordion title="Higher-Order Functions"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript higher order functions, higher order functions | | 何か | what are higher order functions | | 例 | map filter reduce JavaScript | | 使い方 | how to use higher order functions | | 面接対策 | higher order functions interview | </Accordion> <Accordion title="Recursion"> | タイプ | キーワード | |--------|-----------| | プライマリ | JavaScript recursion, recursion in JavaScript | | 何か | what is recursion in JavaScript | | 使い方 | how to write recursive functions | | 例 | recursion examples JavaScript | | 比較 | recursion vs iteration JavaScript | | 面接対策 | recursion interview questions | </Accordion> </AccordionGroup>監査チェックリスト
タイトルタグチェックリスト(4ポイント)
| # | チェック | ポイント | 確認方法 |
|---|---|---|---|
| 1 | 50~60文字の長さ | 1 | frontmatter の title で文字数をカウント |
| 2 | 前半にプライマリキーワード | 1 | 概念名が早期に表示されているか確認 |
| 3 | 「in JavaScript」で終わる | 1 | タイトルの終わりを確認 |
| 4 | 説得力のあるフックを含む | 1 | 読者に価値/利益を約束しているか |
スコアリング:
- 4/4: ✅ 優秀
- 3/4: ⚠️ 良い、マイナーな改善が可能
- 0-2/4: ❌ 大幅な改善が必要
タイトル公式:
[概念]: [理解すること] in JavaScript
良い例:
| 概念 | タイトル(文字数) |
|---|---|
| クロージャー | "Closures: How Functions Remember Their Scope in JavaScript" (58文字) |
| イベントループ | "Event Loop: How Async Code Actually Runs in JavaScript" (54文字) |
| Promise | "Promises: Handling Async Operations in JavaScript" (49文字) |
| DOM | "DOM: How Browsers Represent Web Pages in JavaScript" (51文字) |
悪い例:
| 問題 | 悪いタイトル | より良いタイトル |
|---|---|---|
| 短すぎる | "Closures" | "Closures: How Functions Remember Their Scope in JavaScript" |
| 長すぎる | "Understanding JavaScript Closures and How They Work with Examples" (66文字) | "Closures: How Functions Remember Their Scope in JavaScript" (58文字) |
| フックなし | "JavaScript Closures" | "Closures: How Functions Remember Their Scope in JavaScript" |
| 「JavaScript」がない | "Understanding Closures and Scope" | 最後に「in JavaScript」を追加 |
メタディスクリプションチェックリスト(4ポイント)
| # | チェック | ポイント | 確認方法 |
|---|---|---|---|
| 1 | 150~160文字の長さ | 1 | frontmatter の description で文字数をカウント |
| 2 | 動作動詞で開始 | 1 | 「Learn」「Understand」「Discover」(「Master」ではない) |
| 3 | プライマリキーワードを含む | 1 | 概念名 + 「JavaScript」が存在 |
| 4 | 具体的な価値を約束 | 1 | 読者が学ぶ内容をリスト表示 |
ディスクリプション公式:
[動詞] [それが何か] in JavaScript. [学ぶ具体的なもの]: [トピック1], [トピック2], and [トピック3].
良い例:
| 概念 | ディスクリプション |
|---|---|
| クロージャー | "Learn JavaScript closures and how functions remember their scope. Covers lexical scoping, practical use cases, memory considerations, and common closure patterns." (159文字) |
| イベントループ | "Discover how the JavaScript event loop manages async code execution. Understand the call stack, task queue, microtasks, and why JavaScript is single-threaded but non-blocking." (176文字 - カットが必要!) |
| DOM | "Learn how the DOM works in JavaScript. Understand how browsers represent HTML as a tree, select and manipulate elements, traverse nodes, and optimize rendering." (162文字) |
悪い例:
| 問題 | 悪いディスクリプション | 修正方法 |
|---|---|---|
| 短すぎる | "Learn about closures" | 150~160文字まで具体例で拡張 |
| 「Master」で開始 | "Master JavaScript closures..." | 「Learn JavaScript closures...」に変更 |
| あいまい | "A guide to closures" | カバーする具体的なトピックをリスト表示 |
| キーワード欠落 | "Functions can remember things" | 「closures」と「JavaScript」を含める |
キーワード配置チェックリスト(5ポイント)
| # | チェック | ポイント | 確認方法 |
|---|---|---|---|
| 1 | タイトルのプライマリキーワード | 1 | frontmatter の title を確認 |
| 2 | メタディスクリプションのプライマリキーワード | 1 | frontmatter の description を確認 |
| 3 | 最初の100語のプライマリキーワード | 1 | 導入段落をチェック |
| 4 | 少なくとも1つのH2見出しのキーワード | 1 | すべての ## 見出しをスキャン |
| 5 | キーワードスタッフィングなし | 1 | コンテンツは自然に読める |
キーワード配置マップ:
┌─────────────────────────────────────────────────────────────────────────┐
│ キーワード配置 │
├─────────────────────────────────────────────────────────────────────────┤
│ │
│ 🔴 クリティカル(キーワード必須) │
│ ───────────────────────────────── │
│ • タイトル frontmatter │
│ • ディスクリプション frontmatter │
│ • 最初の段落(100語以内) │
│ • 少なくとも1つのH2見出し │
│ │
│ 🟡 推奨(自然に含める) │
│ ────────────────────────────────── │
│ • 「学習内容」情報ボックス │
│ • H3サブ見出し │
│ • キーポイントセクション │
│ • 主要H2の後の最初の文 │
│ │
│ ⚠️ 避けるべき │
│ ───────────── │
│ • 1000語あたり同じフレーズが4回以上 │
│ • 代名詞がより適している場所にキーワードを無理やり含める │
│ • キーワードを入れるために不自然な文構造 │
│ │
└─────────────────────────────────────────────────────────────────────────┘
コンテンツ構造チェックリスト(6ポイント)
| # | チェック | ポイント | 確認方法 |
|---|---|---|---|
| 1 | 質問フックで開始 | 1 | 最初の段落で関心のある質問をしているか |
| 2 | 最初の200語にコード例 | 1 | 簡単な例が早期に表示されているか |
| 3 | 「学習内容」情報ボックス | 1 | 開始後に <Info> コンポーネントがある |
| 4 | 短い段落(2~4文) | 1 | 長いテキストブロックを確認 |
| 5 | 1,500語以上 | 1 | 単語数チェック |
| 6 | キータームは最初に太字 | 1 | 重要な用語は **太字** を使用 |
コンテンツ構造テンプレート:
┌─────────────────────────────────────────────────────────────────────────┐
│ 理想的なページ構造 │
├─────────────────────────────────────────────────────────────────────────┤
│ │
│ 1. 質問フック(最初の50語) │
│ 「JavaScriptはどのように...? なぜ...?」 │
│ │
│ 2. 簡潔な回答 + コード例(50~200語) │
│ 簡潔な説明 + シンプルなコードデモ │
│ │
│ 3. 「学習内容」情報ボックス │
│ 5~7個の箇条書き │
│ │
│ 4. 前提条件警告(該当する場合) │
│ 必要な先行概念へのリンク │
│ │
│ 5. メインコンテンツセクション(H2s) │
│ 各H2は質問に答えるか、概念を教える │
│ コード例、図表、テーブルを含む │
│ │
│ 6. よくある間違い/引っかかりやすい点セクション │
│ 人々を困惑させる内容 │
│ │
│ 7. キーポイント │
│ 8~10個の番号付きポイントですべてをまとめる │
│ │
│ 8. 知識をテストする │
│ 5~6個のQ&Aアコーディオン │
│ │
│ 9. 関連概念 │
│ 関連トピックにリンクする4つのカード │
│ │
│ 10. リソース(参考資料、記事、ビデオ) │
│ MDNリンク、選別された記事、ビデオ │
│ │
└─────────────────────────────────────────────────────────────────────────┘
フィーチャードスニペットチェックリスト(4ポイント)
| # | チェック | ポイント | 確認方法 |
|---|---|---|---|
| 1 | 「What is X」が40~60語の定義 | 1 | 「What is」H2の後の段落の単語数をカウント |
| 2 | 少なくとも1つのH2が質問形式 | 1 | 「What is」「How does」「Why」H2をチェック |
| 3 | 「How to」コンテンツは番号付きステップ | 1 | <Steps> コンポーネントまたは番号付きリストを使用 |
| 4 | 比較テーブル(該当する場合) | 1 | 「X vs Y」コンテンツのテーブル |
フィーチャードスニペットパターン:
┌─────────────────────────────────────────────────────────────────────────┐
│ フィーチャードスニペット形式 │
├─────────────────────────────────────────────────────────────────────────┤
│ │
│ クエリタイプ 勝利形式 コンテンツ │
│ ───────────── ────────── ──────────── │
│ │
│ 「What is X」 段落 40~60語の定義 │
│ H2の後、キーワードは太字 │
│ │
│ 「How to X」 番号付きリスト <Steps> コンポーネント または │
│ 1. 2. 3. マークダウン │
│ │
│ 「X vs Y」 テーブル | 機能 | X | Y | │
│ 比較表 │
│ │
│ 「X の種類」 箇条書き - **タイプ1** — 説明 │
│ - **タイプ2** — 説明 │
│ │
│ 「[X] 例」 コードブロック ```javascript │
│ + 説明 // コード例 │
│ ``` │
│ │
└─────────────────────────────────────────────────────────────────────────┘
定義段落の例(40~60語):
## JavaScript におけるクロージャーとは
**クロージャー**は、外側(外部)スコープの変数へのアクセスを保持する関数であり、その外側の関数の実行が終わった後もこのアクセスを保持します。JavaScriptではクロージャーが関数作成時に毎回作成され、内部関数が字句環境を「記憶」し、アクセスできるようにします。
(これは52語 - フィーチャードスニペットに完璧)
内部リンクチェックリスト(4ポイント)
| # | チェック | ポイント | 確認方法 |
|---|---|---|---|
| 1 | 本文に3~5個の関連概念リンク | 1 | 散文内の /concepts/ リンクをカウント |
| 2 | 説明的なアンカーテキスト | 1 | 「ここをクリック」「ここ」「これ」なし |
| 3 | 警告ボックスに前提条件 | 1 | 開始時に <Warning> とリンク |
| 4 | 関連概念セクションに4つのカード | 1 | 最後に4つのカード付き <CardGroup> |
良いアンカーテキスト:
| ❌ 悪い | ✓ 良い |
|---|---|
| 「ここをクリック」 | 「event loop概念」 |
| 「ここ」 | 「JavaScriptのクロージャー」 |
| 「この記事」 | 「Promiseガイド」 |
| 「もっと読む」 | 「コールスタックを理解する」 |
リンク配置戦略:
<!-- 前提条件(警告ボックス) -->
<Warning>
**前提条件:** このガイドは[Promise](/concepts/promises)と[イベントループ](/concepts/event-loop)を理解していることを前提としています。必要に応じて最初にそれらを読んでください。
</Warning>
<!-- 本文コンテンツ(自然な文脈) -->
コールバックが完了すると、タスクキューに追加されます — [イベントループ](/concepts/event-loop)で管理されます。
<!-- 関連概念セクション -->
<CardGroup cols={2}>
<Card title="Promises" icon="handshake" href="/concepts/promises">
async/awaitはPromiseの上に構築されています
</Card>
</CardGroup>
テクニカルSEOチェックリスト(3ポイント)
| # | チェック | ポイント | 確認方法 |
|---|---|---|---|
| 1 | ページあたり単一のH1 | 1 | # 見出しは1つのみ(タイトル) |
| 2 | URLスラッグにキーワード含む | 1 | /concepts/closures 「/concepts/topic-1 ではない |
| 3 | オーファンページなし | 1 | ページは少なくとも1つの別のページからリンク |
H1ルール:
すべてのページは、正確に1つのH1(メインタイトル)を持つべきです。これはSEOにとって重要です:
- H1はGoogleにページが何についてかを伝えます
- 複数のH1は検索エンジンをページ階層について混乱させます
- 他のすべての見出しはH2(
##)以下である必要があります - H1はプライマリキーワードを含むべきです
# JavaScriptのクロージャー ← これがH1(1つだけ!)
## クロージャーとは何か ← セクション用H2
### 字句スコープ ← サブセクション用H3
## クロージャーの仕組み ← 別のH2
URL/スラッグベストプラクティス:
| ✅ 良い | ❌ 悪い |
|---|---|
/concepts/closures | /concepts/c1 |
/concepts/event-loop | /concepts/topic-7 |
/concepts/type-coercion | /concepts/abc123 |
/concepts/async-await | /concepts/async_await |
スラッグのルール:
- プライマリキーワードを含める — 概念名はURLに含まれるべきです
- ハイフンを使う、アンダースコアではない —
event-loopではなくevent_loop - スラッグを短く読みやすく — 50文字以下
- UUID、データベースID、ランダム文字列なし
- 小文字のみ —
/concepts/Event-Loopではなく/concepts/event-loop
オーファンページ検出:
オーファンページは、他のページから内部リンクが指すないページです。これはSEOに悪影響を与えます:
- Googleが頻繁に発見またはクロールしない可能性があります
- ページが重要でないことをサイト構造に示しています
- ユーザーは自然にナビゲートできません
- リンク資産がページに流れません
オーファンページをチェックする方法:
- この概念へのリンクのコードベースを検索:
grep -r "/concepts/[slug]" docs/ - 少なくとも1つの別の概念の「関連概念」セクションに表示されることを確認
- それを前提条件としてリスト表示するページが適切にリンク戻されることを確認
- ナビゲーション(
docs.json)に含まれていることを確認
オーファンページを修正:
- 関連ページの「関連概念」CardGroupに概念を追加
- 関連概念の本文コンテンツで自然にリンク
- 関連する場所で双方向リンク(Aがbにリンクする場合、Bは関連がある場合Aにリンク戻す)を確認
スコアリングシステム
利用可能な総ポイント: 30
| カテゴリ | 最大ポイント |
|---|---|
| タイトルタグ | 4 |
| メタディスクリプション | 4 |
| キーワード配置 | 5 |
| コンテンツ構造 | 6 |
| フィーチャードスニペット | 4 |
| 内部リンク | 4 |
| テクニカルSEO | 3 |
| 合計 | 30 |
スコア解釈
| スコア | パーセンテージ | ステータス | アクション |
|---|---|---|---|
| 27-30 | 90-100% | ✅ 優秀 | 公開準備完了 |
| 23-26 | 75-89% | ⚠️ 良い | マイナーな最適化が必要 |
| 17-22 | 55-74% | ⚠️ 可 | いくつかの改善が必要 |
| 0-16 | <55% | ❌ 不可 | 大幅な作業が必要 |
よくあるSEO問題と修正
タイトルタグの問題
| 問題 | 現在 | 修正方法 |
|---|---|---|
| 短すぎる(<50文字) | 「クロージャー」(8文字) | 「Closures: How Functions Remember Their Scope in JavaScript」(58文字) |
| 長すぎる(>60文字) | 「Understanding JavaScript Closures and How They Work with Examples」(66文字) | 「Closures: How Functions Remember Their Scope in JavaScript」(58文字) |
| キーワード欠落 | 「スコープについて」 | 概念名を追加: 「Closures: Understanding Scope in JavaScript」 |
| フックなし | 「JavaScriptのクロージャー」 | メリットを追加: 「Closures: How Functions Remember Their Scope in JavaScript」 |
| 「JavaScript」欠落 | 「クロージャー解説」 | 最後に追加: 「Closures Explained in JavaScript」 |
メタディスクリプションの問題
| 問題 | 現在 | 修正方法 |
|---|---|---|
| 短すぎる(<120文字) | 「クロージャーについて学ぶ」(20文字) | 150~160文字まで具体例で拡張 |
| 長すぎる(>160文字) | [切り詰められる] | 容赦なく編集、重要情報を保持 |
| 「Master」で開始 | 「Master JavaScript closures...」 | 「Learn JavaScript closures...」に変更 |
| キーワード欠落 | 「記憶する関数」 | 「closures」と「JavaScript」を含める |
| あいまい | 「クロージャーのガイド」 | 具体的にリスト: 「X、Y、Zをカバー」 |
コンテンツ構造の問題
| 問題 | 修正方法 |
|---|---|
| 質問フックなし | 「どのように...?」または「なぜ...?」で開始 |
| コード例が遅い | 最初の200語に簡単な例を移動 |
| 情報ボックスなし | 「学習内容」付きの <Info> を追加 |
| 長い段落 | 2~4文のチャンクに分割 |
| 1,500語未満 | 深さ、例、エッジケースを追加 |
| 太字用語なし | キータームを最初に太字にする |
フィーチャードスニペットの問題
| 問題 | 修正方法 |
|---|---|
| 「What is」定義なし | 40~60語の定義段落を追加 |
| 定義が長すぎる | 40~60語に絞る |
| 質問形式のH2なし | 「What is X?」または「How does X work?」H2を追加 |
| ステップが番号付けされていない | <Steps> またはマークダウン番号付けを使用 |
| 比較テーブルなし | 「X vs Y」セクションのテーブルを追加 |
内部リンクの問題
| 問題 | 修正方法 |
|---|---|
| 内部リンクなし | 関連概念へのリンク3~5個を追加 |
| 悪いアンカーテキスト | 「ここをクリック」を説明的なテキストに置換 |
| 前提条件なし | 前提条件リンク付きの <Warning> を追加 |
| 関連概念が空 | 関連トピックへのリンク4つのカードを追加 |
テクニカルSEOの問題
| 問題 | 修正方法 |
|---|---|
| 複数のH1タグ | # 見出しは1つのみ(タイトル)を保持、すべてのセクションに ## を使用 |
| スラッグにキーワード欠落 | ファイル名を概念名を含めるように変更(例:closures.mdx) |
| オーファンページ | 関連概念ページの本文または関連概念セクションからリンクを追加 |
| スラッグにアンダースコア | ハイフンを使用: event-loop.mdx ではなく event_loop.mdx |
| スラッグに大文字 | 小文字のみを使用: async-await.mdx ではなく Async-Await.mdx |
| スラッグが長すぎる | プライマリキーワードに短縮: closures.mdx ではなく understanding-javascript-closures-and-scope.mdx |
SEO監査レポートテンプレート
このテンプレートを使用して結果を文書化します。
# SEO監査レポート: [概念名]
**ファイル:** `/docs/concepts/[slug].mdx`
**日付:** YYYY-MM-DD
**監査者:** [名前/Claude]
**総スコア:** XX/30 (XX%)
**ステータス:** ✅ 優秀 | ⚠️ 作業が必要 | ❌ 不可
---
## スコアサマリー
| カテゴリ | スコア | ステータス |
|--------|--------|---------|
| タイトルタグ | X/4 | ✅/⚠️/❌ |
| メタディスクリプション | X/4 | ✅/⚠️/❌ |
| キーワード配置 | X/5 | ✅/⚠️/❌ |
| コンテンツ構造 | X/6 | ✅/⚠️/❌ |
| フィーチャードスニペット | X/4 | ✅/⚠️/❌ |
| 内部リンク | X/4 | ✅/⚠️/❌ |
| テクニカルSEO | X/3 | ✅/⚠️/❌ |
| **合計** | **X/30** | **ステータス** |
---
## ターゲットキーワード
**プライマリキーワード:** [例:「JavaScriptのクロージャー」]
**セカンダリキーワード:**
- [キーワード1]
- [キーワード2]
- [キーワード3]
**検索インテント:** 情報提供 / ハウツー / 比較
---
## タイトルタグ分析
**現在のタイトル:** 「[frontmatterの現在のタイトル]」
**文字数:** XX文字
**スコア:** X/4
| チェック | ステータス | 注記 |
|--------|---------|------|
| 50~60文字 | ✅/❌ | XX文字 |
| 前半にプライマリキーワード | ✅/❌ | [注記] |
| 「in JavaScript」で終わる | ✅/❌ | [注記] |
| 説得力のあるフック | ✅/❌ | [注記] |
**問題点:** [あれば]
**推奨タイトル:** 「[推奨タイトル]」(XX文字)
---
## メタディスクリプション分析
**現在のディスクリプション:** 「[frontmatterの現在のディスクリプション]」
**文字数:** XX文字
**スコア:** X/4
| チェック | ステータス | 注記 |
|--------|---------|------|
| 150~160文字 | ✅/❌ | XX文字 |
| 動詞で開始 | ✅/❌ | 「[単語]」で開始 |
| プライマリキーワード | ✅/❌ | [注記] |
| 具体的な価値 | ✅/❌ | [注記] |
**問題点:** [あれば]
**推奨ディスクリプション:** 「[推奨ディスクリプション]」(XX文字)
---
## キーワード配置分析
**スコア:** X/5
| 場所 | 存在 | 注記 |
|-----|------|------|
| タイトル | ✅/❌ | [注記] |
| メタディスクリプション | ✅/❌ | [注記] |
| 最初の100語 | ✅/❌ | XX語で発見 |
| H2見出し | ✅/❌ | 発見場所: 「[H2テキスト]」 |
| 自然な読みやすさ | ✅/❌ | [スタッフィングなし / スタッフィング検出] |
**キーワード配置が欠落:**
- [ ] [キーワードを追加すべき場所]
---
## コンテンツ構造分析
**単語数:** X,XXX語
**スコア:** X/6
| チェック | ステータス | 注記 |
|--------|---------|------|
| 質問フックで開始 | ✅/❌ | [注記] |
| 最初の200語にコード | ✅/❌ | コード表示の位置: XX語 |
| 「学習内容」ボックス | ✅/❌ | [存在/欠落] |
| 短い段落 | ✅/❌ | [段落長についての注記] |
| 1,500語以上 | ✅/❌ | X,XXX語 |
| 太字用語 | ✅/❌ | [注記] |
**構造上の問題:**
- [ ] [問題と推奨]
---
## フィーチャードスニペット分析
**スコア:** X/4
| チェック | ステータス | 注記 |
|--------|---------|------|
| 40~60語の定義 | ✅/❌ | 現在XX語 |
| 質問形式H2 | ✅/❌ | 発見: 「[H2]」 / 発見なし |
| 番号付きステップ | ✅/❌ | [注記] |
| 比較テーブル | ✅/❌/N/A | [注記] |
**スニペット機会:**
1. **「[概念]とは」スニペット:**
- 現在の定義: XX語
- アクション: [40~60語に拡張/短縮]
2. **「[アクション]方法」スニペット:**
- アクション: [Stepsコンポーネント追加 / すでに存在]
---
## 内部リンク分析
**スコア:** X/4
| チェック | ステータス | 注記 |
|--------|---------|------|
| 本文に3~5リンク | ✅/❌ | X個のリンク発見 |
| 説明的なアンカーテキスト | ✅/❌ | [注記] |
| 警告ボックスに前提条件 | ✅/❌ | [存在/欠落] |
| 関連概念セクション | ✅/❌ | Xカード存在 |
**現在の内部リンク:**
1. [アンカーテキスト] → `/concepts/[slug]`
2. [アンカーテキスト] → `/concepts/[slug]`
**追加推奨リンク:**
- [セクション/文脈]で[概念]へのリンク
- [セクション/文脈]で[概念]へのリンク
**見つかった悪いアンカーテキスト:**
- XX行目: 「ここをクリック」 → 「[説明的なテキスト]」に変更
---
## テクニカルSEO分析
**スコア:** X/3
| チェック | ステータス | 注記 |
|--------|---------|------|
| ページあたり単一H1 | ✅/❌ | [X個のH1タグ発見] |
| URLスラッグにキーワード | ✅/❌ | 現在: `/concepts/[slug]` |
| オーファンページでない | ✅/❌ | X個の別ページからリンク |
**見つかったH1タグ:**
- XX行目: `# [H1テキスト]` ← これだけがあるべき
- [変更が必要な追加H1のリスト]
**スラッグ分析:**
- 現在のスラッグ: `[slug].mdx`
- キーワード含む: ✅/❌
- 形式が正しい: ✅/❌(小文字、ハイフン、特殊文字なし)
**見つかったインバウンドリンク:**
1. `/concepts/[他の概念]` → [セクション]でこのページにリンク
2. `/concepts/[他の概念]` → 関連概念でリンク
**オーファンページの場合、以下からリンクを追加:**
- [推奨概念ページ] in [セクション]
- [推奨概念ページ] in 関連概念
---
## 優先度別修正
### 高優先度(最初に実施)
1. **[問題]**
- 現在: [現在の状態]
- 推奨: [あるべき状態]
- 影響: [なぜこれが重要か]
2. **[問題]**
- 現在: [現在の状態]
- 推奨: [あるべき状態]
- 影響: [なぜこれが重要か]
### 中優先度
1. **[問題]**
- 推奨: [修正]
### 低優先度(あると良い)
1. **[問題]**
- 推奨: [修正]
---
## 競合分析(オプション)
**「[プライマリキーワード]」でランク上位のページ:**
1. **[競合1 - URL]**
- 得意なこと: [観察]
- 単語数: 約X,XXX
2. **[競合2 - URL]**
- 得意なこと: [観察]
- 単語数: 約X,XXX
**私たちの優位性:**
- [私たちがより良いこと]
**埋めるべきギャップ:**
- [競合社が持っていて私たちが欠落していること]
---
## 実装チェックリスト
修正を行った後、以下を確認:
- [ ] タイトルは50~60文字で、キーワードとフックを含む
- [ ] ディスクリプションは150~160文字で、動詞と価値を含む
- [ ] プライマリキーワードはタイトル、ディスクリプション、最初の100語、H2に含まれる
- [ ] 質問フックで開始
- [ ] 最初の200語にコード例
- [ ] 「学習内容」情報ボックスが存在
- [ ] 段落は2~4文
- [ ] 総単語数1,500語以上
- [ ] キータームは最初に太字
- [ ] フィーチャードスニペット用に40~60語の定義
- [ ] 少なくとも1つの質問形式H2
- [ ] 説明的なアンカーテキスト付き3~5個の内部リンク
- [ ] 該当する場合、警告ボックスに前提条件
- [ ] 関連概念セクションに4つのカード
- [ ] ページあたり単一H1(タイトルのみ)
- [ ] URLスラッグにプライマリキーワード含む
- [ ] ページは少なくとも別の1概念ページからリンク
- [ ] すべての修正を実装し確認
---
## 最終推奨
**公開準備完了:** ✅ はい / ❌ いいえ - [理由]
**次回レビュー予定日:** [再監査時期、例:「3か月後」または「大規模更新後」]
クイックリファレンス
文字数
| 要素 | 理想的な長さ |
|---|---|
| タイトル | 50~60文字 |
| メタディスクリプション | 150~160文字 |
| 定義段落 | 40~60語 |
キーワード密度
- 1,000語あたりの完全一致フレーズは3~4回を超えないこと
- 自然にバリエーションを使用(例:「closures」「closure」「JavaScript closures」)
コンテンツ長
| 長さ | 評価 |
|---|---|
| <1,000語 | 薄すぎる - 深さを追加 |
| 1,000-1,500語 | 最小限の実行可能 |
| 1,500-2,500語 | 良い |
| 2,500-4,000語 | 優秀 |
| >4,000語 | 分割を検討 |
まとめ
概念ページをSEOで監査するときは:
- ターゲットキーワードを特定 その概念用のキーワードクラスターを使用
- タイトルタグをチェック — 50~60文字、キーワード最初、フック、「JavaScript」で終わる
- メタディスクリプションをチェック — 150~160文字、動詞、キーワード、具体的な価値
- キーワード配置を確認 — タイトル、ディスクリプション、最初の100語、H2
- コンテンツ構造を監査 — 質問フック、早期コード、情報ボックス、短い段落
- フィーチャードスニペット用に最適化 — 40~60語の定義、番号付きステップ、テーブル
- 内部リンクをチェック — 3~5リンク、良いアンカー、関連概念セクション
- レポート生成 — スコア、問題、優先度付き修正を文書化
覚えておく: SEOはサーチエンジンをだますことではなく、それを必要とする開発者がコンテンツを見つけやすくすることです。すべての最適化はまた読者体験も改善すべきです。
ライセンス: MIT(寛容ライセンスのため全文を引用しています) · 原本リポジトリ
詳細情報
- 作者
- leonardomso
- ライセンス
- MIT
- 最終更新
- 不明
Source: https://github.com/leonardomso/33-js-concepts / ライセンス: MIT
関連スキル
doubt-driven-development
重要な判断はすべて、本番環境への展開前に新しい視点から対抗的レビューを実施します。速度より正確性が重要な場合、不慣れなコードを扱う場合、本番環境・セキュリティに関わるロジック・取り消し不可の操作など影響度が高い場合、または後でバグを修正するよりも今検証する方が効率的な場合に活用してください。
apprun-skills
TypeScriptを使用したAppRunアプリケーションのMVU設計に関する総合的なガイダンスが得られます。コンポーネントパターン、イベントハンドリング、状態管理(非同期ジェネレータを含む)、パラメータと保護機能を備えたルーティング・ナビゲーション、vistestを使用したテストに対応しています。AppRunコンポーネントの設計・レビュー、ルートの配線、状態フローの管理、AppRunテストの作成時に活用してください。
desloppify
コードベースのヘルスチェックと技術負債の追跡ツールです。コード品質、技術負債、デッドコード、大規模ファイル、ゴッドクラス、重複関数、コードスメル、命名規則の問題、インポートサイクル、結合度の問題についてユーザーが質問した場合に使用してください。また、ヘルススコアの確認、次の改善項目の提案、クリーンアップ計画の作成をリクエストされた際にも対応します。29言語に対応しています。
debugging-and-error-recovery
テストが失敗したり、ビルドが壊れたり、動作が期待と異なったり、予期しないエラーが発生したりした場合に、体系的な根本原因デバッグをガイドします。推測ではなく、根本原因を見つけて修正するための体系的なアプローチが必要な場合に使用してください。
test-driven-development
テスト駆動開発により実装を進めます。ロジックの実装、バグの修正、動作の変更など、あらゆる場面で活用できます。コードが正常に動作することを証明する必要がある場合、バグ報告を受けた場合、既存機能を修正する予定がある場合に使用してください。
incremental-implementation
変更を段階的に実施します。複数のファイルに影響する機能や変更を実装する場合に使用してください。大量のコードを一度に書こうとしている場合や、タスクが一度では完結できないほど大きい場合に活用します。