関連コンテンツブロック：内部リンクルール

関連コンテンツブロックとは、メイン本文の最後に配置される、手動で選択された短いリンクセットです。読者を最も有用な次のページへ導くと同時に、同じリンクを通じて内部オーソリティを伝達します。各リンク先には編集上の存在理由が必要であり、単なる共有タグだけでは不十分です。

レンダリングされた例は意図的に控えめです。見出しは選択肢を説明し、すべてのアンカーはリンク先を予測し、すべての理由は読者にそのページがなぜ次なのかを伝えます。ブロックは、それが締めくくる記事と競合しません。

このエレメントが重要な理由

有用なページを読み終えることは、決断のポイントを生み出します。読者は目の前の主題を理解したかもしれませんが、それを適用したり、選択肢を比較したり、前提条件を学んだり、製品へと進む必要があるかもしれません。関連コンテンツブロックは、その次のステップを見つける労力を軽減します。読者が選択する準備ができた瞬間に、グローバルナビゲーションに戻ったり再検索したりするよう求めるのではなく、目的のある小さなルートセットを提供します。

2つ目の役割はアーキテクチャに関するものです。内部オーソリティとは、リンクが同一サイト上のページ間で分配するのに役立つ重要性と文脈上の関連性のことです。リンクは2つのドキュメント間にエッジを作成します。その位置、アンカー、説明は、検索システムにそのエッジが何を表すかを伝えます。つまり、どのページが広範なオーソリティであり、どれがサブトピックをカバーし、どれが隣接するニーズに答えるのかということです。

機械抽出可能性とは、自動化システムがレイアウトから推測することなく、HTMLからそれらの関係を復元できることを意味します。セマンティックなナビゲーション領域、可視の見出し、通常のクロール可能なリンク、説明的なアンカー、およびリンク先ごとに1つのアイテムによって、ソース–関係–リンク先のクリーンなステートメントセットが公開されます。JavaScriptのみのカルーセル、画像のみのカード、および一般的なアンカーは、見た目が洗練されていても、これらのステートメントを不明瞭にします。

両方の役割はレビューに耐えなければなりません。クリックを獲得してもオーソリティを無関係なページに送るブロックはコンテンツモデルを損ない、正しいクラスターマップでも無関係なリンクがあると読者の決断のポイントを無駄にします。

使用すべきタイミング

このエレメントは、ページに2〜5つの信頼できる次のリンク先があり、その関係を1行で述べられる場合に使用します。これは、エバーグリーンな教育コンテンツ、商用説明ページ、比較、製品・カテゴリページ、ユースケースページ、および別のページが同じタスクや判断を真に前進させるケーススタudyに適しています。

テンプレートに空きスペースがあるからといって追加してはいけません。単一目的のコンバージョンページで必要なアクションが1つだけの場合は、クロージングコールトゥアクションのみで十分かもしれません。法的通知、アカウント画面、サポートインシデント、または短いユーティリティページには、意味のある編集上の続きがない場合があります。メイン本文がすでにナビゲーションカードで構成されているインデックスページに、それらを繰り返す2つ目のリストは必要ありません。

よくある見落とし例は以下の通りです。

• タグフィードは「このラベルを共有するものは何か？」という質問に答えるものであり、「この読者は次に何をすべきか？」に答えるものではありません。「アナリティクス」とタグ付けされた2つの記事は、異なるオーディエンスとステージを対象としている場合があります。
• 最近の投稿は関連性よりも公開日を優先します。新着性はニュース発見には有用ですが、関係性モデルではありません。
• 人気の投稿は現在の質問ではなく、集計トラフィックを最適化します。
• フッターサイトマップは広範な発見をサポートしますが、編集者が選んだ小さなパスではありません。
• 前へ/次へコントロールは公開順序を反映します。その順序自体が意図的なコースまたはシーケンスである場合にのみ有効です。
• インラインコンテキストリンクは、必要な時点で用語を説明したり主張をサポートしたりします。これらはこのブロックを補完しますが、ページ末尾での決断という役割を代替するものではありません。

