Multilingual SEO and Single-page application

Question

I have a website (Single-Page Application) in VueJS, and want to implement localized versions with URLs like these:

• http://example.com/en
• http://example.com/de
• http://example.com/it

I'm trying to figure out if I can redirect user to his local version depending on his Accept-Language

Google suggests to:

Avoid automatic redirection based on the user’s perceived language. These redirections could prevent users (and search engines) from viewing all the versions of your site

however it looks like some sites (e.g. Microsoft, TeamViewer) do this via 302 HTTP redirection.

I also consider the option to redirect via JavaScript pushState method (change URL without page reload).

So my questions are:

• would redirection to user's personal language version harm SEO?
• which redirection method would be preferable (HTTP 301 redirection, HTTP 302 redirection, JavaScript pushState)?

Answer 1

It can be fine for SEO to redirect the base URL of the domain to a language based on the Accept-Language header. The only SEO concerns are:

• Test your rules for case in which the language header doesn't list one of the languages you support.
• Test your rules for no Accept-Language header sent at all. (Most bots won't send one).
• You need a fall-back page that says "Choose your language" which has links to your site in each supported language. You shouldn't implement at default redirect language. That will ensure that bots know about all your languages and don't end up massively preferring one of them.
• You should avoid linking to your base domain when possible. Link directly to the language subdirectory when the language is known. There should be no internal links to your base domain without a language directory, and any external links that you control should include the language directory.
• It would be best to use a 302 Temporary redirect for this purpose because it will be understood by all bots. Changing the URL with JavaScript could work for Google, but is unlikely to work for other search engines.

Other SEO issues with language redirects stem from disagreements between the language specified in the URL and the Accept-Language header. If you redirect away from a language in the URL because of the Accept-Language header, it will frustrate some users. The Accept-Language header can be wrong in many cases. See How should I structure my URLs for both SEO and localization:

• Many users do not have this header set correctly. This is especially true for users traveling abroad that may be using a friend's computer, or an internet cafe. It is also often true for international users that install an English web browser and know enough English to be get around, but would prefer content in a different language.
• Google just announced that Googlebot will send the Accept-Language header and crawl from different geographic locations. However, Google still recommends that you have separate URLs for content in different languages.
• You may use the Accept-Language header to suggest that users might prefer a different version of the site by displaying a message when the site they are visiting does not match the Accept-Language header.