Multilingual Typography: Designing for English, Bahasa Melayu, Chinese and Tamil

Malaysia's multilingual audience is a strength for businesses, but it creates real design challenges. A layout that looks perfect in English may break when the same content appears in Bahasa Melayu, which is often longer, or in Chinese and Tamil, which use completely different scripts with their own typographic needs.

Designing with all your languages in mind from the start avoids awkward fixes later. This guide covers the key typography and layout considerations. Getting it right also supports accessibility, which our post on accessibility basics for Malaysian SME sites covers in more depth.

Choose fonts that support every script

Many popular Latin fonts do not include Chinese or Tamil characters. If a font lacks a character, the browser falls back to another font, often a default system font, which can look mismatched.

When choosing fonts:

• Check which scripts each font supports before committing to it
• Choose a matching font for each script with a similar feel, such as a clean sans-serif for English paired with a clean sans-serif style for Chinese
• Consider font families designed to cover many scripts consistently
• Test with real text in every language, including names, prices and special characters

For Chinese, full font files can be very large because of the number of characters. Many websites rely on system fonts for Chinese or load optimised web fonts carefully to protect page speed.

Plan for different text lengths

The same message can vary significantly in length across languages. Bahasa Melayu text is often longer than English, while Chinese can be much shorter in character count but needs to be readable at adequate sizes.

This affects:

1. Buttons: a short English label may become much longer in Bahasa Melayu and wrap or overflow
2. Navigation menus: longer labels may not fit on one line, especially on tablets
3. Headlines: a headline that fits on two lines in English may need three or four in another language
4. Cards and grids: uneven text lengths can make cards uneven in height
5. Forms: labels and error messages need space to expand

Design layouts that flex. Allow buttons to grow, let text wrap gracefully and avoid fixed-height boxes for text.

Tip: test every key page with the longest version of your content. If the layout works with the longest language, it will usually work with the others.

Adjust size and line height per script

Different scripts need different settings to be equally readable:

• Chinese characters are dense and complex, so they often need a slightly larger size and generous line height to stay legible on phones
• Tamil script has tall characters with marks above and below the main line, so tight line height can cause characters to clash or clip
• Latin text for English and Bahasa Melayu works well with standard line heights but benefits from comfortable line lengths

Developers can apply language-specific styles using the lang attribute in the page code, such as lang="zh" for Chinese or lang="ta" for Tamil. This allows different font sizes, line heights and fonts per language without separate templates.

Layout and content considerations

Typography is only part of multilingual design. Also consider:

• Images with text: text embedded in images cannot be translated easily, so use real text over images where possible
• Bold and italic: some scripts do not have true italic styles, so avoid relying on italics for emphasis
• Line breaking: Chinese text does not use spaces between words, so browsers break lines differently, which can affect justified text
• Numbers and dates: keep formats consistent and clear in every language
• Translation quality: professional or native-speaker review matters more than any design choice

Mark each page's language correctly in the code. This helps browsers choose appropriate fonts, helps screen readers pronounce text properly and helps search engines show the right page to the right audience.

Testing multilingual pages

Before launch, review every language version on real devices:

• Check that no characters show as empty boxes, a sign of missing font support
• Look for overflowing buttons, wrapped menus and uneven cards
• Ask native speakers to read key pages for both language quality and readability
• Test forms, error messages and emails in every language
• Check page speed, especially for pages using large Chinese fonts

Plan for ongoing content updates too. When English content changes, translated versions must be updated, or customers will see inconsistent information. Our guide to typography choices that make long pages skimmable offers general readability tips that apply in every language.

FAQ

Should I use one font for all languages?

Only if it supports all your scripts well. Often it is better to choose well-matched fonts for each script.

Do I need separate pages for each language?

For SEO and clarity, separate URLs for each language version are generally recommended, with clear links between them.

Can I use machine translation?

It can help with drafts, but have important pages reviewed by fluent speakers before publishing.

Designing for several languages takes extra planning, but it shows real respect for your customers. Choose fonts that support each script, let layouts flex for different text lengths, adjust line heights per language and test with native speakers. Every visitor should feel the site was designed for them.