When developing products for global audiences, small details can have a significant impact on usability. One area often overlooked in localization is how lists are sorted and formatted.
While these may seem like minor concerns, they directly affect how easily users can find and understand information. A poorly sorted country list or an incorrectly formatted set of items can lead to confusion, frustration, and even usability issues for international customers.
Here is an example if the English sorting is kept for the localized German version:
Österreich
Frankreich
Deutschland
Whereas translating back into English it makes sense:
Austria
France
Germany
Today, we’ll explore two common localization pitfalls—sorting and formatting lists—and how to solve them using best practices and readily available tools.
Sorting lists for global users
Have you ever encountered a list that was properly translated but incorrectly ordered? It happens more often than you’d expect, even in widely used products, and the reason is usually a simple mistake: sorting before translation.
Many developers sort lists in English before translating them, resulting in a final list that, while localized, is arranged according to English rules. For non-English speakers, this makes scanning and finding items much harder—especially in large lists like country names or product catalogs.
Even when developers get the sequence right by translating first and sorting later, they sometimes use a generic sorting method that doesn’t account for linguistic nuances. Different languages have unique sorting conventions. For example, in Japanese, words are sorted by their phonetic reading (gojūon order), rather than by the character itself. Without proper handling, sorting errors can make lists confusing and unusable.
Formatting lists for global users
Another frequent issue occurs when displaying a list of items in a readable format. In English, a common approach is: “house, car, and bike.” Developers often handle this by translating “and” into different languages and then concatenating items with commas.
This is usually done to have a template of a list format which can then be used for any kind of listing.
The translators would only see these individual words:
house
car
and
bike
The developers then just use the English list format to rebuild the different versions.
While this might seem like a simple, universal approach, different languages have unique formatting rules:
- Some languages don’t use commas to separate list items.
- Others might not require “and” at all.
- Certain languages, such as Chinese or Japanese, use double-byte punctuation marks instead of spaces and commas.
A generic concatenation method may result in grammatically incorrect, awkward, or even unreadable localized lists, reducing the overall quality of the localization experience.
The solutions
Fortunately, there are standardized solutions to address these challenges. One of the most widely recognized efforts is the Unicode CLDR Project, which provides guidance for handling various localization issues across different languages.
However, for developers, Mozilla offers practical built-in tools to streamline the process:
- Sorting lists: Use Array.prototype.sort() with proper locale support to sort non-ASCII characters and words in different languages correctly.
- Formatting lists: The Intl.ListFormat API enables language-sensitive list formatting with minimal effort from the developer.
By leveraging these tools, developers can prevent common localization issues while ensuring a seamless experience for global users.
Thank you for taking the time to read this post! I hope you found it helpful. At first glance, sorting and formatting lists may seem trivial, but as soon as you introduce different languages, they become surprisingly complex. By incorporating the right localization-friendly solutions early on, developers can avoid costly fixes and create a smoother, more intuitive experience for international users.
See you in our next post!