Why you should visit Helsinki and Brussels before designing a multilingual website

Helsinki and Brussels apply bilingualism differently, with the Belgian capital clearly standing out. Here is what these bilingual cities can teach us when designing a multilingual website, along with five best practices.

Anders Pettersson
UX Collective

--

Golden ornaments on houses at Grand Place in Brussels
Grand Place in Brussels. Photo: iStock.com/querbeet

Are you creating a multilingual website and need some guidance on the user experience? A good source of inspiration is to look at how bilingual cities or multilingual countries work, and how their websites are set up.

Let’s take a trip to two bilingual European cities, Helsinki, the capital of Finland, and Brussels, the capital of Belgium, to explore how bilingualism functions, and see what this can teach us when designing our website.

I lived in Helsinki for a few years as a child, where both of my mother tongues Finnish and Swedish are official languages, and have regularly visited the city since. Later on in life, I lived in Brussels for a few years, the Belgian capital where French and Dutch have official status, giving me the chance to compare how the two cities approach bilingualism.

The Swedish speakers in Helsinki and the Flemish Dutch speakers in Brussels are both represented at less than ten percent of the inhabitants, but there are schools, universities and important cultural institutions in the minority language in both capitals. The way bilingualism is applied in everyday life, however, varies quite a lot.

The historic and political reasons for the different approaches are enough to merit a book or two, so I will only focus on the user experience of an afternoon visit to the cities.

A Finnish afternoon in Helsinki with hints of Swedish

Let’s start out by visiting Helsinki. Jump on the characteristic green tram, and let the bilingual announcements and signage guide you to your stop in the centre. Notice that Finnish is always the first language on signs and announcements, and Swedish is always the second language.

If you follow Helsinki’s public transport authority on Twitter, however, you better speak Finnish, as that is the only language of the Twitter account, although their website is bilingual.

Make sure to spot a police car from the tram window, and notice it has the word for police written in Finnish on one side, and in Swedish on the other.

Pick up a newspaper in Finnish or Swedish at a kiosk in the centre (the Swedish one is hidden way behind the Finnish language ones, if even available), and then head to a café for a traditional cinnamon roll and coffee. Prepare, however, for the menu to be entirely in Finnish, and for staff to greet you with a Finnish “moi”.

Follow the bilingual street signs and traffic directions on your stroll among Finnish Jugend architecture, and go for a dip in the sea at a trendy public sauna.

You are probably feeling hungry by now, so head to a restaurant with trendy locals and hipster tourists. The menu is bilingual, but the problem is that it is in Finnish and English, without any trace of Swedish.

A few hours later you find yourself at the cinema, and note that some of the foreign films showing have both Finnish and Swedish subtitles, while others have only Finnish ones.

When you hop off the tram on your way home, pop in at a grocery store for some last minute essentials. Notice that all the product packaging feature both Finnish and Swedish, but that Finnish is always the dominant language on the labels in large characters, while Swedish is found in minuscule characters below it, on all sides of the packaging.

Don’t miss the fact that some of the products have poorly translated product slogans or descriptions in Swedish, where it is obvious that a Finnish speaker has winged it, or used an online translation tool.

French-Dutch tongue twisters in Brussels

Let’s head to Brussels instead. When you go down to the metro, take a good look at the map of the transport network. Notice that every other station name has the French version first, then the Dutch version, and every other station is the opposite. The speaker announcements also alternate having French and Dutch first, and if you follow the public transport system on Twitter, you will spot that the tweets are in both French and Dutch.

Once you get out of the metro in the centre, pick up a newspaper in either French or Dutch. They are usually next to each other, equally visible when you pass by a newsstand.

Go to a restaurant near the historic square Grand Place, and notice that the waiter greets you with the tongue twister “goeie dag, bonjour”. The bilingual greeting in Dutch and French lets you choose which of the official languages you wish to use, and the waiter will follow the language you opt for.

