Have you ever visited a website in a different language, only to discover content wasn’t translated correctly?
For example, one page has content written in two languages.
Labels in the navigation menu overlap each other. Text in form labels overlap their associated form fields.
Imagery on the site is English-focused and doesn’t align with the culture of the language.
You quickly realize the site wasn’t planned for different languages.
At the Designing for Translation webinar, Laura Godfrey and Fedora Braverman shared tips for localizing content so you can effectively communicate your design in multiple languages.
Localization is the process of adapting a product or service for a specific market or culture.
In a past career, I was responsible for managing localization of software products, so I was very interested in their presentation.
It was a learning curve for me, but on our third project localizing the product, the English, German, and French versions of the software were released simultaneously.
Several of the recommendations from the webinar reinforced what I already knew, though I picked up some helpful tips for my projects.
Key takeaway for me: The more you plan ahead, the better outcome you’ll have for localizing digital assets successfully.
Personally, I would have expected the title of the webinar to be Designing for Localization, not Designing for Translation.
The word “translation” implies only words.
However, since “localization” is not well-known word, I suspect that’s why the webinar was named differently.
Here are my notes from their webinar.
Takeaways from Designing for Translation
- What is designing for translation? It’s an approach that goes beyond words.
- Before designing your content, consider who needs to know the information. And whether non-English speaking groups would benefit.
- If communications are not limited to English, you need to plan your content with that in mind
- Godfrey explains designing for translation involves four concepts: language choice, plain language, layout, and imagery
- Language choice, how do you define translation? At a minimum, we work with two languages and two cultures.
- Culture implications include: vocabulary, syntax, ideologies, and ways of life in different cultures
- Language choices we make will either make or break our products/service.
- For anyone who speaks English as well as a romance languages (Spanish, French, Portuguese), you know English is a succinct language. But romance languages may take up to 15% to 20% more room (longer words and sentences).
- If you design for English and don’t consider translation, content designers for other languages will find themselves in an impossible situation: trying to fit longer text into a limited number of characters
- Rather than crafting the best text, designers will have to choose text that fits into the allowed space
- One approach to ensure enough space has been considered for text translation: design first for the longer language
- Direction (for example, right to left) and special characters are other areas to focus on. World Wide Web Consortium (W3C) offers helpful info in Inline markup and bidirectional text in HTML
- Pay attention to dates and numbers, since different cultures and languages treat them differently. For example, in Spanish, dates may be written as 3 de octubre de 2014. USAGov offers a great resource for writing dates for your multilingual site
- Another important area to focus on: voice and tone. Avoid colloquialisms, expressions that may be lost in translation. The words and phrases may not be familiar or may have entirely different meaning in other cultures.
- Use dedicated URLs for each language. People may search for information in their own language.
- Avoid a user experience where a person has to visit the English website to get to the Spanish (or other language) site. (Google won’t find the site in Spanish, because it doesn’t exist)
- Use the unique URL for a language for marketing purposes
- Use active verbs in your content: it makes text clear and more concise. For digital, it’s important, especially on mobile, to save real estate space when possible.
- Write short sentences, which improve clarity. Long sentences with multiple clauses can be confusing.
- Chunk your content, use spacing to separate sections and ideas
- Brevity and clarity are important. Have someone test your instructions. Can they complete the task without confusion?
- Avoid jargon and technical terms. If you must use them, explain them.
- Avoid acronyms when possible. If required, spell them out the first time.
- Use terminology consistently, which increases clarity as well as comprehension
- Proofread your work. It’s not only to make sure grammar and spelling are correct, it’s version control. And helps the translator, who won’t have to repeatedly ask the author questions.
- Allow enough text to fit in the layout (remember tip to design in longer languages first)
- Consider whether your image means the same regardless of culture. Interesting example: in America, an owl conveys wisdom. In Spanish, an owl symbolizes death.
- Use international symbols to convey messages regardless of language or cultural values (example: airport uses symbols to convey baggage area, bathrooms, etc)
- Pay attention to automatic hyphenation, turning it off will help you hyphenate the words correctly across multiple languages
Do you have recommendations for translating designs? Share your suggestions in the comments.
