Preparing Your Website for Translation - Pt. 1


Did you know that the best time to think about website translation is before, or in the conceptual stages of, your website’s development? Think of your site as a global template – one that permits the easy creation of many local iterations.

Here’s how to get started:

Content Layout

When you translate English to Finnish, the size of your content can expand up to 60%. In this instance your global template should leave some breathing room to accommodate for text expansion.

Whatever the scenario, when laying out your pages use containers and styles that can grow or shrink with the text and not result in distorted layouts.

You might also want to use Pseudo translations in the early stages of web development to identify possible issues with text expansion or compression.

The layout of your content is just one of many content-related considerations to keep in mind while preparing your website for translation.

Font size

When it comes to font size, not all characters are created equal: A standard 12px font-size for alphabetic characters is readable, but most Asian characters need to be one or more point sizes larger. Plan accordingly!

Web fonts

Consider using web fonts: They will offer a consistent experience throughout browsers and OS platforms, whereas relying on client-side fonts through CSS will produce unpredictable results or might not support certain languages.

Also remember that using CSS definition for fonts actually results in a poorer experience from a design perspective.

Writing Direction

Most languages read left to right, but others, such as Arabic and Hebrew, read right to left.

You may need to determine if it is worthwhile to support bidirectional text or if it would be better to develop another solution.

Media Assets

Preparing Your Website_blog_media assetsKeep in mind that whenever you embed text in your graphics, we have no way to extract it. Instead, use HTML overlays or a sliding-door type of image display.

If you plan on using flash animations, content needing translation should be externalized in an .xml file. There are also methods to embed fonts for translated content as opposed to relying on the ‘_Device’ which will result in unpredictable layout.

Videos: Subtitles or Voice Over?

Localizing video content can be both costly and time-consuming. Whether you decide to use subtitles or a voice over, make sure you have a time-coded script ready for translation and are ready to manipulate your video to ensure synchronization of the content and images.

Culture-Specific Symbols or Colors

Culture-specific symbols or colors are sometimes difficult to predict. Orange has religious connotations in Northern Ireland, black represents death in many western cultures, while in many eastern cultures death is represented by white. It’s best to start with research on your specific locale.

Library of Locale-Based Media Assets

Although this is not a must-have, you might want to create a library of locale-specific media assets.

Localizing graphics is an essential part of translation. Remember that a picture used on your English website could be perceived, if not as inappropriate or offensive, very differently in another culture.

Join us for Part 2 of this series, where we’ll cover front end development, currency, and date/time considerations for localizing your website.