技術ブログ
ページネーションのSEO最適化 — 無限スクロールvs番号付きページ
約5分で読めます
ページネーションがSEOに与える影響
ページネーション(ページ分割)は、大量のコンテンツを複数のページに分割して表示する手法です。ECサイトの商品一覧、ブログの記事一覧、検索結果ページなど、多くのWebサイトでページネーションが使われています。しかし、ページネーションの実装方法を誤ると、クロール効率の低下、重複コンテンツの発生、リンク評価の分散といったSEO上の問題を引き起こす可能性があります。
Googleは2019年にrel="prev"とrel="next"タグをサポート終了したことを発表しました。これにより、ページネーションのSEO対策はより一層、適切なサイト構造とクロール制御に依存するようになりました。
ページネーションの方式比較
番号付きページネーション
最も一般的な方式で、「1, 2, 3...」のページ番号を表示し、ユーザーが任意のページに直接アクセスできます。
- SEOのメリット:各ページが個別のURLを持ち、Googlebotがクロールしやすい。深い階層のコンテンツにもアクセス可能
- SEOのデメリット:ページ数が多いと、クロールバジェットを消費する。類似コンテンツによる重複問題が発生しやすい
- UXの特徴:ユーザーが現在位置を把握しやすく、特定のページに戻りやすい
無限スクロール(インフィニットスクロール)
ページの下部に到達すると自動的に次のコンテンツが読み込まれる方式です。SNSのタイムラインやPinterestなどで採用されています。
- SEOのメリット:ユーザーの滞在時間が延びやすい
- SEOのデメリット:JavaScriptに依存するため、Googlebotがコンテンツをクロールできない可能性がある。個別のURLがないとインデックスが困難
- UXの特徴:シームレスなブラウジング体験を提供するが、特定のアイテムに戻りにくい
「もっと読む」ボタン(Load More)
番号付きページネーションと無限スクロールの中間的な方式です。ユーザーがボタンをクリックすると追加コンテンツが読み込まれます。
- SEOのメリット:クロール用のフォールバックURLを設定しやすい
- UXの特徴:ユーザーに読み込みの制御権を委ねるため、意図しないデータ消費を防げる
SEO最適化のベストプラクティス
番号付きページネーションの最適化
- 自己参照canonical の設定:各ページネーションページに自己参照のcanonicalタグを設定する。全ページを1ページ目にcanonicalするのは誤り
- ページタイトルの差別化:「商品一覧 - ページ2」のように、各ページのタイトルを差別化する
- 1ページ目のみインデックス:2ページ目以降にnoindexを設定し、1ページ目のみインデックスさせる方法もある
- View Allページの提供:サーバーリソースが許す場合、全アイテムを表示する「すべて表示」ページを用意する
- 内部リンク構造の工夫:すべてのページが3クリック以内でアクセスできるようリンク構造を設計する
無限スクロールのSEO対策
無限スクロールを採用する場合、Googlebotが全コンテンツにアクセスできるようにフォールバック対策が必須です。
- フォールバックURLの設定:JavaScriptが無効な環境でもアクセスできるページ分割URLを用意する
- pushState APIの活用:スクロールに応じてブラウザのURLを更新し、各セクションに固有のURLを持たせる
- サーバーサイドレンダリング:SSRを導入し、Googlebotにも完全なHTMLを返す
ページネーション戦略の選択基準
どの方式を採用するかは、サイトの特性とユーザーの行動パターンに基づいて判断しましょう。ECサイトの商品一覧やニュースサイトのアーカイブなど、ユーザーが特定のアイテムを探す場合は番号付きページネーションが適しています。一方、ギャラリーサイトやソーシャルフィードなど、ブラウジング中心の利用パターンでは無限スクロールや「もっと読む」ボタンが効果的です。SEOとUXのバランスを考慮し、最適な方式を選択しましょう。
SEO
ページネーション
テクニカルSEO
UX