Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Websites often present language selection to users with flag icons, but I think this is simply wrong. Flags represent countries.

There are two reasons for a user to change the display language (or at least click on that flag):

  • Change the language as he can't read the one displayed: even if the country is correct (say Switzerland), people can speak different languages (French, German and Italian)
  • Adapt the content to his country: even if the language is correct, an English speaking visitor may be interested in British content rather than US content.

The logic I would follow is:

  1. If you have country specific content, let the user select his country first. Flags are perfectly correct in this case.
  2. If the country has been selected or if the content doesn't depend on the country, let the user select his preferred language. And back to my question here: how to graphically represent a language?

I've seen "English" flags half US/half UK, but how would an Australian identify to that?

My question is not about the techniques used to recognize a user's culture or country of origin using his IP and browser preferences, but how to avoid displaying available languages by their names?

Conclusion considering the answers:

Do not use a flag to represent a language. There is no natural graphical representation for a language. The only acceptable icon for a language is its two letter code as it is used in the Windows standard language toolbar. Even with this icon, it is highly recommended to put the language name in plain text, preferably in its native form.

Update: I just discovered that there is a running competition to Create an icon to signify "language". The results should have been published by Jan 15th 2010, but two months later there is still nothing. It must be a problem with no solution. Update 2013: There is finally a winner for the "switch language" icon. It doesn't solve the graphical representation of a language but I think it's a nice solution for its purpose: enter image description here

share|improve this question
3  
Graphical representations are more susceptible to misinterpretation due to cultural differences, so you might actually be better off with text. The use of flags is a compromise, and as you pointed out, not a good one either because some languages are so widely spoken that the user might not always identify with the flag of the country of origin or most dominant countries where that language is spoken as a first language by the majority. This is a very good question because, even if no answer is found, it highlights the downfall of using flags. So +1 from me. –  Bernhard Hofmann Nov 12 '10 at 11:15
2  
And some countries will have multiple languages, so flags will not always have a one to one mapping to a language. Another note: Not all images will be culturally dependent (symbols), but certainly this will be the case with something abstract like a language. –  Splog Nov 12 '10 at 11:30
8  
Most languages are tied by name to some country. English is one of the most widely-spoken languages in the world, but anyone speaking English can tie it to England (heck, even the U.S. flag would work), likewise with Spanish (Spain), German (Germany), etc. And a country like Switzerland is irrelevant to this problem. No one is going to put up a Swiss flag to represent German or French or Italian. And even the Swiss know to look for a German/French/Italian flag for those languages. –  Lèse majesté Nov 14 '10 at 1:16
5  
You seem to say that things are obvious. But I am certain that using flags for both countries and languages can be extremely confusing to some people. "I selected Belgium and now I see Netherlands and France, where is Belgium gone?". It is also important not to forget about nationalisms. A US citizen may not care to see a Union Jack for English, but I am certain that the opposite can hurt. Countries from former Yugoslavia speak languages that are very close to each other, at least from a foreigner point of view. But don't even try to show them the neighbor's flag for their language... –  Mart Nov 14 '10 at 23:32
5  
I don't believe you can represent languages graphically. I refuse to use websites that use the Stars and Stripes to represent the English language (or the hybrid UK/US flag) and will not buy from them - this is a highly emotive issue so best avoided! –  user6210 Jun 28 '11 at 15:18

10 Answers 10

up vote 39 down vote accepted

Perhaps just the opposite of what you wanted but we have in a few cases of municipalities with diverse ethnicities resorted to displaying the top languages by name and adding a globe icon for other translations.

alt text

You could also try making icons with abbreviations of the language name next the actual name.

alt text

share|improve this answer
    