While you sip on that strong Belgian beer, start studying the menu, in French and Dutch of course, and with an English translation as well. Go for a stroll on the cobblestone streets of the centre after your meal, and let the bilingual street signs lead your way.

You will probably end up in the chocolate boutiques in the Royal Saint-Hubert Galleries, so pick up some pralines, and continue further along to the cinema in the galleries. Enjoy your chocolates while watching that latest foreign indie film subtitled in both French and Dutch.

On your way home, stop at the corner store. You will see most product packages have one side entirely in French, and the other side completely in Dutch, where both languages are represented equally in terms of both font size and information.

When all the product text is on one side, they usually find ways to give both languages the equal amount of space. Often you will also find German on product packaging, the third official language of the country, spoken in the east of Belgium.

Best practices for multilingual websites

You may have experienced multilingual websites that resemble an afternoon in Helsinki, with its varying degrees of bilingualism. The homepage might come in multiple languages, but then you discover that many of the subpages only exist in the first language, or that subpages in the other languages have less content, are poorly translated and are not up to date.

Think about the afternoon in Brussels as a guide to how your user should be treated when visiting your website. The user needs to be able to access all of your content in all the languages, and the user should easily have the possibility to choose what language to use, as well as having the freedom to switch back and forth between languages.

Here are five best practices for designing a multilingual website:

  • Visible language switch — the language switch should always be visible, ideally in both the header and footer, allowing you to easily switch language versions. A great example is the bilingual web portal of the city of Montréal, where the switch between English and French is in the header and footer. In addition, their header is sticky, meaning that the language switch is always visible even if I have scrolled down.
  • Accurate toggle — your website should toggle to the page in question when you switch languages, and not redirect to the homepage. A good example is the e-government website of Finland, where I can start navigating in Finnish and get to a page about tax returns, but since I am more used to reading about the subject in Swedish, I switch languages. The accurate toggle leads me to the exact same page in Swedish, so I can continue reading about tax returns, without going through the homepage, and I can switch back to Finnish later on.
  • URLs in the local language — translate all the URL links of the webpages into the local languages, and not just the page content, as it is important from an SEO perspective. A good reference is the Swiss e-government website, where the URLs of all subpages are adapted to German, French, Italian, Romansh as well as English.
  • Information structure — adapt your website to other alphabets, and not just to the Latin alphabet. An example is how the European Commission’s website is adapted to the Greek alphabet, the Bulgarian Cyrillic alphabet, and special characters of all the EU’s 24 official languages. If you are doing a version for Arabic speakers, think about how your website could be adapted to be read from right to left, and in case you are making a version for a language with characters, like Chinese, you might need to rethink quite a few things in terms of the content structure.
  • Transcreation — translating into another language is not enough, you need to think transcreation. This means culturally adapting the content to your target audience. Expressions, word plays, and cultural references need to be modified with both linguistic and cultural knowledge of your target audience, while a simple translation can end up confusing or offending your audience. In some cases, it is best to strip out cultural context entirely, like how the European Commission prefers text over symbols, to illustrate subpages and thematic areas (it would be quite hard to choose a symbol for let’s say ‘Culture’, that would please all Europeans).

Other good examples that follow these best practices are the Belgian government’s website and the Finnish bilingual city Vaasa.

When you design a multilingual website, think about that French-Dutch afternoon in Brussels, where you have the possibility to choose your language and access all information in both languages. Not only is it essential for web users who might only speak one of the languages, but also for bilingual users who wish to switch back and forth.

A visitor of your multilingual website should never have the impression that a dominant language has been translated into another, but that all language versions are equal to each other, and correctly adapted for each language and culture. This goes for both multilingual website design, as well as city planning in bilingual countries.

The UX Collective donates US$1 for each article published in our platform. This story contributed to UX Para Minas Pretas (UX For Black Women), a Brazilian organization focused on promoting equity of Black women in the tech industry through initiatives of action, empowerment, and knowledge sharing. Silence against systemic racism is not an option. Build the design community you believe in.

--

--