Best practice for presenting languages

When presenting links to content in different languages, consider the following:

Always use the name of the language in its local format

If you’re linking to a page in German, label it as ‘Deutsch’ — not ‘German’.

Original Tour website

The Original Tour only lists other languages in their English name — they should be written in their local name.

Think about how you’d find an English link on a Spanish page: if the author or designer used ‘inglés’, that wouldn’t be anywhere near as useful as simply writing ‘English’.

When possible, display all languages available

avaaz.org displays links to all versions of its site in other languages.

Users may not find links to content in their language if they are hidden behind a heading such as ‘Select language’ in English (or the main site language).

Furthermore, order languages either in importance or alphabetically based on the local format (for instance, a link to Spanish content should be appear under ‘e’ for ‘español’)

Try autodetect the user’s language where possible

There are many ways to detect the language in a user’s browser. By doing so you can present a user with content in their language if it is available.

Facebook

Facebook as it appears for a user with their browser set to Chinese. There are links at the bottom to access the site in other languages.

However, be sure to give an easy option to change languages: autodetection isn’t always 100% accurate.

Don’t use flags

Unless the content is specific to that country — don’t use flags!

Other suggestions? Please add your comment below if you have any further thoughts or techniques.

See also

Iconography for translations: best practice for communicating availability of translated content

Further reading (external sites)