選択はデフォルトで手動です。提案されたリンクごとに、編集者は「方法を適用する」「前提条件を定義する」「ここで紹介された2つのオプションを比較する」「実践での証拠を示す」などの理由を記録します。理由が単に「同じタグ」である場合は、その項目を削除します。

自動選択は、ニュースアーカイブ、ユーザー生成コレクション、またはアイテムごとのキュレーションには大きすぎるか変動の激しいインベントリでのみ許容されます。その場合でも、制御された候補セット、現在のURLと期限切れページの除外、時間が重要な場合の鮮度チェック、1つのタグを超えた関連性、安定したタイブレーカー、および編集者による上書きが必要です。

配置場所

ブロックは、完全なメイン本文の後、出典ブロックの後、ただしクロージングコールトゥアクションの前に配置します。その理由は順序にあります。出典は現在のページの証拠義務を閉じ、関連コンテンツは次の学習または評価パスを提供し、最後のコールトゥアクションは商用または製品パスを提供します。ページに出典ブロックがない場合、関連コンテンツは最後の実質的なセクションの後に続きます。

ページの別の場所に2つ目の関連コンテンツブロックを配置しないでください。重複した前へ/次へナビゲーション、密集したタグクラウド、または「こちらもおすすめ」と題された別のコレクションの横に置かないでください。1つの明確なレコメンデーション領域で十分です。

構成要素

レンダリングされた凡例：

1. セクション見出し： 「学んだことを適用する」や「次のオプションを比較する」など、関係性に名前を付けます。「関連」という汎用的なものは、リンク先が実際に異なるアクションにまたがる場合にのみ許容されます。
2. アイテムタイトル： 説明的なアンカーを提供し、リンク先の主要な価値を予測します。
3. リンク先URL： リダイレクトチェーンなしで、1つの正規のクロール可能な内部URLに解決されます。
4. サムネイル： 画像が実際の識別情報を持つ場合に、リンク先を区別するためにオプションで使用します。
5. 1行理由： このページが論理的な次のステップである理由をオプションで説明します。タイトルから関係が明らかでない場合は強く推奨されます。
6. ブロック境界： リンクをナビゲーションとしてグループ化しつつ、カード全体を曖昧なクリックターゲットにしないようにします。

凡例は画像内ではなくページ内に属します。そうすることで、選択可能、翻訳可能、そして支援技術に利用可能なままになります。

デザイン例

バリエーションは情報密度を変えるものであり、編集上のロジックを変えるものではありません。

テキストのみ： リンク先のタイトルで関係が明確になる場合のデフォルト。

理由付き： 異なるジャーニーステージの場合のデフォルト。理由はタイトルを言い換えるのではなく、関係性を追加します。

サムネイル付き： オリジナルの画像が認識に役立つ場合に限定されます。画像には寸法と有用な代替テキストが必要です。タイトルがすでにリンク先を指定している場合は空の代替テキストで構いません。

クロスピラー： 投稿タイプ、エレメント、ビジネスアプリケーション間の関係を明示します。タグではなく、レビュー済みのフロントマターから生成されます。

パラメータ

2つのアイテムは、ページの次のステップが狭く信頼できる分岐である場合にのみ許可されます。3〜5つが通常の範囲です。異なる次のニーズに応えるのに十分な選択肢を提供しつつ、各リンクを可視かつ意図的に保つには十分少ない数です。6つは、完全な小規模クラスターを公開しなければならないピラーページに対するハードな例外です。6つを超えるとディレクトリのようになり、各エッジの編集上のシグナルが弱まり、モバイルでのスキャンが負荷になります。

title属性が省略された場合、アイテム本文の最初の見出しから導出されることがあります。異なるテキストで両方を提供しないでください。理由は、単純な文の場合は属性に、インラインの強調が必要な場合は本文に配置します。2回表示してはいけません。

構文とコード例

正規のコンポーネント名は related-content です。ネストされた ::item{} 形式により、各リンク先のフィールドをまとめて保持し、並列配列がずれるのを防ぎます。

