30 tips for creating international multilingual websites presented to nova ux

25
Jane Robbins NOVA UX Meetup Jan. 8, 2014 30 Tips for Creating International Multilingual Websites

Upload: jane-robbins-mba-cua

Post on 19-Jul-2015

116 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Jane Robbins

NOVA UX Meetup

Jan. 8, 2014

30 Tips for Creating International Multilingual Websites

Page 2: 30 Tips for Creating International Multilingual Websites presented to Nova UX

‘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

2Jane Robbins

Page 3: 30 Tips for Creating International Multilingual Websites presented to Nova UX

The Impacts of Language

English 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

3Jane Robbins

Page 4: 30 Tips for Creating International Multilingual Websites presented to Nova UX

The International Site Process

Multilingual 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

4Jane Robbins

Page 5: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Domain Considerations

Decide 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

5Jane Robbins

Page 6: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Design Considerations

Length of a label may differ by language

For example, Polish and German words are longer than equivalent English words

“Benutzername” = “User name” in German

Right-justified labels work for all languages (this approach worked well at VW)

User name

Benutzername

6Jane Robbins

Page 7: 30 Tips for Creating International Multilingual Websites presented to Nova UX

More Design ConsiderationsBi-directional languages (such as Arabic and Hebrew) need to display characters right to left for text and left to right for numbers

Use horizontal menus if any of your languages are bi-directional

Make sure your layouts and templates work for all languages

7Jane Robbins

Page 8: 30 Tips for Creating International Multilingual Websites presented to Nova UX

More Design Considerations

Pay 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

8Jane Robbins

Page 9: 30 Tips for Creating International Multilingual Websites presented to Nova UX

More Design Considerations

Don’t include graphics with

embedded text

Make sure payments are shown in applicable currencies

9Jane Robbins

Page 10: 30 Tips for Creating International Multilingual Websites presented to Nova UX

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)

10Jane Robbins

Page 11: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Cultural Considerations

The 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)

11Jane Robbins

Page 12: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Cultural Considerations

If practical, customize content to ensure that the text, graphics, and even the colors work for the different audiences

Examples from IRS.gov:

12Jane Robbins

Page 13: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Practical Considerations

Tag 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

13Jane Robbins

Page 14: 30 Tips for Creating International Multilingual Websites presented to Nova UX

CMS Considerations

Choose a CMS suitable for a client’s business needs including:

Handling and maintaining multilingual content

Checking in and out and exporting / importing translation workflows

Determine whether the local or centralized entity will have final say on content

Decide the site’s formality of tone plus regional terms that may differ by country

14Jane Robbins

Page 15: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Technical Considerations

Access outside of the US is more likely on a mobile device

Take typical technology speeds for target audiences/countries into consideration

15Jane Robbins

Page 16: 30 Tips for Creating International Multilingual Websites presented to Nova UX

More Technical Considerations

Make sure that required software or plugins are commonly used

Allow for language toggling back and forth on the same page

16Jane Robbins

Page 17: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Language Considerations

Content vs. language – there’s a big difference

1) The great majority of multilingual sites have the same content for all languages

2) Some sites (IRS.gov) have translations for frequent items, but most content is in English

3) My Polish-English sites both have the same branding and navigational structure, but differing content

17Jane Robbins

Page 18: 30 Tips for Creating International Multilingual Websites presented to Nova UX

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

18Jane Robbins

Page 19: 30 Tips for Creating International Multilingual Websites presented to Nova UX

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

19Jane Robbins

Page 20: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Translation Considerations

Translations

Use an automated translator?

Google Translate, et al – provide the basics only

For 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

20Jane Robbins

Page 21: 30 Tips for Creating International Multilingual Websites presented to Nova UX

Top Tips:Get a professional translator if possible

Research cultural considerationsLocalize content

Jane Robbins

@[email protected]

Page 22: 30 Tips for Creating International Multilingual Websites presented to Nova UX

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=4021163

Government best practices Howto.gov Best Practices http://www.howto.gov/web-content/multilingual/best-practices

22Jane Robbins

Page 23: 30 Tips for Creating International Multilingual Websites presented to Nova UX

More ResourcesWriting for a global audience:

http://webdesign.about.com/od/writing/a/aa080800a.htm

http://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_embedded

http://alexwebmaster.com/developer-bilingual-websites-search-engine-optimization-spanish-english-houston-texas/

23Jane Robbins

Page 24: 30 Tips for Creating International Multilingual Websites presented to Nova UX

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_WordPressBuild 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/24Jane Robbins

Page 25: 30 Tips for Creating International Multilingual Websites presented to Nova UX

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-design

French/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

25Jane Robbins