0

The following website is a good example of a crawlable AJAX website (HTML5 + CSS3 + AJAX) using history.pushState():

http://html5.gingerhost.com/

(for background see https://moz.com/blog/create-crawlable-link-friendly-ajax-websites-using-pushstate)

However, this website assumes that the dynamic content can be rendered server side at page load. For example, if you land directly on http://html5.gingerhost.com/seattle, the content related to Seattle is not loaded through AJAX, it's already in the page.

Let's assume that the content can only be loaded through AJAX calls. How can I make such a website crawlable ?

My specific goal is to make this website crawlable: http://code-exercises.com/programming/

At the moment, all programming exercises are loaded through AJAX. I would like to have programming/easy/exercise-number-one.

My website is served by an NGINX instance that serves static content and forwards all AJAX request to a Tomcat instance.

7
  • "Let's assume that the content can only be loaded through AJAX calls. How can I make such a website crawlable ?" — Poorly. And that's a false assumption, which usually comes down to not wanting to make the effort.
    – Quentin
    Mar 13, 2016 at 17:24
  • "I would consider solutions to render the content … server side." contradicts "Let's assume that the content can only be loaded through AJAX calls."
    – Quentin
    Mar 13, 2016 at 17:25
  • @Quentin currently my content is only available through RESTful calls, I would consider solutions to render this content server side but I don't know how to do it. I would consider solution to render the content both server and client side.
    – kms333
    Mar 13, 2016 at 17:27
  • Pick a server side programming language. Replicate the work of the client side code.
    – Quentin
    Mar 13, 2016 at 17:28
  • @Quentin I see your point, but I still would like to use AJAX for performance reasons, similar to what's been done on html5.gingerhost.com
    – kms333
    Mar 13, 2016 at 17:29

2 Answers 2

1

Option 1: The Easy One, use prerender.io

Option 2: in your app build process include a Phantom.js to make static versions of your pages

Option 3: if you use Angular, you can migrate to angular2, or other framework with server-side rendering

0

Take a look at how to make a angular app crawlable.

Basically, you will have to have a cached version of the page with the data loaded that will be served to web crawlers.

https://prerender.io/ this is an example of it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.