SEO 公開日: 2024.04.25 更新日: 2024.05.20

ページネーションのSEOにおけるベストプラクティス

pickup
ページネーション_アイキャッチ

ページネーションとは、長いコンテンツをいくつかのページに分割する時に使います。Webページのコンテンツの最下部に表示されていることが多く、オンラインストアの商品リストや、Web検索結果のページングなどで見かけたことがあるのではないでしょうか。

1ページあたりに大量のコンテンツがあり、ユーザーが何度もスクロールをするのは不便な際に使用されます。

今回は、Webサイト内におけるページネーションの役割や実装方法、実装時に気をつけたいポイントなどを、ヒトノテならではの観点で解説していきます。ページネーションの実装にお悩みの方は参考にしてみてください。

ページネーションのSEO観点での役割

ページネーションは、過去の記事や、ソート順では優先順位の低い商品など、様々な詳細ページをGoogleに継続的に評価してもらうために必要な仕掛けです。

そのため、多くの詳細ページに対して、少ないクリック数で辿れる設計にしておくことが重要です。

ページネーションは大きく3パターンある

何気なくWebページに使用されているページネーションですが、その種類は大きく分けて3パターンあります。

 ①複数のページにジャンプできる

最もよく見られるのがこのパターンではないでしょうか。

1ページごとに数字が割り振られ、どのページにいても好きなページに行き来できます。

②前後2ページに遷移できる

続いて、<前へ 次へ>と表示されているパターンです。

いたってシンプルで分かりやすいですが「2ページ前に戻りたい!」「一気に最後のページまでいきたい!」といったユーザーの細かいニーズには応えられないページネーションでもあります。

③無限スクロール

昨今のGoogle検索で取り入れられているページネーションです。

スクロールすると、どんどん次のページが表示されていきます。時々赤枠のように「もっと見る」が表示され、クリックするとさらに次のページが見られる仕様になっています。

SEOにおいてベストは数字のページネーション

では実際に、Webサイトに実装するにはどのパターンのページネーションがいいのか考えた時に、ヒトノテではSEOの観点で①の数字のページネーションをおすすめしています。

あえておすすめの順位をつけるなら、①>②>③となります。
①の数字パターンであれば、1ページ目から1クリックで深いページまで辿れるため、少ないクリックで深いページをGoogleに認識してもらうことができます。

②のパターンの場合、「前へ」「次へ」のページしか読み込まれません。

また、③の無限スクロールのパターンではクローラーが2ページ目以降のコンテンツを認識することができないため、ヒトノテでは非推奨としています。無限スクロールでもURLが変化する実装方法もありますが、やはり1回で遷移できるページ数が少なくなるため推奨していません。

ページネーション実装におけるSEOのベストプラクティス

ページネーションを実装する際に多くのクライアント様から質問をいただくのが「canonical / noindex をどう制御するか」です。

ベストプラクティスはGoogle含め多くのWebサイトで出されていますが、改めてお伝えすると2ページ目、3ページ目、4ページ目…全てのページをGoogleに認識させる必要があります。古い記事にもしっかりクロールしてもらうためです。

そのため、canonicalは「自己参照canonical」、「noindexは付与しない」のが基本です。

その際、1ページ目とそれ以降のページの評価分散を気にするWeb担当者の方が多いのですが、これが起きないように実装時にいくつかのポイントをおさえる必要があります。

ここからは、ページネーションの実装時に気をつけたいポイントを解説していきます。

①titleタグ、meta descriptionをユニーク化する

各ページのtitleタグやmeta descriptionをユニーク化させましょう。同じ設定になっていると評価分散を起こしてしまう可能性があります。

例えばヒトノテの当メディアの場合、titleタグは以下のようにページごとにユニーク化しています。

▼1ページ目のtitleタグ

▼2ページ目のtitleタグ

② 1ページ目と2ページ目以降のコンテンツに差分をつける

meta descriptionだけではなく、コンテンツにも差分をつけましょう。

ここで例を挙げます。

バイトルのWebサイトで「アルバイト 渋谷」を検索します。
すると一覧ページが表示されますが、ページの最下部には下記のようなコンテンツが表示される仕組みになっています。

引用:渋谷区のバイト・アルバイト・パートの求人・募集情報|【バイトル】で仕事探し

このコンテンツは2ページ目以降には存在せず、1ページ目のみ表示されています。

このようにコンテンツの内容でも、1ページに評価が集まるよう差分をつけることができます。

③ 内部リンクを1ページ目に集める

内部リンクを受ける総量がページ評価に比例するため、1ページ目に内部リンクを集中させることが効果的です。具体的な施策としては下記の通りです。

2ページ目以降のパンくずを1ページ目に戻すようにします。

具体例として、「じゃらん」Webサイトで京都駅周辺のホテル情報を探した際の一覧ページのパンくずを見てみましょう。

引用元:京都駅周辺のホテル – 宿泊予約は<じゃらん>

赤枠で囲んだ箇所がパンくずです。いつでも1ページ目の「京都駅周辺」に戻れるようにパンくずが設定されています。

続いては「HOME’S」Webサイトで東京駅周辺の賃貸物件を探した際の一覧ページのパンくずを見てみましょう。

引用元:【ホームズ】東京都の賃貸 物件一覧(4ページ)|賃貸住宅[賃貸マンション・アパート]の検索・賃貸情報

HOME’Sでも、4ページ目現在からいつでも1ページ目の「東京都の賃貸 物件一覧」に戻れるようにパンくずが設定されていることがわかります。

④URLは2ページ目以降をパラメーターにするのが理想的

1ページ目以降のページに関しては、URLをパラメータにするのが理想的です。

下記のように「-」などでURLを設定してしまうと同列となり、1ページ目を親に、2ページ目以降を子にする親子関係にするのが難しくなってしまいます。

例)
▼1ページ目
https://hitonote.co.jp/column/seo/page-1/
▼2ページ目
https://hitonote.co.jp/column/seo/page-2/

そのため、2ページ目以降のURLはパラメーターにできると理想的です。

例)
▼1ページ目
https://hitonote.co.jp/column/seo/
▼2ページ目
https://hitonote.co.jp/column/seo/?page=2
▼3ページ目
https://hitonote.co.jp/column/seo/?page=3

パラメーター以外にも、「/」で区切って親子関係にすることもできます。

例)
▼1ページ目
https://hitonote.co.jp/column/seo/
▼2ページ目
https://hitonote.co.jp/column/seo/page2.html
▼3ページ目
https://hitonote.co.jp/column/seo/page3.html

パラメーターと「/」で区切る方法は、どちらとも効果的には差分はありません。

ただし、パラメーターでのやり方の方がURLの定義としてページ送りだということがわかりやすいので、ヒトノテではややベターと考えています。

まとめ

今回はページネーションの概要や役割、実装時の注意点などをお伝えしました。

さりげなくWebページに設置されているページネーションですが、ポイントを抑えた実装をしているかしていないかで、Googleからの評価に差がついてしまいます。今一度、自社のWebサイトのページネーションがどのような仕様になっているか、しっかり設置できているか確認してみてください。

ヒトノテでは、ページネーションに限らず、さまざまな観点でお客様のWebサイトの流入やCVが増えるようご支援させていただいております。

SEOの観点でサイトが設計できているか確認して欲しい、最近流入が落ちてしまったが原因がわからない、流入は伸びているのにCVが増えない…など、お悩みのある方はお気軽にご相談ください。

元リクルートのSEO責任者へ無料相談

    送信することで、プライバシーポリシーに同意したものといたします。