Changing the language of a website

Question

While travelling abroad, I often get pages on websites that are normally in English for me (e.g. images.google.com) served instead in whatever the local language is. The problem is that I can't read a word of them. There may then be settings to change it back to English, but seeing as I can't read the language, I am not able to. Google image search is an example.

One obvious way to deal with this is to show a list of languages written how they would be in that language (e.g. English and not Engels), which is what Wikipedia does. But this takes up a lot of screen real estate, so is not really an option on many sites.

What is a more generally usable method for language selection on a website (think of mobile) where there are space constraints, and how can I clearly indicate this?

Answer 1

I think it should be dealt with like this:

1. If there is setting in the user account, select this language; otherwise,
2. If there is a cookie stored, select this language; otherwise,
3. If it is possible to determine the system/browser language, select it; otherwise
4. If it is possible to assign the IP address to an area, select this language, but ask for user confirmation and store the cookie.

Plus: Always allow the user to select another language, with some languages displayed on top.

First of all, language preference is something that is strictly related to the user. It is the user who does or does not speak the particular language.

Having this in mind, multilingual systems should determine the language based on the settings stored in user the account in the first place.

Secondly, the user should stay with the same language in which he used the site previously, so that it does not change all the time when travelling abroad. Thus, a cookie should be the second level of language selection.

Should it not be possible to use the above (no user accounts, no previously stored cookies, etc.), the language still needs to be automatically determined somehow. Most probably, the language of the system/browser of the user is the one he/she understands. Hence, this should be the third one.

And finally, if there is no possibility to check the language of the system, the IP address can be used. Most users who access a site from an area speak the language commonly used in this area.

But there should still be access to select other languages, and I think that some should be preferred, and thus displayed at the top of the list — especially English, Spanish, Chinese, Japanese, and the one determined by system and IP address.

Regarding language selector, there is a nice redesigned version of country selector, described at Smashing Magazine. It’s quite old now, but I like it as it allows the designer to save space. However, it is harder to manifest it is a language selector, as users got used to lists, methinks. At the same time, maybe there should be just a list of some of the most common languages, and then this little treasure.

Here is a nice article about selecting language with some alternatives to the list. I think the map is a nice option as well, although there are countries with more than one language, aren’t there? In these cases I think the user should choose it from a shortlist for these countries.

Answer 2

As a user visiting an unfamiliar page in an unfamiliar language. I would first look for some sort of settings icon, or an icon that made me think of language or globalization like a globe or flags.

As a designer the first solution I would try is:

^{download bmml source – Wireframes created with Balsamiq Mockups}

Answer 3

When there is no free space available to display the language names, and when we can’t expect all users to understand the current language, we would need

• an icon that represents "Language", apparent to users from all over the world, and probably
• a position (or several) where users are used to find this icon.

Finding an appropriate position should be possible (I feel like there are (some) conventions where to place a usual language switcher, and this should probably also be the place for such an icon).

But finding an icon that all most many users would recognize? Uhh!

---

There is, for example, a "Language Icon":

(There is also an older variant.)

But this is of course far from being well-known (it’s probably not even used on more than a few sites).

---

In the long term, user-agents (i.e., web browsers) should help.

HTML offers machine-readable ways for linking translations. So browsers could easily show a list of available translations (in various, clever ways).

In the short term, avoid redirection (resp. automatic translation), e.g. based on IP or browser’s language settings, when you don’t have a "traditional" language switcher (showing all language names in their own scripts).

For your example case that would mean: When someone visits images.google.com, always show the English version. OR translate, but then offer a suitable language switcher.