無限スクロールのSEO上の懸念点と対処法

自サイトの制作において、無限スクロールを検討する場面もあるでしょう。
無限スクロール（ロングスクロール）とは、ユーザーがページの遷移をすることなくスクロールのみで次々とコンテンツを閲覧することができるような仕組みです。
ただし、無限スクロールは場合によっては検索エンジンが読み込みにくく、SEOに問題を起こしてしまう可能性があります。

ここでは、無限スクロールの概要やSEO上での懸念点、それを踏まえたうえでの実装について説明します。

無限スクロールのメリット

どんなに素晴らしいコンテンツがあるページでも、ページの遷移（切り替え）を何度も行わなればならなかったり、ローディング（読み込み時間）が長いと訪問者は去ってしまいます。

無限スクロールはこのような課題を解決するための手法の１つで、ユーザーはリンクをクリック（タップ）することなく、スクロールだけでコンテンツの閲覧が可能になります。
コンテンツの表示領域が限られるスマホアプリや、Facebookやtwitterなどフィード型のアプリ（Webページ含む）などで使われています。

SEO上の懸念点と対処法

無限スクロールはSEOにおいては懸念点があることも指摘されています。
無限スクロールでは、ある程度までスクロールを行うと改めてコンテンツの読み込みを行います。
このときGoogleのクローラーは必ずしもユーザーと同じようにスクロール→javascriptによる追加読み込みという動きを再現できず、全てのコンテンツを見つけられるわけではないためです。

対策としては、読み込みを行う個々のアイテムに個別にURLを割り振る方式で実装することが推奨されています。
こうすることで、ユーザーには１つのページのように見えても、検索エンジンは個々のURLにアクセスすれば全てのコンテンツを確認できます。

ここで、個々のページには順にrel=”prev/next”を設定しておくことが必要です。
この設定は、そのページの前と後ろのページをそれぞれ指定するページネーションで、検索エンジンはそのうち１つのページを発見できれば、ページネーションによって数珠つなぎ式に一連のページを認識することが可能になります。

このように、無限スクロールは長いページを分割し、構造的に複数の分割されたページにすることでコンテンツ全体をクロールされる確率が高くなります。

実装における注意点

ページ間での重複はNG

重複の程度によりますが、分割した個々のアイテムに重複があるのは好ましくありません。

同じURLは常に同じコンテンツを返すようにする

たとえばコンテンツの新着順に無限スクロールページを作成しているような場合で、新着順にURLを設定して個々のページURLを設定しているような場合では、新しいコンテンツが配信されるとその前後で同じURLであってもコンテンツは変わってしまいます。

http://example.com/page?num=1
このようなURLにて無限スクロールを設定している場合、新たなコンテンツが配信された場合にはnum=1にあったコンテンツはnum=2に移動することになります。
前後でnum=1にあったコンテンツが変わってしまうと、Googleはページがあることは認識できても、コンテンツの内容を理解することが難しくなります。
このようなことを避けるために、配信の順番ではなくコンテンツごとに固有のURLを設定する必要があります。