ポータブルMarkdownディレクティブ

:::related-content{heading="Continue with the playbook" variant="reason"}
::item{title="Write a reliable how-to guide" url="/seo-playbook/post-types/how-to-guide/" reason="Turn the element rules into a complete instructional page."}
::item{title="Structure an ultimate guide" url="/seo-playbook/post-types/ultimate-guide/" reason="Connect this element to a broad pillar and its supporting spokes."}
::item{title="Build a use-case page" url="/seo-playbook/post-types/use-case-page/" reason="Carry educational intent into a specific audience and outcome."}
:::

Hugoショートコード

{{< related-content heading="Continue with the playbook" variant="reason" >}}
  {{< item title="Write a reliable how-to guide" url="/seo-playbook/post-types/how-to-guide/" reason="Turn the element rules into a complete instructional page." />}}
  {{< item title="Structure an ultimate guide" url="/seo-playbook/post-types/ultimate-guide/" reason="Connect this element to a broad pillar and its supporting spokes." />}}
  {{< item title="Build a use-case page" url="/seo-playbook/post-types/use-case-page/" reason="Carry educational intent into a specific audience and outcome." />}}
{{< /related-content >}}

これはポータブルなターゲット契約であり、このリポジトリがショートコードを登録しているという主張ではありません。ライブの例はセマンティックHTMLを使用しており、レイアウト依存関係を追加しません。

WordPressブロックまたはショートコード

<!-- wp:amicited/related-content {"heading":"Continue with the playbook","variant":"reason"} -->
[related_item title="Write a reliable how-to guide" url="/seo-playbook/post-types/how-to-guide/" reason="Turn the element rules into a complete instructional page."]
[related_item title="Structure an ultimate guide" url="/seo-playbook/post-types/ultimate-guide/" reason="Connect this element to a broad pillar and its supporting spokes."]
[related_item title="Build a use-case page" url="/seo-playbook/post-types/use-case-page/" reason="Carry educational intent into a specific audience and outcome."]
<!-- /wp:amicited/related-content -->

WordPressは、ネストされたアイテムコントロールを持つ登録済み動的ブロックを使用する必要があります。ショートコード形式は、ネストされたブロックを保存できないシステム向けであり、公開前に登録する必要があります。

例

良い例：各リンクが異なる次のニーズに応える

:::related-content{heading="Put the method into practice" variant="reason"}
::item{title="Run the pre-publish QA checklist" url="/seo-playbook/process/checklists/pre-publish-qa/" reason="Verify links, evidence, accessibility, and page structure before release."}
::item{title="Build a how-to guide" url="/seo-playbook/post-types/how-to-guide/" reason="Apply the element inside a complete instructional format."}
::item{title="Adapt the playbook for SaaS" url="/seo-playbook/business-types/saas/" reason="Translate the shared rules into a product-led content journey."}
:::

これは、リンク先が明確でありながら関連している（検証、実装、ビジネス適応）ため機能します。アンカーは各ページが提供するものを述べ、理由は現在のページとの関係を説明しています。

悪い例：タグウィジェットが編集上の選択を装っている

:::related-content{heading="You may also like"}
::item{title="Read more" url="/blog/new-office/"}
::item{title="Click here" url="/features/ai-visibility/"}
::item{title="Latest post" url="/blog/quarterly-roundup/"}
::item{title="SEO" url="/seo-playbook/"}
::item{title="More SEO" url="/blog/old-seo-notes/"}
::item{title="Another article" url="/academy/how-to-export-prompt-data/"}
::item{title="Recommended" url="/case-studies/hz-containers/"}
:::

すべてのURLが解決しても、この例は失敗しています。7つの選択肢は範囲を超えています。アンカーはリンク先を予測していません。リンク先は会社のニュース、製品、アーカイブ、アカデミー、ケーススタディの意図を理由もなく混在させています。「最新」は日付ルール、「SEO」は広範すぎ、リンクがこの読者の次のタスクに役立つという証明は何もありません。

