The underwhelming dropdown: making language and region selection visible and effective

Dropdown menus, when used well, are a very useful form of interaction. While the pros and cons of dropdowns have been well discussed elsewhere, it’s useful examining them in the context of language/region selection.

When a user interacts with a dropdown menu, it’s a reasonable expectation that there are a certain degree of choices contained within the menu — hence the designer’s choice in hiding the content.

Left to right: The Guardian, Moo and CNN

But looking at the region selection dropdowns at The Guardian and Moo, the dropdown only reveals one extra choice: wouldn’t this be far simpler (and more obvious) as either a radio button or list of links? CNN has more regional choices than The Guardian or Moo, yet they have opted just to list the options available.

CNN’s approach is simple and effective: don’t complicate selections of anything on your site with a dropdown unless there are numerous options that would otherwise clutter the page.

(Note: while CNN is very well designed, linking to the Arabic edition of its content would be better done with Arabic written in its localised form rather than just the English).

Posted in Arabic (العربية), Dropdown menus, English | Leave a comment

LEGO.com: effective design for region and language

The LEGO website is available in 17 languages. When a user goes to select language, they are prompted to first choose their country or region and then their language as appropriate.

LEGO language selection

Belgian users have the option of French or Dutch content specific to their country; Spanish users can select Spain or Latin America as appropriate.

The use of flags here gives priority to country/region first — which is why it works. Only for Latin America is a flag not used, as it is obviously referring to a whole region and not a specific country. Language is a secondary option. In this scenario, LEGO’s use of flags works very well.

As a global brand, LEGO has registered domains in many other countries even though they do not have local content for all of them. The site does its best to redirect users to the most appropriate version of the site. Australia users visiting www.lego.com.au are redirected to the UK English site; Canadian users visiting www.lego.ca are redirected to the US English site.

As the site gives priority to country over language, this is a much better approach than just combining flags with language names.

However, there are limitations to this approach: Swiss users accessing www.lego.ch are redirected to the German site. French-speaking Swiss users may not appreciate this, but given there is no specific Swiss content available this is far more acceptable than just redirecting them to a generic German-language site. Ideally, however, the LEGO site would do better checking the language of the user and redirecting them based on that — not just the domain they’re visiting.

While it’s not perfect, the thought that LEGO has put into its user experience for international users is highly commendable.

Posted in Autodetect language, Chinese (中文), Dutch (Nederlands), English, Finnish (suomi), French (français), German (deutsch), Italian (italiano), Japanese (日本語), Korean (한국어), Polish (polski), Spanish (español) | Leave a comment

Steam: choose language or choose country?

The Steam client is a great video-gaming platform. It allows users to buy and download games, connect with friends and share screenshots from their gaming experiences. The website is available in 24 languages, and it even has a community-driven translation project.

However, unlike the website, the Windows client has some issues with language versus location.

Steam install screen

Steal install screenshot

The choice of Chinese Simplified versus Chinese Traditional is interesting: Simplified is the norm in mainland China, yet Traditional is mostly used in Taiwain (but also Chinese ethnic groups outside of mainland China).

But the other flag choices are inconsistent: the United States flag is used for English. Understandable perhaps as Steam are a US-based company, but a look at the Steam client stats server reveals Steam has heavy usage in other English-speaking countries such as Australia, Britain, Canada, Ireland, New Zealand, Singapore and South Africa.

While there is no data on Brazilian users versus Portuguese, by sheer population numbers one would expect Brazil to have more users than those in Portugal: yet the Portuguese flag is used for Portuguese. Again, this is inconsistent with the choice of the US flag for English.

As for Spanish, how many users are in Spain compared to Argentina, Chile and Mexico or other Spanish-speaking countries?

Are Steam really asking what country the user is in, or what language they prefer? It appears to be a confused mix between the two.

Another problem with this install process is the lack of localised names — forcing users into selecting a flag to for their language (whilst the language is labelled in the English-name for that language).

