本文へ移動
Coffee Break Again AIと育てる、サイト制作の研究室

Field note

CBAの記事末尾に、読む理由付きの関連記事カードを二つ置いた実画面
PR表記の解説を読み終えた人へ、見出しと余白の改善記事を案内しています。

ブログの関連記事の選び方と設置方法|記事末尾の改善例

読み終えたあと、次の記事が見つからない。CBAの記事末尾へ関連記事を追加した前後を比べ、リンク先の選び方、読む理由の書き方、AIへの指示を説明します。

ブログに関連記事がないと、読後の案内が見つからない

「関連記事もないね」。PR表記の解説記事を整えたあと、記事の終わりに案内がないことを指摘されました。本文の最後には見出しの装飾記事へのリンクがありましたが、読み終えた人が次の内容を選べる関連記事の枠はありませんでした。

そのまま下へ進むと、サイト全体の案内があるフッターに着きます。記事の中で分かったことはあっても、「自分のブログを次にどこから直そう」と思った人には、もう一度メニューから探してもらう形でした。

今回追加したのは、記事の内容に合う次の読み物です。読み終わった人を無理に引き留めるのではなく、続きを知りたい人が選べるようにします。

関連記事の追加前後を、実際の記事末尾で比べる

次の画面は、CBAのPR表記の解説記事で、関連記事を付ける前と付けたあとを撮ったものです。「悪い例」は記事内容の間違いではなく、読後の選択肢がまとまっていない表示の例として扱っています。

変更前・変更後を切り替えると、同じページの同じ場所を比べられます。

関連記事枠のないCBAのPR記事末尾。本文内のリンクの下はサイト共通フッターへ続く
悪い例:末尾の案内なし:2026年9月30日の実画面。追加でページの高さが変わるため、本文の縦位置は異なります。 PCの原寸画像 / スマホの原寸画像
同じ記事末尾に、見出し装飾と余白の関連記事が読む理由付きで並ぶ
良い例:関連記事あり:2026年9月30日の実画面。追加でページの高さが変わるため、本文の縦位置は異なります。 PCの原寸画像 / スマホの原寸画像

追加したのは「見出しのデザイン」と「余白と文字サイズ」の2本です。PRの文言や置き場所を決めた人が、その周囲の表示を直すときに使える内容を選びました。

PCでは二列、スマホでは一列にしています。長いタイトルを小さい文字に押し込まず、本文と同じ幅の中で、読む理由と一緒に見られるようにしました。クリック数や売上への効果を測った比較ではなく、次の記事への入口を追加した記録です。

関連記事の選び方は「次に何をしたいか」から考える

同じカテゴリーの記事でも、読後の疑問と合うとは限りません。PR表記を付けた直後の人に、サーバーの乗り換え記事を出しても、今やりたい修正とは離れます。カテゴリー名だけでなく、次にする作業を考えます。

  • 今の記事を実行するために、先に知っておきたいことがあるか。
  • 一つできたあと、次に整えたい場所はどこか。
  • 別の方法と迷う人へ、比較できる記事があるか。

CBAのPR記事から見出しの記事へは、「PRの置き場所が決まったら、タイトルや章の見出しも読みやすく整える」と理由を添えています。余白の記事へは、「表示文や表が詰まって見えるとき、文字の周囲に取る余白を決める」としました。何が分かるかを読み分けられる二つです。

リンク先が今の記事とほぼ同じ答えなら、関連記事を増やす前に内容を整理します。分担が曖昧なときは、記事の重複を防ぐ計画で、それぞれが答える問いを並べてみてください。

今回は2本に絞りました。これは読者が選びやすい量を考えた、このサイトの編集判断です。どのブログでも必ず2本、という決まりではありません。案内したい記事が一つなら、理由のある一つを置くところから始められます。

関連記事の設置場所と内部リンクの文言を整える

本文中のリンクは、その説明を読んでいて詳しく知りたくなった人のために置きます。末尾の関連記事は、一記事を読み終えたあとに次の行動を選ぶ場所です。両方を同じ役目だと考えず、読む場面に合わせます。

カードの題名にはリンク先の記事名を使い、その下に読む理由を一文添えました。「こちら」「おすすめ」だけでは、移動先の内容が分かりません。Googleの案内でも、リンクの文字は具体的で、元のページとリンク先の両方に関係する内容が勧められています。Google検索セントラルのリンクに関する説明

自分のサイトでは、WordPressのテーマなどに関連記事の設定があれば、まず表示位置と選ばれる記事を見ます。自動で並ぶ場合も、タイトルを読んで今の記事とつながるかを確認します。AIと作ったサイトなら、共通の記事ページに案内枠を用意し、記事ごとにリンク先と理由を持たせる方法があります。

CBAでは、すでに末尾の案内がある旧記事は残し、新しい記事で抜けていた案内を共通の部品で補いました。記事の追加時に関連記事も決めると、本文だけ完成して案内を忘れる状態を防ぎやすくなります。

関連記事の追加をAIへ頼む指示例と、修正後の見方

AIへ任せるときも、単に最新の記事を並べるのではなく、読者が次にすることを伝えます。候補と選んだ理由を一緒に見せてもらうと、自分で判断できます。

[対象記事URL]の末尾に関連記事を追加してください。
この記事を読み終えた人は、次に[やりたいこと・残る疑問]を考えます。

公開済みの記事から候補を選び、読む理由を一文ずつ示してください。
今回の記事と同じ答えを繰り返すページは避け、候補を2本に絞ってください。
タイトルだけでなく、その記事で次に何が分かるかを添えてください。

本文と同じ幅にそろえ、スマホでは一列で表示してください。
既存の関連記事枠がある場合は二重に作らず、その内容を見直してください。
未公開ページ、自分自身、同じリンクの重複、リンク切れがないか確認してください。
追加前後を同じ記事・画面幅で見せてください。

追加したら、実際にリンク先を開きます。理由に書いた答えがそこにあるか、タイトルだけ似た別の内容ではないか、スマホでカードが重なっていないかを確かめましょう。

まずは読んでほしい一記事の最後へ進み、「この次に何を知りたいだろう」と考えてみてください。その問いに答えるページと、読む理由の一文がそろえば、関連記事の入口を作れます。