Infinite Scrolling - How to Make Infinite Scrolling SEO Friendly.

Screengrab of Mashable Homepage
Screengrab of Mashable Homepage

Infinite scrolling is a technique which is gaining in popularity. Seen in news and social sites, such as Mashable, Facebook, Twitter and Pinterest, site users are able to continue accessing content through scrolling down the page and without having to click.

To accomplish infinite scrolling, a website must recognise when a site user is at a certain point in a page (typically done with JavaScript), perform a call for the content to append on the end (this time using AJAX) and must be able to receive and send back the content required (usually achieved with a server-side language such as PHP).

As some of you may or may not know, search engines ability to parse, understand and use JavaScript is a best poor, which means they will struggle to understand the code your site will be using. Further, a search engine crawler will fail to trigger the event of scrolling down the page, which is an integral requirement to trigger the calls which pull the remainder of the content.

If the content is not requested, it simply does not exist in the code of the page, which may mean that search engines will not see all of the content available.

How to Test if Your Content is Being Seen by Search Engines

The easiest way to assess whether your content is being crawled by search engines it to navigate to Google and type cache:http://www.yoursiteaddress.com making sure to click on “text only version”. If you are using this technology it usually safe to assume the Search Engines will not be able to index all of the content, however it is still worth checking to make sure.

Screengrab of text only cache (Hubpages)
Screengrab of text only cache (Hubpages)

Progressive Enhancement/Graceful Degradation

In order to deal with this issue, we must look to how we can make the content found when scrolling, available without the need to trigger the required Javascript events. A popular way to achieve this end is through the use of progressive enhancement or graceful degradation. These two terms really only differ in their perspective, the first being the matter of putting your mind to progressively enhancing the site you are working on and the other the action of making sure that for less capable browsers the site is prepared to degrade complicated functionality and layout code so to provide an alternative for older/less able browsers.

When designing or auditing a page which includes infinite scrolling, it is recommended to start with a paginated series of pages. Through creating a series of pages which are easy to index, the search engines will be able to pass through the site and access all of the content, without any need for JavaScript. If you do not want these pages to be available in the search engines index, you can use the Meta Robots Meta or Server Response tag, to indicate that you would like to noindex/follow page 2 onwards.

Screengrab of Google Pagination Links
Screengrab of Google Pagination Links

With your paginated series of pages, you can now begin to add your infinite scrolling technology. Through overlaying this additional functionality you provide site users with capable browsers the benefit of this feature, whilst assuring those who have JavaScript blocked (including search engines) are equally able to access your content.

That pretty much concludes this post, if you would like any more help or have any questions, please do not hesitate to leave a message in the comments.


Thanks

Comments 1 comment

Cacy Forgenie profile image

Cacy Forgenie 3 years ago

Hi,

Thank you for this post on infinite scrolling and SEO.

I recently created Wordpress site with infinite scrolling and realized that Google and search engines will not see new content. I have about 36 posts, how can I make the changes you suggest? Should I add pagination, submit the sitemaps to Google then remove pagination?

I must confess I am a bit confused on how to have both pagination and infinite scroll so Google can see the content.

Your advice is welcomed.

Cacy

    Sign in or sign up and post using a HubPages Network account.

    0 of 8192 characters used
    Post Comment

    No HTML is allowed in comments, but URLs will be hyperlinked. Comments are not for promoting your articles or other sites.


    Click to Rate This Article
    working