Before you start designing
Research the languages you'll be including. If all you're including is European-style languages, then you're in luck! Most of them share a pretty similar alphabet, are written in the same format (left-to-right), and they'll always take up the same amount of space! Okay, that last one was an outright lie born of wishful thinking. It's called "text swell", among other things. A concept that might only take a couple of words and a small number of characters to express in English might take a heck of a lot more in another language. English may not be the most concise language out there, but it is one of the contenders. Spanish words tend to be longer than English words, and German words are much longer. Then there are languages like Arabic, which not only use an entirely separate alphabet, but are written right-to-left. It might seem backwards to you (See what I did, there?), but people who grew up reading this way will also scan/navigate the page right to left. That is all to say nothing of vertical text. Proper support for the languages which are written in vertical formats is a relatively new thing outside of (and I'm not kidding) Internet Explorer. (Yup, IE did something right, and did it first, in version 5.5.) Firefox, Chrome, and Opera seem to have caught up with support for CSS3s writing-mode property, which allows you to switch between those horizontal and vertical orientations. Failing that, you can use the transform property as a fallback for older versions.Best practices
So much of what constitutes "good design" in the case of multilingual sites will depend entirely on the site and the languages in question. Besides that, there are a few things I can recommend to make your users’ experience less complicated:1) Let the user choose
For one, let me actually pick my language. It sounds obvious; but I've been to websites that would literally refuse to let me go to the English version just because I don't live in an English-speaking location. They insisted on redirecting me to the Spanish version every time, even if I edited the URL manually. Let's put that another way: the website directly inhibited my attempts to buy something from them by making me do it in a language other than my native tongue. This is how websites lose money.2) Language choice isn’t an afterthought
Secondly, make the language picker easy to find. Half the multi-lingual site I go to stuck all of the language options at the bottom. That's great if you know what you're looking for. It's less great for more inexperienced users. I suggest a one-time language picking option on a first visit to your site, and then a picker at the top of the page as well as one at the bottom.3) Be consistent with all communication
Oh, and any and all e-mails sent after customers sign up should be in their language of choice. Again, obvious, right? Apparently not.4) Match up information architectures
Fourthly, and this is a big one, if I'm in the middle of a site's hierarchy, and I change the language, I should go to the equivalent page in a new language. example.com/en/products/coffeeflavor1 should turn into example.com/es/products/coffeeflavor1, and not example.com/es/. (Note: On one occasion, I was redirected because they didn't actually have a particular product available in my country. That sort of redirect merits an explanation to the user.)5) Use professional translation
Lastly, don't trust automatic translator services. Ever. Get it translated right, or not at all. Good content in other languages is expensive, but getting it wrong will cost you a lot more money.Tools
So you wanna develop a multilingual site? I haven't convinced you that it's a horrible idea? Good. Most of the larger CMSs have a multilingual system in place already. Many large sites are built on custom systems in any case. For the average designer/developer, the easiest way is probably WordPress with some plugins. My favorite solution so far has to be using a multi-site installation and connecting the different "sites" as alternate versions. This provides the most power and flexibility, I think. Plugins that operate this way include: Multilingual Press, Multisite Language Switcher, and Zanto WP Translation. Other WordPress based solutions include: WPML which takes a more classic approach, you write a post or page, define some extra languages for it, and it stores those translations as extra posts, those “extra posts” will be attached to the first, and show up in its place when the language is switched; or Polylang, and xili-language both of which operate similarly to WPML, but come with their own sets of features. Some of these plugins will come with tools and built-in functions to help you translate any content that isn't directly handled by WordPress. (I'm talking about text that might be hard-coded into your theme for one reason or another.) Others won't. Take that into account as you pick your plugin. Then get yourself another coffee. You’ll need it. Featured image, translation image via Shutterstock.Ezequiel Bruni
Ezequiel Bruni is a web/UX designer, blogger, and aspiring photographer living in Mexico. When he’s not up to his finely-chiselled ears in wire-frames and front-end code, or ranting about the same, he indulges in beer, pizza, fantasy novels, and stand-up comedy.
Read Next
3 Essential Design Trends, May 2024
Integrated navigation elements, interactive typography, and digital overprints are three website design trends making…
20 Best New Websites, April 2024
Welcome to our sites of the month for April. With some websites, the details make all the difference, while in others,…
Exciting New Tools for Designers, April 2024
Welcome to our April tools collection. There are no practical jokes here, just practical gadgets, services, and apps to…
14 Top UX Tools for Designers in 2024
User Experience (UX) is one of the most important fields of design, so it should come as no surprise that there are a…
By Simon Sterne
What Negative Effects Does a Bad Website Design Have On My Business?
Consumer expectations for a responsive, immersive, and visually appealing website experience have never been higher. In…
10+ Best Resources & Tools for Web Designers (2024 update)
Is searching for the best web design tools to suit your needs akin to having a recurring bad dream? Does each…
By WDD Staff
3 Essential Design Trends, April 2024
Ready to jump into some amazing new design ideas for Spring? Our roundup has everything from UX to color trends…
How to Plan Your First Successful Website
Planning a new website can be exciting and — if you’re anything like me — a little daunting. Whether you’re an…
By Simon Sterne
15 Best New Fonts, March 2024
Welcome to March’s edition of our roundup of the best new fonts for designers. This month’s compilation includes…
By Ben Moss
LimeWire Developer APIs Herald a New Era of AI Integration
Generative AI is a fascinating technology. Far from the design killer some people feared, it is an empowering and…
By WDD Staff
20 Best New Websites, March 2024
Welcome to our pick of sites for March. This month’s collection tends towards the simple and clean, which goes to show…
Exciting New Tools for Designers, March 2024
The fast-paced world of design never stops turning, and staying ahead of the curve is essential for creatives. As…