UX/UI Design Tips for creating a Multilingual eCommerce site

More and more businesses are expanding into new international markets. They need to consider that the target market's local customs must be recognised, respected, and reflected in any digital content.

In this article, I will share the top 6 things I have learnt while working on a multilingual e-commerce site.

Typography

It's been said that web design is 95% typography. So, be sure to pair quality content translation with quality typographic styling. Character counts expand or contract according to language. For example, you should expect a 15% – 30% expansion when translating English to Chinese or Japanese.

Japanese text translated from English experiences varying degrees of expansion. The degree of expansion is related to the subject matter.

As a guide, to determine the Japanese word count, multiply the number of English characters by 1.8. The more katakana characters are used in Japanese, the greater the expansion rate from English.

For example, technology-related documents translated into Japanese from English have a higher expansion rate than other text types.

‍
‍

A few simple rules for perfect Japanese and Chinese typography

For character-based languages, there are different standards used to optimise legibility. Here are a few simple rules to help you make Japanese and Chinese typography look right.

Reduce font sizes by 10% to 15%

The full-cap height and square profile of Japanese characters make them appear more prominent than the Latin alphabet. Compensate by reducing your body text by around 10% and your headlines can be a bit more.

Increase line height by 10% to 15%

The high-density, square profile characters of Japanese need more breathing room between lines to allow the eye to travel across the page without jumping lines.

With shorter line lengths, you may only need to increase the line height slightly.

Keep line length between 15 and 35 characters

Keep it shorter for just a few lines of text, multi-column layouts, and captions.

Longer for longer, single-column body text.

For mobile, I recommend 15–20 characters per line.

Set text-align to justify

In print, body text is almost always justified, the most natural treatment of the predictable width of Japanese characters. The same rule applies to the web to make it more readable and easy to scan.

Don't use italics

Italics don't exist in Japanese, but CSS italic rules will force an unnatural-looking oblique on Japanese text in some browsers. Instead, use font-weight variation or brackets to offset Japanese text as you would with italics.

Dates

The date format varies between countries, so it is essential to know the date format by country.

Currency

Having the correct currency is especially important for e-commerce apps and websites. This is because when users view an item, they expect to see prices in their native currency.

When dealing with the display of currency symbols, codes, and the actual numeric values themselves, cultural, regional, and locale considerations need to be considered.

If you are designing a universal component, it is crucial to consider the maximum possible case and the minimum case and plan your experience to suit all currencies or make multiple variations for each currency if you build localised versions for each country.

Phone numbers

Country codes and the number of digits in a phone number vary depending on the country. 

I recommend displaying phone numbers in a familiar format to the average person in that locality, regardless of who's looking at the website.

Postcode and address

In general, Western addressing systems go from the smallest geographic entity (street address) to the largest (country). But of course, there is no one-size-fits-all address order.

So, if you're creating an address form for a specific locale, check the Universal Postal Union or that country or region's official postal addressing guidelines.

It mostly starts from the largest geographic entity (country) to the smallest (street address) in Eastern countries.

Measurements

Be aware of the measurement system each country uses. For example, users in the United States typically expect to view measurement data in the imperial system (pounds, inches, and feet). In contrast, users in Australia and Europe expect to get the information in the metric system (grams and meters).

Conclusion

There are several considerations to take into account when planning to expand to an international audience. In UX, the most important consideration is always people: the users. They drive our efforts as we attempt to reach them, hold their attention, and win their trust and loyalty.

A seamless experience is crafted by leveraging the right data and listening to real people in interviews and user testing.

‍