seo Question posted in
Some basic information to get you started with this can be found here.

Angular 2+ SEO for web crawlers

I have my angular 4+ webapp which have a different header on different routes.All the components loads through angular code hence, everything is javascript and there is not much HTML except root component.Due to this, the google is not able to crawl any links.The SEO has taken a hit. I want to know whether if I add my header and footer HTML piece of code and mark it as hidden by default will google and other social sites be able to crawl my page.

I know we can use Angular Universal and use server-side rendering, but for a temporary fix is the above solution workable? Also, apart from extra bytes of transfer from server to the client is there any downside to it?

This question is not duplicate as it refers to angular 2+ version.Most of the answers are of angularjs.

Tags:

2

Answers


  1. 0

    Two things. First of all, doesn’t matter that you don’t have HTML, Google bot is capable of parsing your website anyway (they problem is that other bots might not).

    If you use Angular properly without manipulation DOM in weird way (weird = jQuery or similar), you don’t use setInterval or setTimeout and you used only Angular methods you should find any problem running you app as an Angular Universal.

    Try Angular Universal first before going and using any hack as implementing the SSR capabilities in Angular is easy (https://angular.io/guide/universal)

    Good luck with that!

    Login or Signup to reply.
  2. 0

    Google is able to crawl angular websites. If you mean that given one page, it won’t crawl other linked pages, the, it may be because your links to other pages are not proper anchors (<a ...>). You could provide a sitemap to ensure that Google can see all your pages.

    Then, on each page you need to make sure you set proper title and meta

    You can use angular’s meta and TitleService (https://angular.io/guide/set-document-title) to set the title when you land on a page

     this.titleService.setTitle( "Page-specific title" )

    and angular’s Meta service (https://angular.io/api/platform-browser/Meta)

    this.meta.updateTag({ name: 'description', content: 'My page-specific description' });

    But they best solution would still be angular universal

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search