クラスター契約

トピッククラスターとは、1つの主題に関する計画的なページグループです。そのピラーは主題を整理する広範なページであり、スポークはその一部に答えるより狭いページです。関連コンテンツブロックは、その計画を実際のHTMLリンクに変換します。

• すべてのスポークはそのピラーにリンクします。これにより、読者は狭い回答がどこに属するかを理解し、スポークが孤立したエンドポイントになるのを防ぎます。
• ピラーはすべての現在のスポークにリンクします。クラスターに6つ以上のスポークがある場合は、すべてを1つの関連コンテンツブロックに詰め込むのではなく、ピラー本文内で整理されたセクションを使用します。
• 横方向のリンクは、読者が次のステップの関係を述べることができる場合にのみ、あるスポークから別のスポークに接続します。親を共有しているだけでは十分ではありません。
• 両方向が読者に役立つ場合、すべてのエッジは双方向です。逆方向のアンカーと理由は、ジャーニーが異なるため異なる場合があります。
• ページの削除、統合、またはリダイレクトは、それを指すすべての保存済みエッジのレビューをトリガーします。

このプレイブック内では、投稿タイプページは、それが必要とするエレメントと、それを適応させるビジネスタイプにリンクします。エレメントページは、それを使用する投稿タイプにリンクします。これらの関係は、クロスピラールールに従ってレビュー済みのフロントマターから生成されます。このページの postTypes 配列が投稿タイプリンクのソースであり、対応する投稿タイプのメタデータが戻りのエッジを提供します。生成はレンダリングを処理しますが、関係がメタデータに属するかどうかは編集者が判断します。

より広範なエレメント作成ルール は、そのメタデータが移植可能なままである方法を規定しています。タグを追加してウィジェットが正しく選択することを期待することで、欠落した編集上の関係を修復しようとしないでください。

アンカーテキストルール

アンカーテキストは、リンクの可視でクリック可能な文言です。読者がURLを読まなくてもリンク先を予測できるように記述します。「ハウツーガイドを構築する」は有用ですが、「続きを読む」「ここをクリック」「もっと学ぶ」およびベアURLは有用ではありません。

アンカーは自然に変化させつつ、リンク先の主題を保持します。「ハウツーガイドを作成する」と「指導ガイドを構成する」は機能しますが、無関係なキーワードの同義語は機能しません。リンク先にないテンプレート、計算機、価格、調査、チェックリストを約束しないでください。

ブロック内では、タイトルアンカーは一意である必要があります。2つのリンク先が同じタイトルを使用する場合は、区別するオーディエンス、方法、または成果を追加します。オプションの理由はアンカーの外側に配置し、クリックターゲットを簡潔に保ち、支援技術のリンクリストを有用に保ちます。

スキーママークアップとアクセシビリティ

特別なJSON-LDタイプは必要ありません。JSON-LDは構造化データのためのスクリプトベースの形式であり、Schema.orgはそれで一般的にエンコードされる共有語彙です。リンクは通常、それを囲む Article、TechArticle、Product、または WebPage の一部として残ります。RelatedContent スキーマタイプを発明しないでください。

ItemList は、それが本当に順序付けられた、または名前付きの編集リストであり、サイト全体のスキーマポリシーがそれを要求する場合にのみ、ブロックを記述することができます。使用する場合、itemListElement は表示されるアイテムの順序、URL、名前と一致する必要があります。隠れたリンク先や合成レーティングを追加しないでください。パンくずリストは異なる関係であり、これらのリンクを吸収してはいけません。

アクセシビリティは <nav> ランドマークから始まります。これは支援技術がナビゲーションとして識別できる領域です。aria-labelledby を通じて接続された可視の見出しを付けます。ARIAは、ネイティブHTMLだけでは不十分な場合に、インターフェース名と状態を公開するために使用される属性セットです。順序は通常ランキングを示さないため、<ul> を使用します。可視のキーボードフォーカスを維持し、タイトルをプライマリリンクにし、インタラクティブなカードを別のリンク内にネストしないでください。

