Techniques for multilingual Web sites:
Selecting link texts

Linking in general is relatively simple in HTML. When referring to different language versions, it is essential how we choose the link text, i.e. "thing" that acts as a clickable or otherwise selectable part of a page, through which the link can be followed. In principle, that "thing" can be an image too, but usually textual links work best. Especially in this context, it's not at all a good idea to use an image, since the most natural way to refer to a version of a document on another language is to use words, or some other text: the name of the document in the other language, or the name of that language or a code abbreviation of the language, or a combination thereof. One possible exception is a situation where the link text would be in a language which cannot be presented reliably as text, due to character code problems. Thus, for example, when language names are used as link texts, it might be necessary to use an image to denote Arabic (but naturally one needs to specify a textual replacement for such an image too, using the alt attribute, e.g. alt="Arabic"). On particular, country flags should not be used as symbols for languages.

The following is a simple example of a link that refers to an English version, on a page in Finnish:

<p>Tämä sivu englanniksi - This page in English:
<cite><a href="inxex-en.htm">Techniques for
multilingual Web sites</a></cite>.</p>

This would look like the following:

Tämä sivu englanniksi - This page in English: Techniques for multilingual Web sites.

Here the link text is the name of the other language version in that language. An advantage is that if someone who is illiterate in Finnish runs into the page, he can immediately, without even following the link, see what the page is about. Sometimes a link like that works as such, but often it is useful to prefix it with an explanation like the one above. The explanation is here in Finnish too, to avoid the problem that a Finnish reader who does not know English starts wondering what the link is about. The English explanation is there for readers who know English, and it emphasizes the meaning of the link; this helps in distinguishing it from link texts in English in general, which are rather common on pages in all languages.

What should we do if there are several languages. Then one could write a list or a table, containing links like the one above, and prefix them with a common explanation in a heading-like style, like this:

Tämä sivu muilla kielillä - This page in other languages
Deutsch Techniken für mehrsprachige Web-Sites
English Techniques for multilingual Web sites
svenska Tekniker för mångspråkiga Webbsajter

One might also add two-letter or three-letter language codes as defined in ISO 639. In such a case, the natural order for the list or table would be alphabetic order by language code. Using the codes would help in making them better known. It reasonable to expect everyone to learn such a small thing like the two-letter codes for those languages that he knows well, since in quite a few contexts it is necessary to refer to language by such codes. It might be suitable to present the codes in large font in contexts like this:

de(Deutsch) Techniken für mehrsprachige Web-Sites
en(English) Techniques for multilingual Web sites
sv(svenska) Tekniker för mångspråkiga Webbsajter

Depending on the case, the presentation can be made more compact, to the extreme of using language code alone as link text. This is the approach adopted on several pages at the EU site. For example, the page containing the Finnish version of the directive on protection of personal data has "language buttons" in the upper right corner as follows:

Castellano Dansk Deutsch Ellinika English Francais Italiano Nederlands Portugues Suomi Svenska

In this example, the codes have been presented as images, for no good reason. Moreover, the page does not work well when images are not loaded; for small images one should not include the width and height attributes, since they cause problems on graphic browsers. Moreover, the page has illogically esim. alt="Francais" (!), which may mess up the layout; the logical way would be to use markup like alt="fr" title="en français".

The EU main page, or "entry page", is a mere splash page for language selection. The links consist of the word "Welcome" in different languages. This is a relatively bad choice for several reasons, including the fact that some of the languages have confusingly similar words for 'welcome'.

The Debian project pages have, near the end of each page, the text "This page is also available in the following languages:" or equivalent and language names which act as links to different language versions. This solution works rather well, too. However it is impossible to put the links to any intuitively obvious order, if some of the names are not written using Latin alphabet. We can however rather safely assume that a person who can read a language in the list is able to pick it up by its name.

Next section: Placement of links.

2008-05-26 Jukka K. Korpela