From your examples I conclude that you can't avoid putting the language name? I somehow dislike the idea of having a list of unreadable names (as you put them in their respective language). –  Mart Nov 12 '10 at 11:10
2  
Your solution with language abbreviation is the most acceptable as you can find the same in Windows standard language toolbar. Not because it is from Microsoft but because most people have seen it like that. –  Mart Nov 16 '10 at 9:12
6  
You can also make intelligent guesses as to which languages you display by default based on the user's browser settings and IP location. For example, for a user that is likely from Canada, you could display English and French by default and leave everything else under the globe icon. –  Virtuosi Media Nov 16 '10 at 11:05
2  
We ended up doing something similar by finding the most commonly spoken foreign languages for our user-base, then spelling "translate" in each. –  Ben Durnell Jun 28 '11 at 16:17
    
“We” ? Who, “we” ? –  Nicolas Barbulesco Mar 25 '13 at 22:11

Difficult to get a single icon to represent each language in terms of agreement or design time. John Yunker's insights on global gateways may help. Using a globe icon to initially get users to a choice list and then spelling out language and country options in their own local language seems to be optimal:

http://motivawebconsulting.com/2011/to-flag-or-not-to-flag-language-links/

Flags have a place, the question is do they scale to your audience requirement and are they usable:

http://www.globalbydesign.com/2010/10/28/apple-giving-up-on-flags/

Also, maybe step back and consider the entry and exit points to the language choice. Are users searching, navigating by links? In some sites above you can see how enabling users to get to their country option and then choose a language is priovided, in others I have seen, where entry locales cannot be detected by browser etc, providing a long list of country/language (or locale) options in the native language preferably.

share|improve this answer

This perhaps disagrees with the general consensus here that 'flags are bad for language', but how about the following:

The Apple way is to do the Country first and then the Country Name in the language - so reverse the standard locale from en_GB to GB en.

enter image description here

I think it makes sense that some one Suisse will search for their Country first and then the language.

If you want to represent it graphically too then have two flags next to each other

So Swiss German is enter image description here | enter image description here and Belgian Dutch is enter image description here | enter image description here.

I think this would work for most European and South American languages, but I don't know how it would work for Asian languages. You could focus on the symbols that are used to change language with in country websites.

share|improve this answer
    
The Apple example actually follows the 'flags are bad for languages' principle, as only the country selection is a flag, the language is described textually by the country name. But I like the solution avoiding writing the language itself. I'm less convinced by the combination of two flags, I think it would be really confusing to have for example the German flag multiple times on the page. –  Mart Jan 8 '13 at 17:30
    
No. Swiss german has nothing to do with Germany. And the dutch flag is not the flag of dutch language, it is the flag of the Netherlands. –  Nicolas Barbulesco Mar 26 '13 at 4:03

I agree with the initial suggestion, namely: flags should not be used to represent languages.

For some web site visitors, a particular flag might be a natural representation of their language, and such a visitor if asked this question might mistakenly think people are being either politically correct or excessively analytical.

My business relies on people making a purchase on the web sites I'm involved with. It's crucial they get the right impression within the first few seconds. This involves an emotional response as much as a logical one. If I want to pay my mortgage this month and next, do I want to start by confusing, insulting and frustrating the customers? You bet I don't.

So what is the best solution? I suspect that languages don't generally have better graphical representations than simply the name of that language written naturally.

As a footnote, we should acknowledge that we're talking mainly about written languages in this Q&A, which is what counts for most web pages (which are typographical). There are a number of spoken Chinese languages, but for a web page it's likely the distinction between scripts.

share|improve this answer

