Iconography for localization
Language symbol
When designing an app or website with internationalization in mind, the user should have the ability to switch languages. Ideally it should be very clear to the user where the setting is to change the language without the user knowing how to read the currently selected language.
Region versus language localization
There is a difference between localization for a Region and localization for a Language. In this case I'm referring to language settings.
The simplest option – Using no symbols
Websites will often keep it simple:
- Some websites will show a list of languages to select at the bottom of the page. The login page for Facebook.com is an example of this. This has the benefit of allowing the user to (hopefully) recognize one of the languages they are familiar with and select it. But this doesn't look simple and takes a lot of space.
- Some websites will show the current language in a select field, and clicking it shows a selection of other languages. This takes less space, but now if the user is unfamiliar with the selected language's name they might not recognize it as a method of switching languages. For example, if you're English tourist traveling Europe, would you recognize "Čeština" as a name of a language?
So both of these options have drawbacks.
Searching for a universal symbol
Ideally there would be a universal symbol to represent "language" so that a user can easily identify the setting that has something to do with language. But unfortunately there doesn't appear to be any standard.
So what symbol best represents "Language"?
Below is a list of some global brands and how they have handled this question.
Brand | Usage | Description | Icon |
---|---|---|---|
Meta | Language and Region selector at the top of meta.com.‡ | Globe | |
Apple – SF Symbols | On iOS: Settings > {App} > Language, On macOS: Settings > General > Language & Region.‡ |
Globe | |
Amazon | Language selector at the bottom of amazon.com. | Globe | |
Google – Material Design | Android's ‘Language & input’ settings. | Globe | |
Netflix | Switch between languages within a region. | 木 next to A | |
Wikipedia | Switch between Wikipedias of different languages. | 文 next to A | |
Microsoft – Fluent UI | – | A next to 字 | |
Microsoft – Fluent UI (Korean) | – | A next to 가 |
‡ Meta and Apple will often group their settings for region and language together, so they don't need to worry about the distinction between the two. This is not the case for other brands in the list, whose icon's are explicitly used for the language picker.
In 2011, Onur Mustak Cobanli and Fargat Datta created their own language icon, available at LanguageIcon.org. The icon features a turnstile with the characters 文 and A on each pane. Unfortunately, according to some people online, the icon uses a non-standard/non-free license with legal ambiguity, so you can't freely use the icon. Personally I think the icon is too busy at small sizes, so I wouldn't consider using it anyway.
FlagsAreNotLanguages.com has additional ideas on this subject of language icons in their article Iconography for translations: best practice for communicating availability of translated content.
Using flags to represent language
A lot of websites will use a flag to represent a language, probably because a flag is often more recognizable than a generic symbol. But flags come with a lot of additional meaning and could be confusing to users.
For example:
- Does a Portuguese flag 🇵🇹 mean the content on the page is meant exclusively for the residents of Portugal, or is the content suitable for any Portuguese speaking country like Brazil?
- While the English flag 🏴 may imply ‘English’, this leaves out other nations of the United Kingdom; Wales, Scotland, and Northern Ireland. A better option would be the British flag 🇬🇧, but like the Portuguese example, this also leaves out Irish people who would also benefit from the English language option.
- Some nations will have different languages within the same country.
- Some nations will have different writing systems within the same country.1
For this reason, I'd recommend using flags only in the context of national regions, and not as a way of representing a language.
FlagsAreNotLanguages.com has more information on this topic under Why flags do not represent languages.
-
Some more examples of this can be found on Reddit at r/asklinguistics. ↩