I'm working on a new project using the yeoman backbone generator and drupal as a json data service. If anyone can share any SEO-specificy insights, alternative strategies, or any other gotchas they've encountered, it would be greatly appreciated.
I'm working on a new project using the yeoman backbone generator and drupal as a json data service. In previous similar projects, I've used rails and prerender.io to generate static html specifically for SEO. Are there similar solutions for drupal? I'm weighing if our team should
a) place the html pages into drupal theme templates and have drupal serve the pages and JSON output
OR
b) just have a static html server totally separate and have drupal only serve JSON output.
I'm thinking the advantage of option 'a' is drupal could cache complete pages, but the drawback is we might need to duplicate templates for drupal to render and for backbone to render. The advantage of option 'b' is that we can just create the backbone templates but we would have to add another tool (like prerender.io) to render SEO-friendly output.
If anyone can share any SEO-specificy insights, alternative strategies, or any other gotchas they've encountered, it would be greatly appreciated.
Comments
Isomorphic
For http://www.lullabot.com, we made the front end application isomorphic, so you get a fully rendered page on the first request, which is great for SEO, social sharing and non-JavaScript applications such as Pocket.
There is a presentation and a video about the whole architecture.
Senior Developer at Lullabot
https://www.lullabot.com/who-we-are/juampy-nr
Very interesting, thanks for
Very interesting, thanks for sharing! For the timeline on the project I'm currently working on, might be too much new stuff for our team too tackle. Will definitely look into for upcoming projects tho :-)
Another approach is to rely
Another approach is to rely on the hash bang syntax that Google supports because of Angular.
--
Portland Drupal Developer
Semi-headless Drupal
My company worked on a project with a similar issue — headless would make sense, but it would hurt SEO. However, using a little-known feature in hook_menu(), we were able to change how we served pages. This enabled front-end to use whatever framework they wanted, query data from Drupal via Ajax/json, and still have viable data for search engines to consume.
Of course, the hard part (if you don't want double the templates, is to use the same template code for both the server-side and client-side renders. Also, I haven't worked with yeoman, but I'm assuming it works as other frameworks might.
In your case, for the initial request, I would recommend generating json through Drupal and injecting that into templates through a lightweight use of Drupal's theming system. Asynchronous requests would only be served the json (and no template code).
So, the initial request would go something like this:
That's how search engines will see your page.
Now, if a user requests more data, browses, etc.
So, that's a lot of info, and even if it does make sense on a first read, there are still a lot of caveats and gotchas. I'm working on a module that does some of this work for developers. Let me know if you're interested, and I can put a sandbox up.
Enquiring if this module is still WIP or is available
Thanks for the approach. Just wanted to enquire if you actually have a repo with this module implementation which I can use in my project?
I am coming across the same issue in my project where we are using decoupled D8 for backend and react for frontend. Since, html is client side rendered SEO is taking a hit and we are looking for a solution for that.
prerender.io works
FWIW I have used prerender.io on a couple of js only front-end projects, one of which had some content managed by a Drupal CMS and another with a wordpress managed blog.