skip to Main Content

I run a website built with Angular and I used angular-gettext to integrate and support several languages: https://angular-gettext.rocketeer.be/

I don’t want to change my site structure using domain-specific subdomain or url like https://en.example.com/ or https://www.example.com/en/. So far I store a language variable in the client’s local storage to determine which language to display.

It works fine and the UX is nice. However, I am wondering what the best way is to ensure that Google indexes my website in other languages.

I whas thinking of using the hreflang attribute with a lang parameter this way:

<link rel="alternate" href="http://example.com?lang=en" hreflang="en-us" />

And then of course, handle the lang parameter in the url.

Would that work? Is it considered best practice or is there any more elegant way to do it?

2

Answers


  1. Since angular is a single page application, search engines are not really going to render your app page by page. Hence your different languages for translations won’t be too effective when it comes to indexing. There are pre-rendering solutions like https://prerender.io/. They are doing a pretty good job at this.

    Otherwise if you are really worried about seo stuff, you should look into actually having server-side pages. You can sort of do a combination with frameworks like sailsjs or hapijs.

    SPAs are usually meant for apps behind login/private use so trying to make them SEO friendly is quite limited at the moment.

    Login or Signup to reply.
  2. Actually, the answer from @z.a. is not 100% accurate anymore. Google seems to scan Javascript nowadays:
    Refer this link
    Not sure about Bing and all the others, but at least with Google, you should not have an issue.

    What is wrong with https://www.example.com/en/? That is the cleanest approach to multilingual websites. This also ensures that everybody sees every link in the right language. Otherwise, different people might see the same link in different languages, which is not very user (and SEO) friendly.

    On top of hreflang="en-us" in you link, you can also add the language to your header

     <html lang="en-US">
    

    and to real links:

    <a hreflang="it-IT" href="https://blog.supertext.ch/it/">Italiano</a>
    

    That should give Google a few pretty good hints.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search