Category : Google | 6540 views
Webmaster Level: Advanced
Your site’s news feed or pinboard might use infinite scroll
—much to your users’ delight! When it comes to delighting Googlebot, however, that can be another story. With infinite scroll, crawlers cannot always emulate manual user behavior--like scrolling or clicking a button to load more items--so they don't always access all individual items in the feed or gallery. If crawlers can’t access your content, it’s unlikely to surface in search results.
To make sure that search engines can crawl individual items linked from an infinite scroll page, make sure that you or your content management system produces a paginated series (component pages) to go along with your infinite scroll.
Infinite scroll page is made “search-friendly” when converted to a paginated series -- each component page has a similar <title> with rel=next/prev values declared in the <head>.
You can see this type of behavior in action in the infinite scroll with pagination demo
created by Webmaster Trends Analyst, John Mueller
The example on the left is search-friendly, the right example isn’t -- the right example would cause crawling and indexing of duplicative content.
Structure URLs for infinite scroll search engine processing. Each component page contains a full URL. We recommend full URLs in this situation to minimize potential for configuration error.Good: example.com/category?name=fun-items&page=1Good: example.com/fun-items?lastid=567Less optimal: example.com/fun-items#1Test that each component page (the URL) works to take anyone directly to the content and is accessible/referenceable in a browser without the same cookie or user history.Any key/value URL parameters should follow these recommendations:Be sure the URL shows conceptually the same content two weeks from now.Avoid relative-time based URL parameters:
example.com/category/page.php?name=fun-items&days-ago=3Create parameters that can surface valuable content to searchers.
Avoid non-searcher valuable parameters as the primary method to access content:
Configure pagination with each component page containing rel=next and rel=prev
values in the <head>. Pagination values in the <body> will be ignored for Google indexing purposes because they could be created with user-generated content (not intended by the webmaster).
on the infinite scroll page. (The decision to use one or both is up to you and your site’s user behavior). That said, we recommend including pushState (by itself, or in conjunction with replaceState) for the following:Any user action that resembles a click or actively turning a page.To provide users with the ability to serially backup through the most recently paginated content.
Test!Check that page values adjust as the user scrolls up or down. John Mueller’s infinite-scroll-with-pagination site
demonstrates the scrolling up/down behavior.Verify that pages that are out-of-bounds in the series return a 404 response (i.e., example.com/category?name=fun-items&page=999 should return a 404 response if there are only 998 pages of content).Investigate potential usability implications introduced by your infinite scroll implementation
. Written, reviewed, or coded by John Mueller
, Maile Ohye
, and Joachim Kupke