The recommended method for indexing AJAX content in 2018: search foresight publishes a demo
Ecrit par Mathieu CHAPON
le
By default, search engines won’t try to crawl and index the contents loaded in Ajax. So using this technology potentially places you at a major disadvantage as regards effective SEO.
Google first introduced a method to facilitate the discovery of Ajax content back in 2009: this was the so-called « hash-bang » method. However, this solution was declared obsolete in 2015, and for several years Google has advocated the use of another approach in HTML 5 which exploits the potential of the JavaScript pushState method.
But all this is very technical, so how will you get to understand how it works, and how will you be able to show a developer how to code well in Ajax while still remaining SEO compatible?
The Search Foresight demo
To help to understand the principle of the method recommended by Google, we published an online demo of the use of the approach advocated by Google in two typical cases:
- loading the content of a page in Ajax
- an infinite scrolling page
To view the demo
How does the pushState method make a page crawlable in Ajax?
To understand the practical functioning of this code, just click on the « Nantes » or « Paris » tab on the demo site:
- the tab content is dynamically modified after loading Ajax content
- the URL of the page in the navigation bar is changed without reloading the page
- SEO tags are dynamically modified (title, meta description etc …
Why do these action allow Ajax-loaded content to be indexed? Because Google interprets URL changes in the browser produced by using the pushState () method as if it were reading the URL of a new page, reloaded in the conventional way.
The method has been described by Google in this article:
Create a crawlable virtual pagination on an infinitely scrolling page
If you click on the link « infinite scroll demo », you will see a second possible implementation of this approach at work, which creates a crawlable paging using the pushState () method.
Scrolling through the page, you will notice that after a while:
– the loaded contents generate a change of URL in the browser’s URL bar
– the tags are dynamically modified (in particular the link tags rel = [next/prev])
Want to use Ajax calls, and use the LA technology recommended by Google? Then just give the URL of our demo to your technical team, and tell them to take inspiration from the (ultra-simplified) code presented in this demo.
Warning: this approach is not a miracle solution, it’s just a more « elegant » fix. In 2018, it is still not recommended to generate JavaScript content on the browser side. If your site SEO is of strategic importance to you, then you should move away from Ajax and JavaScript frameworks generating content in the user’s browser.
Reminder: in May 2018, Google will change its behaviour on urls incorporating #!
From the second quarter of 2018, Google has announced that it will stop managing URLs containing « #! » under the old Ajax crawling scheme. Practically speaking, this means that when the crawler meets this type of url, it will no longer look for an alternative version: it will then seek to crawl the page directly in Ajax!