16

I have read a great deal of discussions about javascript templating and Search Engine Optimization. Still, I haven't found a satisfying answer to the question (either poorly-documented or outdated).

Currently I am looking into handlebars.js as a client-side template solution, because I love the possibility to create helper functions. But what about indexing for search engines? Does the bot index the generated content (as intended) or only the source with the ugly javascript pseudo-variables? I know that there are lots of threads going on about this matter but I feel that nobody does exactly know the answer.

If engines like Google would not index these templates properly, why would one bother using this for public websites?

Another question within this context: Is it possible to render Handlebar.js templates on server side and then present them onto the client side? Obviously to avoid all this SEO discussion.

Maarten
  • 635
  • 2
  • 8
  • 22

6 Answers6

23

For dom crunching client side, most web bots (i.e. Google and others) don't interpret js on the fly and parse newly rendered content for indexing. Instead Google (and now Bing) support the 'Google Ajax Crawling Scheme' (https://developers.google.com/webmasters/ajax-crawling/docs/getting-started) - which basically states that IF you want js rendered dom content to be indexed (i.e. rendering ajax call results), you must be able to:

  1. Trigger the async js rendering via the url using hashbangs #! (i.e. http://www.mysite.com/#!my-state), and
  2. Be able to serve a prerendered dom snapshot of your site AFTER js modification on request.

If using a client side MVC framework like Backbone.js, or Spine - you will need to provide this service if you want your web app indexed.

Generally this means you intercept a request made by the web bot (explained on the link above), and scrape your side server side using a headless browser (i.e. QT + capybara-webkit, HtmlUnit, etc.), then deliver the generated dom back to the requesting bot.

I've started a gem to do this in ruby (now taking pull requests) at https://github.com/benkitzelman/google-ajax-crawler

It does this as rack middleware using capybara-webkit (and soon phantomjs)

Sébastien Lorion
  • 88
  • 6
Ben
  • 1,203
  • 13
  • 8
  • UPDATE: The gem has been published on RubyGems and can be used by any Rack app as middleware `gem install google_ajax_crawler` instructions and examples for usage are at the Github link above – Ben Mar 16 '13 at 12:24
  • So if you were to use Backbone.js you would have to make sure you are using a router? – unclejam Jan 31 '14 at 06:27
  • How you structure your JS app is largely unimportant. You could use Backbone routers, or alternatively, you could be manipulating the dom without using any framework - the tricky bit is determining when you page has reached a rendered state in the headless browser so you are taking a snapshot at the right time. Most snapshotting frameworks add some sort of signalling fn to your page, the idea being that you call it when you page has completed loading / rendering. – Ben Feb 03 '14 at 00:02
  • 1
    Note that this is deprecated: http://googlewebmastercentral.blogspot.com/2015/10/deprecating-our-ajax-crawling-scheme.html – nikk wong Nov 29 '15 at 04:29
1

I do not know about Handlebar.js, but for my understanding SEO have some problem with CONTENT in JAVASCRIPT. Make sure your content is visible to Search Engine (use a spyder simulator for some test). Avoid spyder traps generally would be the way to go. Hope it could help you.

GibboK
  • 71,848
  • 143
  • 435
  • 658
0

Search engines don't run JavaScript, so if you want to have your content indexed you'll need to render your templates on the server as well. You can use handlebars in Node (server-side JS) to render your template there when the page request comes from a spider. It's more work but it's possible. Github, google plus, and twitter all do something similar.

geddesign
  • 9
  • 1
-1

See Spiderable for a temporary solution Meteor project (which uses Handlebars.js) uses for SEO purposes.

http://docs.meteor.com/#spiderable

ustun
  • 6,941
  • 5
  • 44
  • 57
-1

You could use Distal templates which puts the templates as part of the HTML for SEO.

Kernel James
  • 3,752
  • 25
  • 32
-2

Does the bot index the generated content (as intended) or only the source with the ugly javascript pseudo-variables?

Neither, because indexer bots don't run JavaScript and you don't serve up templates as HTML documents.

Build a site that works without JavaScript, then build on top of it.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • I agree, better work with JS that modify the DOM in the browser like jquery. So you can have the best of both... great effect from JS and semantic html content. – GibboK Oct 08 '11 at 21:16
  • 2
    "There is increasing evidence Googlebot can execute javascript and parse content generated by Ajax calls as well" http://en.wikipedia.org/wiki/Googlebot – Otto Allmendinger Feb 15 '12 at 10:29
  • This was true until HTML5 moved us from documents to applications. – Lodewijk Jul 25 '14 at 14:43