Jane RobbinsNOVA UX Meetup
Jan. 8, 2014
30 Tips for Creating International Multilingual Websites
Jane Robbins 2
‘s BackgroundManaged a redesign for an international nonprofit for a bilingual website, jankarski.net (Polish-English)
Was a UX consultant at Volkswagen of America on a web portal that will be used in many countries
Jane Robbins 3
The Impacts of LanguageEnglish is the most used language on the web, but …
Most (75%) internet usage is not in English
Bottom line ~ we need to reach users in their own languages
Jane Robbins 4
The International Site ProcessMultilingual websites can be created in two phases - international and localization
International planning includes: domain definition, design and layout, technical factors, UX considerations, CMS and content decisions, and cultural research Localization includes content translation and implementation
If your planning is handled correctly, your localization process will be smoother and there should be less rework
Jane Robbins 5
Domain ConsiderationsDecide on one site / URL or multiple sites per language
For SEO reasons, it’s often better to have one website with multiple language links
Example: jankarski.net with a /pl or /en suffix
Google recommends getting a country-specific domain if you can afford it
Examples:ebay.de = ebay.fr =
Ensure that the URL is short and neutral
Jane Robbins
Design ConsiderationsLength of a label may differ by language
For example, Polish and German words are longer than equivalent English words
“Benutzername” = “User name” in GermanRight-justified labels work for all languages (this approach worked well at VW)
User name Benutzername
6
Jane Robbins 7
More Design ConsiderationsBi-directional languages (such as Arabic and Hebrew) need to display characters right to left for text and left to right for numbersUse horizontal menus if any of your languages are bi-directional
Make sure your layouts and templates work for all languages
Jane Robbins 8
More Design ConsiderationsPay attention that special characters (Polish ł and ę, German ä and ß, Chinese 德新 , etc.) for each language:
Are findable in the site’s Search Read correctly on the screen and printed out
Jane Robbins 9
More Design Considerations
Don’t include graphics with embedded text
Make sure payments are shown in applicable currencies
Jane Robbins 10
UX ConsiderationsPersonas and UX testing need to include natives of the languages for the site
Help users by defaulting a language, but allow users to change it (for expats and visitors)
Jane Robbins 11
Cultural ConsiderationsThe customer experience needs to fit the culture
For example, in Poland, nonprofit sites rarely have a Donate button, considering it tacky
Also, European users tend to use bank transfers for payments (not PayPal)
Jane Robbins 12
Cultural ConsiderationsIf practical, customize content to ensure that the text, graphics, and even the colors work for the different audiences
Examples from IRS.gov:
Jane Robbins 13
Practical ConsiderationsTag in all languages with the terms that local users search for content
Is this a trunk or a boot?
Build links to same-language content – avoid mixing links
Jane Robbins
CMS ConsiderationsChoose a CMS suitable for a client’s business needs including:
Handling and maintaining multilingual contentChecking in and out and exporting / importing translation workflows
Determine whether the local or centralized entity will have final say on contentDecide the site’s formality of tone plus regional terms that may differ by country
14
Jane Robbins
Technical ConsiderationsAccess outside of the US is more likely on a mobile device
Take typical technology speeds for target audiences/countries into consideration
15
Jane Robbins
More Technical ConsiderationsMake sure that required software or plugins are commonly used
Allow for language toggling back and forth on the same page
16
Jane Robbins 17
Language ConsiderationsContent vs. language – there’s a big difference1) The great majority of multilingual sites have the
same content for all languages2) Some sites (IRS.gov) have translations for
frequent items, but most content is in English3) My Polish-English sites both have the same
branding and navigational structure, but differing content
Jane Robbins 18
Content ConsiderationsIn writing and tagging content, clarify locations so that users in Cambridge, Mass. aren’t sent to content for Cambridge, England
Ensure that graphics aren’t insensitive to other cultures
Jane Robbins 19
More Content Considerations
Translate measurements, depictions of time (1400 vs 2pm), and time zones, as needed
or Be careful about idiomatic or slang terms that might not be understandable to all
“my bad” “phat” “groovy”
Figure out how to handle VOI (voice on the internet) and accessibility features
Jane Robbins 20
Translation ConsiderationsTranslations
Use an automated translator?Google Translate, et al – provide the basics onlyFor a professional, credible website, you really need a human translator to polish the content Have native speakers proofread all text
Employ a translator or use a service?Assuming you’ll be adding content over time,
you’ll need to determine a long-term solution for content maintenance
Top Tips:Get a professional translator if possible
Research cultural considerationsLocalize content
Jane Robbins@UX_JaneRobbins
Jane Robbins 22
Some ResourcesGeneral information on doing global-based research:
Whitney Quesenbery and Daniel Szuc ’s book “Global UX: Design and Research in a Connected World” “The Handbook of Global User Research” by Robert Schumacher“A Pocket Guide to International User Research” by Chui Chui Tan and Owen Gregory“Beyond Borders: Web Globalization Strategies” by John Yunker (2002-3)Mashable article by Christina Warren http://mashable.com/2010/10/11/global-web-design/Two summaries of technical and non-technical considerations by Christian Arno http://sixrevisions.com/web_design/how-web-designers-can-adopt-a-global-mindset/ and http://www.webresourcesdepot.com/8-tips-for-designing-better-global-websites/http://ezinearticles.com/?Web-Designing-Tips-For-Bilingual-Website-Designs&id=4021163Government best practices Howto.gov Best Practices http://www.howto.gov/web-content/multilingual/best-practices
Jane Robbins 23
More ResourcesWriting for a global audience:
http://webdesign.about.com/od/writing/a/aa080800a.htmhttp://www.webdesign.org/web-design-tips-for-an-international-audience.22281.html“A Practical Guide to Localization (Language International World Directory)” by Bert Esselink and Arjen-Sjoerd de Vries
Accessibility and CSS:http://blog.globalizationpartners.com/internationalization-and-accessibility.aspx
Bilingual sites & SEO Google video about bilingual sites http://www.youtube.com/watch?v=GyWx31GeQWY&feature=player_embeddedhttp://alexwebmaster.com/developer-bilingual-websites-search-engine-optimization-spanish-english-houston-texas/
Jane Robbins 24
More ResourcesAutomated translations:
Translation tools are described in http://sixrevisions.com/tools/reach-a-larger-audience-with-content-translation-tools/Translators for WordPress sites http://codex.wordpress.org/Multilingual_WordPress Build a multilingual site with WordPress by Shannon Smith http://www.creativebloq.com/wordpress/build-multilingual-site-wordpress-9112795Lingual plugins for Joomla http://www.joomfish.net/ A translator incorporated into an HTML forms builder called WufooCrowd source translations with a tool like http://www.worldlingo.com/
Managing international projects:http://blog.globalizationpartners.com/website-translation-localization-and-internationalization.aspx
Some firms that specialize in multilingual site translations:http://www.lingo24.com/http://www.translations.com/http://www.globalizationpartners.com/
Jane Robbins 25
More ResourcesA few firms specialize in bilingual sites:
Japanese/English http://www.designtym.net/services/ Spanish/English http://www.gogonzalez.com/web-design/bilingual-multilingual-web-designFrench/English – both in Canada http://www.beginwithb.com/bilingual-calgary-web-design and http://www.joceydesigns.com/Welch-English http://www.drupology.co.uk/bilingual-website-design-wales