Language of language names in the language selector?

Question

Imagine a site that's available in multiple languages. The language is detected automatically by looking at the IP or the browser header. But that's not bulletproof, so a few users might end up on a page in language they don't understand.

I am wondering what the best way is to present the language selection?

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

Q: Should the languages in the language selection be listed

1. translated into current language, used to display the site in (good if the detected language was correct)?
2. native name of the language, so everybody looking for their language could see it in the very same language (good if the detected language was not correct and users don't know the current language)?
3. always in English assuming most users would understand this?

Feel free to add if I missed something!

Answer 1

Option 2 is the best option, because you'll recognize your own language regardless of your knowledge of other languages (be sure to also provide character sets if you support for example Japanese)

Problems with options 1 and 3

Option 1. If you don't speak / understand the current language you may not recognize your own language. In the example Germans would have it the most difficult.

Option 3. English is the easiest to implement because as you mention most people will understand English. However if your website has translations available, you probably expect visitors with poor English skills..

You could also make a dropdown with a combination of the list in options 2 and 3. eg. German / Deutsch

Answer 2

Option 2 is the way to go as you should always show languages listed by the way they are written in that language. It is the way both Wikipedia and most companies that deal in many languages do it. Here is how Apple handle it:

Problems with the other options
Option 1 is a headache to maintain as you need to have the name of every language in every other language. It also doesn't help someone to find their language as they have to first try to translate the name of their language into the language of another language that they may not even speak.

Let's say you were in China, and the site language was Chinese. How helpful would this list be to you?

It's a list of languages names written in Chinese, which you probably didn't even realise. This just illustrates why you shouldn't consider option 1.

Option 3 is just an English-focused version of option 1, and should be avoided for the same reasons. English to a Chinese person is the same as Chinese to an English person.

Answer 3

Option 2 is the best, since user can always recognize its own language.

There's is a small pitfall though. If you present language selector as dropdown, user won't see any values except current auto-detected language, unless he clicks it. And if user doesn't understand currently selected language - say, already mentioned Chinese, he might won't even notice that you have a language selector at all!

Therefore you'll either need to have clearly visible non-dropdown list of languages if you have enough free space on some side bar, "confirm auto detected language" splash screen or, if you still choose to use dropdown, some universally understood caption near it (English "Language" seems to be least evil, most people should recognize at least this world even if their English is otherwise bad).

Answer 4

One thing to remember is that languages can be common across countries but they might be spoken differently. For example, Spanish in Spain will be a little different from the Spanish spoken in Mexico. A recommended way to handle this would be to go with the approach Microsoft has which allows the user to select the language based upon the country and the language of that country.

That said, I would recommend going with option 2 as that allows the user to determine which language he wants to translate to and can also quickly associate with the language transalation.

Answer 5

My vote goes for option #2. If you're looking to change the language because you don't understand whatever the default is, it will be a lot more effective to see the choices in a language you do understand. That's kinda the point, right?

I also ran across this article from 456 Berea Street where the author prefers a combination of your options 1 and 2, (although he/she doesn't really state why).

The name of the language as text in the language itself, possibly followed by the name of the language in the language of the current page.

Answer 6

The only valid option is #2, as it's the only one that ensures a visitor is going to recognise a language name.

In the other two scenarios you're assuming the visitor is going to understand a second language, and that's a big assumption.

Answer 7

Option 2 is definitely the best way to go. No flags, please!

I'm a native Czech speaker. I work in English and understand basically several different languages. I was doing localization from English to Czech (including typefaces) since 1993. This means I'm a total geek, however since I was a kid, I'm trying to focus on my (read: user) experience.

Borrow someone's cellphone, switch it to Chinese and then let him fix it back. If he'll be successful, the UX is correct.

Answer 8

Interesting question.

The way to go is : native.

Thus, a person speaking only chinese — there are millions of them — is able to choose chinese. This is not possible if you write only “chinese”.

Here is the choice Apple made : the first dialog in Mac OS X.

Here is how the UN welcome us : www.un.org.

It is nice when you have items in non-latin characters in the list of languages, it makes the site cosmopolitan. I like seeing exotic characters, it gives me a good impression of the site. In addition, when the list of languages has items in non-latin characters, this list has a UI role : it attracts my eye, and when I want to change the language I know instantly that this is the place to go, without reading.

Answer 9

I like the way Wiki did it. They are using Native name of the language, also in alphabetical order. Alphabetical order is dynamic, so the list will change depending on the language being used. For example in English it's ABC and in Russian its АБВ (ABV) so the list of language will change respectively.

I prefer this way because its easy to find a language, its easer to spot the Russian characters, also by using dynamic alphabetic order I don't have to switch, my brain, between Russian and English.

Answer 10

It's very important to understand the real needs of your actual users. For example, the assumption that "people will recognise their own language" may not be true - I've found cases where a proxy user is involved, providing assistance to people with limited literacy in both English and their native language. In such a situation, dual labels - in both English and the native language - are needed.

Overall, there are so many practical and cultural factors in play that you MUST test with properly representative users to validate and refine your design. Don't look for abstract principles or some magic "best practice" formula here - see what actually works.

Answer 11

Anyway while what others have answered is good, it doesn't get to the larger picture. I will give you what I think is the IDEAL answer.

Basically, this answer provides MULTIPLE clues (rather than just a single clue) for language selection.

First is the name of the language, (as per the answers above), as it provides a basic interface for any english literate person.

Second is the name of the language in it's own native script, for a basic native language literate person. e.g.

Third is a flag for the country. For languages spoken in Dialects and common countries one can use the Country of origin, or the country of speech. E.g. ENGLISH (should have UK Flag), ENGLISH UK, ENGLISH US (should have their respective countries flag). A visual clue bypassing the thinking part of the brain.

Below is a poor screenshot of such an example, from the website http://blog.myheritage.com/2009/06/small-changes-big-differences-new-header-and-footer/

Many applications I've seen have implemented this correctly, and I urge the rest to follow this.

Some other features required are quick filtering of displayed languages by keyboard, like what listary does for lists, to narrow down results. Like if searching specifically for English (Singapore).

Furthermore the placement of the language switcher matters a lot. It should be ideally located above the fold (i.e. on the first page itself) somewhere. The general practice is the top right corner, below any Profile info you might have. IT IS A MUST for first time visitors, it can be hidden for repeat visitors (i.e. the site is already in their preferred language) and accessible via the second location. The second common location is at the bottom of the page, either centered or left aligned. Though I think it should always be available at first glance. The same applies for applications.

---

Ahhh this is one pet peeve of mine!! For example see Chrome! (I know it's an application, but bear with me) It has the most awful UX for changing the language to english from an unknown language for the user. It requires an inordinate amount of clicking and utter confusion!!

1. Menu icon
2. Settings menu item (no icon!! to identify it clearly/easily when using an unknown language)
3. Click on Show Advanced Settings text.
4. Click on Language (absolutely no way to find it in an unknown language)
5. Click Add
6. Select your language
7. Move it to the top of the screen.
8. Click on the button on the right to make it the default chrome language. (Some languages cannot be done this way either, and can only be used for spelling! They should just separate out these dialogs, and not combine the spelling and Language selection dialog!, as the most common case is presumably language selection, and a very distant one is spelling checker selection).
9. Restart chrome!

---

Some interesting links I found with contrary views and other useful resources. http://flagsarenotlanguages.com/blog/best-practice-for-presenting-languages/ http://commons.wikimedia.org/wiki/Linguistic_flags http://commons.wikimedia.org/wiki/Category:Flags_of_languages

Answer 12

We work with embedded systems where space is always very limited. For this reason we use the 2nd option in the native script.

My experience is that people tend to skip lines the can't read.

An advantage of this compared to Vijay's solution is that users do not need to look/search for there language between lines they can't read. The user has to scan each line to see if some native script is available as all lines start of in the site's script with the native script behind it.

Using only the native script the user will only really "see" the lines in his/her own script. thus a Chinese will only really "see" the 2 lines in his/her own script and skip all else.

Answer 13

Similar to Vijay's response, using a flag to indicate the country of origin of the language is easy to interpret. You don't need to indicate the English name for the language unless it's English -- use the native name only in all cases. I've seen it used many times, including in written user's manuals. I'm Canadian and have often purchased products with instructions in several different languages. Guess how many times I've seen a Canadian flag for the instructions I could read? Never. In spite of that, I never had difficulty understanding that the UK flag was for the English instructions.