The Steam website handles translations brilliantly: each language is localised and also in English for disambiguation. And no flags.

However, their installer client needs some more thought.

Posted in Chinese (中文), Dutch (Nederlands), English, Finnish (suomi), French (français), German (deutsch), Italian (italiano), Japanese (日本語), Korean (한국어), Polish (polski), Portuguese (português), Russian (русский), Spanish (español), Thai (ภาษาไทย) | Leave a comment

Montreal Canadiens: powerful and clever language selection

Many Canadian websites provide content in both French and English. The Montreal Canadiens, an ice hockey team based in French-speaking Quebec, have employed a powerful and clever way for users to choose the language they prefer for their site.

Montreal Canadiens

One half of a player’s face links to French, and the other half of another player links to English. Both links are accompanied by the Canadien’s motto: ‘rise together’ in the appropriate language.

An inspiring way of integrating language selection with the motto and ethos of a sports team.

Posted in English, French (français) | Leave a comment

“Romanians are smart” campaign and the problem of similar flags

The website Romanians are smart has an interesting and noble objective: change the results associated with “Romanians are…” on Google into something more positive.

If you go to Google and type “Romanians are” in and wait for the autocorrect to kick in and you’ll see for yourself how racist the current results are.

The site encourages users of different languages to click on a link that enters the term “Romanians are smart” into Google (in their language), hopefully moving the more positive search term further up Google’s list of autocorrect options.

On the homepage there are links in English, French and Romanian. These languages are also complimented by flags. Romanian has a Romanian flag and English gets the United States treatment. But as for French, it appears the site has the wrong flag.

Romanians are smart

Light blue on top, white in the middle and red on the bottom — the flag used for French is far more similar to Luxembourg’s flag than that of France’s.

France
France
Luxembourg
Luxembourg

French is spoken in both France and Luxembourg

However, the flag used could also be seen as the Dutch flag — could this flag choice confuse a Dutch user thinking they were accessing content in Dutch?

Netherlands
Netherlands
Luxembourg
Luxembourg

The Netherlands and Luxembourg share an almost
identical flag but share no common language

Obviously this is probably just a simple design oversight — the French flag is simply upside down. But it still demonstrates the problem with using flags to represent languages.

Continue reading

Posted in Arabic (العربية), Dutch (Nederlands), English, French (français), Polish (polski), Romanian (română), Russian (русский), Spanish (español) | Leave a comment

The Arab League: an appropriate symbol of the Arabic language?

When it comes to flags representing languages, the Arab League is a common choice for representing the Arabic language. Arabic is a shared language between all states: a unique scenario in comparison to similar organisations such as the European Union, African Union and Organization of American States, all of whom have many different languages within their member states.

Arab League
Flag of the Arab League: the seal reads “League of Arab States” in Arabic

What exactly is the Arab League? Quoting a BBC News profile:

“The League of Arab States, or Arab League, is a voluntary association of countries whose peoples are mainly Arabic speaking or where Arabic is an official language.”

There’s obviously a strong relationship between the Arabic language and the Arab League. But how appropriate — really — is the flag of the Arab League in representing the Arabic language?

The Arab League is a political entity, and as the civil agitation around the Arab world in 2011 has demonstrated, international politics are not only complicated but often in a state of flux. At the time of writing, Syria is suspended from the Arab League: and there is much speculation that fellow member-state Yemen may follow. Earlier in 2011, Libya was blocked from the Arab League before having its membership restored in August. In the past Egypt has also been suspended — back in 1979 — and current events in Egypt are also highly volatile.

If Syria and Yemen are suspended from the Arab League, are they suspended from the Arabic language? Of course not. It’s a ridiculous suggestion. But it does illustrate that the relationship between the Arabic language and the Arab League is not an absolute one.

While the Arab League is comprised of countries that share Arabic as a common language, it’s not an absolute representation of all countries where Arabic is spoken: it’s also an official language in Chad, Eritrea and even Israel.

