Angular and SEO indexing

Question

I am struggling to find a complete, definitive and up-to-date answer to the Angular SEO problem.

I have an Angular app that has a single main template index.html with multiple views. Views are handled like so:

app.config(["$routeProvider", function($routeProvider) {

  $routeProvider

  .when("/", {
    templateUrl : "views/home.html",
    controller  : "HomeController",
    title: "Home"
  })

  .when("/about", {
    templateUrl : "views/about.html",
    controller  : "AboutController",
    title: "About"
  });

}]);

Now when I go to www.example.com/#/about I get the about page.

The problem: Google does not seem to index the links or content in views.

I've seen tutorials explaining how Google now executes javascript, so it should render the views, however when it crawls, it replaces the hashbang with ?_escaped_fragment_=

1: Should I enable hashbangs instead of just the hash in the URL? Will this help with Google crawling my site? Angular explains to do this like so: $locationProvider.hashPrefix('!');

2: Should I aim for clean URLs in HTML5 mode? For example as going to www.example.com/about

3: Is the URL hashbang/HTML5 mode the only thing I need to worry about to get things indexed? Will Google really execute the javascript required to load the view and update the page title, then read the rendered result?

Answer 1

For each page with a hashbang you want crawled by Google, you should provide a corresponding 'escaped_fragment' (a snapshot) page that Google will actually visit instead. That page should be just HTML.

To my knowledge, Google will not interpret javascript and load your views.

I suggest you visit this page: Serious Angular SEO

So, to answer your questions:

1: Yes;

2: No;

3: You need to provide snapshots for Google, this is where the actual SEO work reside; there is server-side work involved, to render snapshots when _escaped_fragment_ is detected in the url