サムネイルの代替テキストは、リンクされたタイトルと重複してはいけません。装飾的なサムネイルには空の代替テキストを使用します。画像が明確な情報を提供する場合は、その情報のみを説明します。ブロックは画像やJavaScriptを無効にしても完全に機能し、レコメンデーションが更新されてもキーボードフォーカスを移動させてはいけません。

作成ルール

デフォルトで3〜5つのアイテムを使用し、狭い分岐の場合は2つ、文書化された小規模クラスターのニーズがある場合は最大6つまで使用します。2〜8語の見出し、3〜12語のタイトルアンカー、オプションで8〜22語の理由を記述します。理由は1文、能動態、具体的な関係（適用、比較、検証、定義、診断、証拠を見る）を使用します。

すべてのアイテムには、理由がレンダリングされない場合でも、コンテンツモデル内で明確な編集上の理由が必要です。リンク先の見出しが変更された後はタイトルをレビューします。先頭と末尾にスラッシュがある正規の内部URLを使用します。トラッキングパラメータ、安定したセクションを識別しないフラグメント、リダイレクト、および現在のページへのリンクを削除します。

このエレメント内に広告、著者経歴、ソーシャルフォローボタン、ニュースレター申し込みフォーム、タグクラウド、無関係なプロモーション、または出典引用を決して配置しないでください。外部の読み物と内部の次のステップを混在させないでください。外部の証拠は出典ブロックに属します。「ベスト」「人気」「おすすめ」などのバッジは、ページが選択基準を定義しサポートしている場合を除き使用しないでください。

トーンは有益かつ具体的にし、緊急性を感じさせないようにします。「必読」「見逃せない」、人工的な希少性、およびリンク先の範囲がその言葉をサポートしない限り包括的であるという主張を避けます。ブロックはパスを推奨するものであり、重要性を製造するものではありません。

使用する投稿タイプ

フロントマターの postTypes 配列は、以下のクロスピラー関係の信頼できる情報源です。

すべての候補をすべてのページでレンダリングする必要はありません。投稿タイプは適格な関係を定義し、ページ編集者は実際の主題とジャーニーに適したリンク先を選択します。

QAチェックリスト

• ブロックは1回だけ、出典の後かつクロージングコールトゥアクションの前に表示される。
• ページには2〜5つのリンク、または6つを使用する文書化された理由がある。
• すべてのアイテムに、共有タグ、カテゴリ、または公開日を超えた記録済みの編集理由がある。
• 各アンカーはリンク先が実際に提供するものを予測し、「続きを読む」「ここをクリック」および類似の汎用的な表現を避けている。
• セットはクラスター契約をサポートしている：スポークからピラーへ、ピラーからスポークへ、横方向は真に関連する場合のみ。
• 現在のURLは除外され、リンク先は正規であり、リダイレクトやトラッキングパラメータに依存するリンクはない。
• 関連コンテンツのフロントマターがレンダリングされたクロスピラーリンクと一致している。
• ブロックはサムネイルやJavaScriptなしでも読み取り可能、ナビゲーション可能、かつ完全である。
• ナビゲーション領域に可視の見出しとアクセシブルな名前があり、キーボードフォーカスが可視である。
• サムネイルが存在し、識別価値を追加し、寸法を確保し、正しい代替テキストを使用している。
• 理由はタイトルを繰り返すのではなく、次のステップの関係を追加している。
• 出典、広告、フォーム、ソーシャルリンク、および無関係なプロモーションはブロック外に残っている。
• ItemList 構造化データは表示されるアイテムと順序に完全に一致している。
• モバイルレンダリングは、隠れた水平カルーセルなしですべてのタイトルと理由を表示している。

レビュー担当者は、もっともらしいだけのリンクを却下すべきです。各リンクは適切な次のステップであり、真のアーキテクチャ上のエッジを表現し、HTML内で明確であり続ける必要があります。

FAQ

アカデミーテンプレートは、フロントマターからFAQエントリをレンダリングします。