Is there a better flag to represent the Arabic language? Probably not. That’s because flags in essence represent nations, countries and in the case of the Arab League, organisations: they do not represent languages.

Posted in Arabic (العربية) | Leave a comment

Flags change: Libya as an example

For a time, Libya had the honour of being the only country with a flag a single colour. But since 2011 and the overthrow of the Gaddafi regime, Libya has readopted its former flag of 1951 – 1969.

Libyan flag
Flag of Libya
Libyan flag (old)
Previous flag of Libya

Libya’s flag, new and old

In September 2011 the new Libyan flag was raised outside the United Nations. That was almost two months ago — any many websites have since changed their Libyan flag graphics.

Skype, for instance has updated the flag on its Libya page:

Skype

However, Rebtel is still a few months behind the change:

Rebtel

Interpol is also showing the old flag — which is not without irony considering most of its Libyan page is about arrest warrants related to the Gaddafi family:

Libya isn’t the only country recently to change its flag. An interesting list at Flags Australia shows many recent flag changes — including the worlds newest country Southern Sudan, Burma and Malawi.

Burmese flag
Flag of Burma (from 2010)
Burmese flag (old)
Previous flag of Burma

Burma’s flag, new and old

If you use flags on your website for any reason — remember they are liable to change. And often, as Libya perfectly illustrates — the reasons for the flag changing can be highly political.

From a user experience perspective, what would a Libyan user make of the new flag on the Skype website and the old flag on the Rebtel website? It would probably depend on their political viewpoint. But regardless, it again highlights how sensitive an issue flags can sometimes be.

Posted in Arabic (العربية) | Leave a comment

Tate Art Galleries: 12 languages, 9 flags

The Tate Galleries in the UK are a word-class collection of galleries and have a great website — with the exception of the language links on the homepage.

Tate

The most interesting part of this design choice is that there is obviously a cultural awareness that flags may not properly represent the Arabic and Chinese languages — so these languages are just written in their local equivalents.

But not so for French, German, Italian, Portuguese, Spanish, Japanese, Greek, Russian or Polish.

Furthermore, the flags are repeated in the content area of the pages these links lead to: of course with the exception of Arabic and Chinese.

(It’s also worth noting the BSL — British Sign Language — link. The hand icon here seems very appropriate for this).

Another issue with the choice of flags for some languages and the language name for others is also simple consistency.

Wouldn’t this design work far better if it just showed the language names?

Simple, consistent and uncontroversial?

Posted in Arabic (العربية), Chinese (中文), English, French (français), German (deutsch), Greek (Ελληνικά), Italian (italiano), Japanese (日本語), Polish (polski), Portuguese (português), Russian (русский), Spanish (español) | 1 Comment

Front against language flags

Researching the issues of flags as language in Belgium, designer and researcher Tine Lavrysen sent me through to a brilliant site entitled ‘Front tegen taalkeuzevlaggetjes‘ — or ‘Front against language flags’.

Front against language flags

It prompts the user to select their language by using flags: Dutch, French or English. However the flags chosen are from small countries where the languages are still official — Suriname, Monaco and Ghana respectively. A very clever take on the issue of flags as language.

Posted in Dutch (Nederlands), English, French (français) | Leave a comment

avaaz.org: simple yet effective multilingual content design

Social activism site avaaz.org is beautifully designed: both visually and experience-wise.

The site is available in 14 languages: each easily accessible from the top banner and presented in their local formats. Furthermore, the site autodetects the users language and redirects them to a localised version (if one is available).

A simple yet very effective way of presenting multilingual content.

Posted in Arabic (العربية), Autodetect language, Chinese (中文), Dutch (Nederlands), English, French (français), Hebrew (עִבְרִית), Italian (italiano), Japanese (日本語), Korean (한국어), Portuguese (português), Russian (русский), Turkish (Türkçe) | Leave a comment