October 16, 2015
AngularJS SEO – google will index javascript sites
Google moves yet another step forward and indicates that single page application are getting more common. They just announced to drop the support of hashbang urls and crawl javascript sites without any pre-rendering (html snapshots) of the site – which is totally cool. But there are some limits regarding canonical tags as I discovered.
In order to get your single page application indexed it is required to implement the following steps:
- use the HTML5 History API
Which is very easy with ui-router. You’ll find further information in the article about migrating existing projects from hashbang to regular urls. - use sitemaps
From our point of view the google bot is able to fetch most sites without sitemaps, but you really should create a sitemap to cover all cases. Especially when you are having views whose urls will never be part of your menu structure or linked on your site. E.g. url with parameter chosen from a select box.
While the Meta Description and title tags will be perfectly recognized, google lacks of understanding canonical tags when they are generated from angular. Probably they will adjust this behavior in the near feature. If they wont you are advised to use Schema.org’s breadcrumbs.
Hint: Do not expect markup generated from angular to show up in the “Fetch as Google”. It wont! The result will only show the html file which calls your app. No angular generated html code / content. This does not mean that something went wrong.
If you are still not able to get your site in the google index make sure that you have sitemaps and try use of canonical tags or add your markup with JSON-LD in order to enhance googles understanding of the content.
When all of this wont help – use the comment section and post your link – we are looking forward to analyze some case studies.
theCodeCampus
Developer at 
Our knowledge is not simply gained through reading - it is trained, tested and constantly being expanded. Because first and foremost, we are all developers at W11K. The know-how that we acquire here as developers, consultants and information architects flows immediately into our training courses and articles for theCodeCampus.
I am having some major trouble getting Google to index my angular site. I’ve tried with and without html5 mode, but I can’t do an extensive sitemap because the HREFs are generated dynamically and more are added daily. The site is newsbrute.com, and I would love any help I can get; I’m desperate at this point.
Hello Keith,
as far as i can see your content is generated via rest api. Therefore it should be easy to generate a sitemap – you can update it frequently. What technology is handling your API?
Furthermore i’d remove the Hash in your URL. You are using ngRoute, i have no expierence with using it in HTML5 mode. I prefer ui-Router, think about switchting. After eanabling HTML5 mode you need to set up a redirect.
https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode
This + sitemaps will get your site into Googles index! If you have still troubles it may be because you dont have enough links pointing to your sites. Keep us updated on your results!
P.S. you have many network requests, maybe use a taskrunner based buildsystem to concat your files. Check out our fabs build system https://www.npmjs.com/package/fabs
Hi Can,
I’m having an issue with Google indexing a part of my site built in AngularJS.
Recently, we’ve switched domains and went to HTTPS. There was an issue with PhantomJS handling SSL (we’ve always generated the pages server side and delivered that to robots) and crawlers were unable to ‘get’ these pages. So in effort to resolve all the 5XX errors from crawlers swiftly, we stopped prerendering these pages to bots (since Google supposedly can crawl JS).
Google isn’t indexing these pages now. All our other pages on the new domain are having no issue getting indexed. Thanks for any help, I really appreciate it!
https://www.proreferral.com/experts/
Hello Michael,
sorry for the late response but as far as i can tell your problem is still present. We have multiple sites without HTML-prerenders, no issues so far.
I’ve looked at your site briefly – i think angular is not handling the routing isn’t it? What else is responsible for Client Side Routing? Make sure it uses the html 5 push state api & provide a sitemap. Usually this is enough. If you want further advice, describe who is responsible for Routing .
best regards,
Can