Sorting through a large list of flags has never been helpful to identify your content. Having to identify your specific requirements amidst such a huge plethora of graphics is cute for designers, but unhelpful to users, who, unless they are familiar with the particular icon set and/or every country flag, will have a hard time visually processing and sorting. In comparison, most people with access to a web-navigating device are familiar with the Latin alphabet and which of its letters their country and language begins with (when romanized form when necessary). In seeking to represent languages pictorially, you would be creating a new visual taxonomy from scratch. Massive exacerbation. My advice is to include a single visual device (say a globe or blank flag) to prepend the label for quick recognition of the functionality, and a pure-text alphabetized list by drop-down for input. People can then use the universal functions of the Latin alphabet, direct text input, scrolling and arrow buttons to quickly select their desired option without first having to decode a new interface (when the whole purpose of multi-language or -country selection should be to minimize the user's need to assimilate new taxonomies).

share|improve this answer
    
I agree with you that a list of hundreds of flags or "language icons" is unusable. But imagine the case when Switzerland has been selected, and you have to select one of the three languages in a graphically compact way. Some designers tell me it's intuitive to display the French, German and Italian flags. I don't think so. My question should maybe be "How to display a very short list of languages apart from their names?". Or shouldn't I listen to designers? –  Mart Nov 12 '10 at 15:06
    
Flags are not a good idea if you need to be able to sort the language list. But for sites offering only a handful of languages that doesn't require visual scanning to parse, then it's a perfectly viable option. However, even in cases of large lists, adding an icon next to each language name is a good idea. People can identify icons much quicker than they can words. In this case, it doesn't matter if I don't know what the Estonian flag looks like. I just need to know what the US and UK flags look like, which any English-speaker will know. –  Lèse majesté Nov 14 '10 at 1:25

I see that a decision was made on the Design A Language Icon page (as mentioned in the original post). They' gone with this:

enter image description here

Apparently, the reasoning behind this is:

Why this color? : It is similar to the color of tongue. It is pastel and not disturbing (indeed color options are available but this is our choice).

Why this glyph? : Because it is not related to any other idea or symbol, it does not signify something else, it is exlusive for selecting language.

Why the shape? : It is easy to draw, learn, recognise and remember. It works both black and white, very scaleable, simply put it has all the aspects of a working logo.

I don't believe this has actually been taken up by any major sites as yet, and my opinion is that it looks more like a SAVE icon (3.25 floppy disk) than a tongue. However, is this something you would go with?

share|improve this answer
    
This icon is actually the 2009 "winner". It has not been adopted at all as far as I can see. The 2010 winner has been announced but the work has not been shown. At the same time they opened 2011 registration, so I guess they are not satisfied with the solution. –  Mart May 31 '11 at 16:22
1  
For language selection I came up with this icon: commons.wikimedia.org/wiki/… –  Pau Giner Aug 2 '12 at 12:28
5  
This is terrible. –  Erode Apr 26 '13 at 14:21
1  
Isn't languageicon.org much much much better? –  Pacerier Apr 28 at 13:42
    
@Pacerier: I don't know, it's quite a subjective question overall. However that icon didn't exist at the time this answer was written so it may well be better understood. –  JonW Apr 28 at 13:52

If I look at other products (not on the internet) that contain language-specific information, for example user manuals and product packages listing the ingredients and such, recurring ways of doing that usually are oval-shaped language codes (which might still be country codes), small flags, or the full language name.

As a user, I find flags work best when it comes to indicating the place of language choice: when I see a flag, whichever country it is from, it clearly states that that's where you can change the language. I would suggest putting the language choice in the upper right corner or on the bottom of the left menu column - those are the places that are most commonly used and therefor easiest to find.

As for the sorting of longer lists (and especially sorting on English names), I'd suggest you actually try to find out what the users find easiest. Sorting a list on English names makes it very difficult to find a language that doesn't start with the same letter. (I can either interpret English, or look at the different fonts, but not both. This has been shown also with display of a word saying 'red' in a blue color. People can observe one easily, the other one with a little more difficulty, but both at the same time is really really difficult.) My suspection is that the list given as an example, although very clear and goodlooking, might not be actually be the easiest in use.

share|improve this answer
1  
A long list of languages can be avoided if a country selection is done first. Then what is faster, select a country then a language or select a language in a long list? –  Mart Nov 17 '10 at 10:41

There is no good graphical language representation.

  • Flags work in some situations, when there are limited choices (up to 4-5 flags) and no ambiguities. They fail for multilingual countries (e.g. India, China), and can look jarring for multi-country languages (e.g. English, Spanish).
  • ISO 2-letter codes are often confusing and unfamiliar. For instance, BS is Bosnian (BA is country code and TLD), MS is Malay (MY is Malaysian TLD... but MY is Burmese language).

The way BBC lists languages works well (as @Hisham suggested):

alt text

Benefits:

  • Not confusing language with country. However, it does allow distinctive country-specific services when necessary (note Brasil and Portugues).
  • Sorting the languages by their English name.
    • Easy to find in a long list.
    • Easy to search for using Ctrl+F on a busy page.
    • Politically neutral (avoids questions like "why is Urdu below Tamil?").
    • Familiar to non-speakers (e.g. if you want to print an article in a language you don't know).
  • Shows the native-language name, for those not familiar with English.

The obvious disadvantage is that it takes up a fair amount of space.

Unrelated tip: put the language choice on every page, linking to the the copy of that page in the relevant language. Many sites take the user back to the home page in the given language -- easier to implement, but almost never what the user wants.

share|improve this answer
2  
Great summary on the question. There is sadly no compact way of presenting a list of languages, so it has to be fine tuned for each case differently. Your unrelated tip is actually relevant, developers are often too lazy. I can't imagine having a language choice bringing back to the home page. –  Mart Nov 17 '10 at 10:33
4  
"MUNDO" does not mean "Spanish". It means "World". How's that for a native language name? –  djeidot Dec 22 '11 at 21:48
    
@dbkk, What's your opinion on languageicon.org ? –  Pacerier Apr 28 at 13:41
    
@Pacerier. Great icon. It would be nice if the website provided concise and thought-out guidelines for the rest of the language selection process after clicking or hovering on the icon. –  dbkk Apr 28 at 14:48

I see two different questions being asked:

  1. how to represent a language, and

  2. how to represent a country

These are entirely two different things. Representing countries is easier because there is a one-to-one correspondence with flags, you can use an approach similar to this one: alt text

For representing languages, I like how the BBC does it, showing the language's name in the local script:

alt text

If you click on the More languages link, the BBC presents a page that not only shows more languages, but also maps country names to a map – and vice versa.

share|improve this answer
4  
Yes, the two questions are entirely different things, and I do not think that the asker is asking how to represent a country at all. –  Tsuyoshi Ito Nov 13 '10 at 17:43
4  
Tsuyoshi is right, but your answer still has something interesting. The BBC language selection actually doesn't only list languages. As far as I can read, Brasil is not a language, and the Russian label says "Russian service". That means that it mixes country and language notions. –  Mart Nov 13 '10 at 19:41
4  
Ironically, the example your picture shows is wrong: youtube.com/watch?v=eE_IUPInEuc –  nightcracker Mar 25 '13 at 17:52
    
@Hisham, If a non-English actually visits bbc.co.uk , he wouldn't even know where to click to change to his native language...... –  Pacerier Apr 28 at 13:40

I suggest using icons with an abbreviation of the language on them.
There are two major standards for language name abbreviation. One is ISO 639, which allows abbreviation languages into two or three letter abbreviation.
Second one is IETF(I can't post more than one link so use wikipedia), which is more advanced and allows you to abbreviate both a language and a country.

You can combine the selection of country and the selection of flag, by displaying the abbreviation with the flag as the background.
Anyway, do not forget to add tool-tips with full language names.

share|improve this answer
1  
I think pairing a flag with the language name is optimal. The language abbreviations will work if everyone knows their language abbreviation (I don't know if this is true or not), and it's a written language, not an aural language. In the case of aural languages, Chinese is actually broken into Mandarin, Taiwanese, Cantonese and numerous other dialects (and someone who speaks Mandarin will not understand Cantonese or Taiwanese). However, the ISO 639 standard does not distinguish these dialects apart. –  Lèse majesté Nov 14 '10 at 1:31
1  
@Lèse majesté: ISO 639 does distinguish them; you just have to use the 3-letter codes. Taiwanese is a dialect of Min Nan (nan); Cantonese is yue; Mandarin is cmn. There simply aren't enough 2-letter codes for all the world's languages. –  Mechanical snail Oct 7 '11 at 0:25

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.