What is the right approach to SEO for multiple URLs with the same content and infinite scroll?

Question

We have a search page for a children's website with infinite scroll. For example we have the main URL (which receives the most traffic) like:

www.example.com/children/raincoats/

We show users up to 10 pages. The URLs look like:

www.example.com/children/raincoats/page-1
www.example.com/children/raincoats/page-2
www.example.com/children/raincoats/page-3

We also have query string parameters in URLs for filtering the results. For example:

www.example.com/children/raincoats/page-1/?color=blue&fabric=plastic
www.example.com/children/raincoats/page-2/?color=blue&fabric=plastic

We have kept "www.example.com/children/raincoats/" as canonical for all these URLs. Is it correct to use canonical? I read that canonical is to point to pages with the same content but these pages have different listings/content despite a similar look.
Currently we are having rel="next" link and rel="prev" link on all such pages but if we get any such request we change ‘page-3’ to ‘page-1’ via JavaScript and fetch ‘page-1’ results. So if some hits "www.example.com/children/raincoats/page-3", the user/bot/crawler would be shown "www.example.com/children/raincoats/page-1" results. What harm could using JavaScript to handle rel="next" have? Since ‘page-3’ and ‘page-1’ are different URLs showing the same results, would Google penalize us for doing this?
Should ‘next’ and ‘prev’ rel links have all the query string (sort parameters)? If yes, how do I avoid them to be crawled since I want users to land on my main page through SEO "www.example.com/children/raincoats/page-1" and do not want its SEO juice to be split among pages.

1. Correct 2. Don't redirect anyone 3. Implement view all in search results to divert SEO juicy to canonical url. — Goyllo, Commented Feb 9, 2017 at 8:43
I can't implement view all due to performance constraints. But i will use rel="next" and rel="prev". The canonical for "www.example.com/children/raincoats/page-3" would be "www.example.com/children/raincoats/page-3". Correct? — maverick, Commented Feb 9, 2017 at 9:11
The question is edited, and now I am little bit confuse. If the page-3 content is not similar to anyone like /page-1 or parent directory, then feel free to use /page-3 as canonical link. Rel next prev will also works fine, just make sure only the title and theme look same on your all pages like /page-1 , page-2 , but the body content on that pages (page-1, page-2) should be different. Might this link help you — Goyllo, Commented Feb 9, 2017 at 18:09

John Mueller · Accepted Answer · 2017-02-15 14:44:26Z

To your questions:

The top paginated item isn't equivalent to the other pages, it wouldn't be considered the canonical page for the whole set. A view-all page would work though.
If fetching page 3 returns page 1, that's broken :). In that case, pages 2+ would never get indexed. If there's no missing content on, or linked from, pages 2+, then maybe that's not such a big deal for you though.
That sounds like it would be wrong... I'd check out the blog post on faceted navigation for other ways to handle this. There's also one on infinite scroll, if you're curious.

1 Answer 1