16 Responses to Best practice for presenting languages

  1. I nominated your post for the best ‘best practice’ for presenting languages.

    Really the only case not covered is when a website has so many locales they simply cannot be listed in page, but have to be in a separate page. Do you have any good ideas for that?

  2. Pingback: Smartisan OS and a better way to deal with language selection on devices | Flags are not languages

  3. Shantee says:

    Interesting but finally why not using flags ? I am not convinced. Everybody know what a flag it easy to read. People usually prefer pictures instead of words or anything they have to read. When people from thailand or China are on a website in french or english they might not be able to spot where to change the language, they don’t use roman letters and their english or their french might not be that good (probably inexistant actually). But if they see a flag they’ll immediately know what it means and it is for even if it isnot the flag of their country.

    Sure flags are not languages, but every one on earth know instantly what to do and what it means when they see one on a page.

    Beside flags are nice and colorful :) it’s not because some big shots like facebook does it that it’s something everybody have to do.

    • Al says:

      So in the case if Ireland (mostly English speaking), should you use the British flag? then you offend the entire nation, Maybe you use the Irish flag?, then what do you use for the native Irish language (Gaeilge)?

      • Roman says:

        write the name and use it twice…

        Switzerland is often represented 3 times with the same flag. Schweiz, Suisse and Svizzera

    • anna-kay says:

      I’d have to say I agree. I recently stumbled across a web page in Chinese, and without flags as a language indicator it was very difficult to figure out where I would need to go in order to change the language. I’ve written a post on it here: anna-kay.co.uk/so-flags-arent-languages/

      • James says:

        Hi Anna,

        That’s a really good example of a really bad language selector. Placing some flags down there would help identify this more as a language selector — but I think the issue with this selector lies deeper than just with iconography (flags or not).

        I might add a post looking at this example in more detail: for instance is the bottom of the page the best place for a language selector?

      • Robert Stark says:

        Hi Anna,

        That is a terrible example. For instance with Chinese there are 2 types of Chinese Characters that different nations read:

        + Simplified (China)
        + Traditional (Taiwan, Singapore, HK)

        How is a flag supposed to represent those nations? Would people from Singapore somehow think they should click the Taiwan flag?

        In regard to Taiwan and China – using the wrong flag would cause a great number of users to leave your site or result in a loss of sales.

  4. Craig says:

    I’d really stand against autodetect here.
    As a person living abroad in a country where I’m not entirely proficient in the language that is the bane of my life. Always annoying when I get shunted to the local language version of the site rather than the default English version, especially if finding the language switcher proves to be difficult.
    In our ever-globalising world instances of people accessing the internet overseas will become more and more common.
    I would say best practice is to have the default version of the site be the English version. It is the global language, the one understood by the most people, and is common enough online that people who don’t speak it will be used to looking past the gibberish and finding the option to change to their language.

    • te-online says:

      Hello readers,

      @Craig: May I ask why you are living abroad and still not trying to make the best of your abroad language experiences? It can’t be that hard to find a language-switcher on a website since you are learning a little bit of this foreign language every day. I disagree with your suggestion, because for local people it would be very annoying to change to their home language every time – and there are much more local people then foreign people. And if it is too difficult to find the language switcher, you could also change the language very easily in nearly every modern browser…

      But actually, I wanted to thank the author of this blog preventing me from doing a serious mistake in implementing language-menus. Before I had to make some decisions concerning this topic, I did not think about why flags could be a bad indicator for language selection. Dealing with the topic, the first think I stumbled over was whether to choose the British or the US flag for English? That led me to this website. After reading, I see what’s the point and will work out a text-based language selector instead.

      You just made my day – thanks!

  5. Dylan Nicholson says:

    Surely a good compromise if you don’t want all the names of languages you have available cluttering up the main screen is to use some sort of icon that shows a number of different flags to indicate the drop-down box (or link) where you select the language.
    For vision-impaired users you can also provide a text alternative that has the names of the various languages (arguably colour blindness is one more argument against just using flags too – e.g. the French and Italian flags are very difficult to distinguish for a significant portion of the population).

  6. Michael says:

    I can appreciate the points made by this article, but I think it’s splitting hairs a bit. Can you point to research saying how users’ impressions of a site are measurably altered by the flag icon approach? I suspect most site visitors are pleasantly surprised or even relieved to find a site enables them to switch to their native language, especially when they speak “non-mainstream” western European languages.

    The ambiguous language flag, while maybe mildly, briefly insulting to some, is for the vast majority simply an iconic representation of a language and not a form of geopolitical suppression. I suspect that the vast majority of visitors to a site are not hung up on a flag’s inconsistent representation of a language. There are huge battles to fight for every site in terms of usability and customer experience. A case in point, any company site with a dozen languages of native content to keep up to date must have bigger fish to fry — like trying to keep all versions of the text relevant and consistent across the translations. In my book, this flag icon issue is not really close to the top of worries for a site.

    • James says:

      Michael I totally agree that this is splitting hairs. However, you’d be amazed at how vocal arguments can get over this topic, which is why I set up this blog: to try and encapsulate the key arguments against this to hopefully end arguments on these points quickly so people can focus on the bigger picture!

      Regarding research, I am in the process of putting together a post that collates data on this. It will hopefully be ready in a few weeks — I just need the time to write and organise it all.

  7. Mathias says:

    Anyone know of a good icon that indicates ‘languages spoken/understood’? Something that is engraveable. This is for some emergency ID bracelet, and should simply alert the EMTs to which languages I (the potential victim) should be addresses in. If they only try one language, they may miss out on me being able to give them info. And in a case like that I woudl use flags as language indicators, as that is likely more efficient and who cares about insulting a contry/people in such a situation

    • James says:

      That’s an interesting design problem Mathias.

      For that sort of situation, I would first consider some sort of pictogram perhaps showing a person with a speech bubble and one of the ISO 639 codes for the language they spoke (http://en.wikipedia.org/wiki/List_of_ISO_639-1_codes).

      Flags in this situation would be better suited to showing the nationality of the person — and supplemented with the relevant ISO 3166 country codes (http://en.wikipedia.org/wiki/ISO_3166-1).

      But considering flags in general, these might not work that well at all here: this is an emergency ID bracelet, and for flags to work, they require colour and often some very intricate lines, shapes and/or patterns. What if the paint eroded or discoloured? How could tell apart Ireland from France? Germany from Holland?

      A “dog tag”-style design with minimal text/printing would probably be the way to go.

  8. amberella says:

    Here’s another reason why your recommendations are spot on, which I’m not sure was previously covered: Regulated companies with clients all over the world. Sometimes the content legally allowed to be shown to different users is different (like restricting certain types of financial products from being advertised in countries where those products have not yet been vetted by the local regulating body). Previously, language selection were often used as a proxy for the user’s citizenship or geographic location. Now I am working on a huge (and expensive) project to decouple the concept of language, current location (i.e. IP geodetection), and legal domicile of record. Thanks for the resources to help explain this issue!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>