How do search engines deal with AngularJS applications?

Issue

I see two issues with AngularJS application regarding search engines and SEO:

1) What happens with custom tags? Do search engines ignore the whole content within those tags? i.e. suppose I have

<custom>
  <h1>Hey, this title is important</h1>
</custom>

would <h1> be indexed despite being inside custom tags?

2) Is there a way to avoid search engines of indexing {{}} binds literally? i.e.

<h2>{{title}}</h2>

I know I could do something like

<h2 ng-bind="title"></h2>

but what if I want to actually let the crawler “see” the title? Is server-side rendering the only solution?

Solution

Update May 2014

Google crawlers now executes javascript – you can use the Google Webmaster Tools to better understand how your sites are rendered by Google.

Original answer
If you want to optimize your app for search engines there is unfortunately no way around serving a pre-rendered version to the crawler. You can read more about Google’s recommendations for ajax and javascript-heavy sites here.

If this is an option I’d recommend reading this article about how to do SEO for Angular with server-side rendering.

I’m not sure what the crawler does when it encounters custom tags.

Answered By – joakimbl

Answer Checked By – David Goodson (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.