「まずはここから」テーブルをコンテンツサイトのトップページに置く理由：読者の入口設計
はじめに
学習サイトやドキュメントサイトを作るとき、コンテンツが増えるほどサイドバーのリンク数も増えます。管理する側としては整理できているつもりでも、初めて来た読者の視点では「どこから読めばよいかわからない」という状態になります。この問題を解決するために、トップページに「まずはここから」テーブルを設置しました。
なぜ離脱が起きていたか
このサイトの初期のトップページには、カテゴリ別のリンク一覧がありました。「Astro」「Claude」「ハーネス設計」など複数のカテゴリが並び、その中に記事へのリンクが並ぶ構造です。
サイトを知っている人が特定の記事を探すときはこの構造が有効です。しかし「AI学習サイトとして紹介されたので見に来た」という初めての読者にとっては、カテゴリ名とリンクの量が情報として多すぎ、「何から始めればよいかわからない」状態になります。
目標が明確でないまま複数の選択肢を示されると、読者は選択を保留してページを離れやすくなります。
「まずはここから」テーブルとは
「まずはここから」テーブルとは、初めて来た読者に向けて、読み進める順序を示す表です。
このサイトで設置したテーブルは、読者のレベル別（AIツールをまだ使っていない人・使い始めた人・設計を深めたい人）に分けて、それぞれ最初に読む記事を2〜3本選んで示しています。各行には記事タイトル、リンク、おおよその所要時間を含めています。
テーブルの目的は「何から読むかを決める時間を短くすること」です。初めての読者が「自分のレベルを確認して、対応する行を見る、そこに書いてある記事を読む」という流れで進められるよう設計しています。
AIと一緒に設計した手順
テーブルの設計は、次の手順で進めました。
ステップ1：読者ペルソナを定義する
「このサイトに来る読者は誰か」を整理しました。「AIツールを聞いたことはあるが、まだ自分では使っていないエンジニア」「Claudeを使い始めたが、より体系的に学びたい人」「AIを使ったコンテンツ管理の仕組みに興味がある人」という3つのペルソナを設定しました。
ステップ2：ペルソナごとに最初に読む記事を選ぶ
各ペルソナが「まず知っておくべきこと」の起点となる記事を選びました。選定基準は「この記事を読まないと次の記事の前提が理解しにくい」という依存関係の観点です。
ステップ3：テーブルに整理する
選んだ記事をペルソナごとにテーブルにまとめました。この段階でAIに「テーブルとして読みやすい形に整理してください」と依頼し、列の構成や表現を調整しました。
ステップ4：定期的に見直す
記事が追加されたとき、テーブルに含める記事を見直します。テーブルに古い記事だけが並んでいると、サイトの状態を反映していない案内になります。
設置後の変化
テーブルを設置してから、トップページから記事への遷移が増えました。また「どの記事を最初に読むべきですか」という問い合わせが減りました。
テーブル自体はシンプルな表ですが、「初めての読者が最初の10秒で次の行動を決められる」という設計上の目的に対して、有効に機能しています。
まとめ
「まずはここから」テーブルは、初めての読者が「どこから読むか」を短時間で決められるよう、読者ペルソナ別に最初に読む記事を示した表です。コンテンツが増えてサイドバーが複雑になるほど、入口を明確にする設計の重要性が高まります。読者ペルソナを定義してから記事を選ぶという手順で、テーブルの選定基準が明確になります。