multi lingual website html setup

Question

I am currently setting up a multi lingual website that is to support different languages, english and spanish for starters and french in the future.

I have the content etc localized but now I want to make sure that have all meta tags and http headers, lang attribute on body tag, xml:lang etc are correct for the culture selected at the time.

Is there anywhere outline on the internet that outlines what needs to be configured for multi lingual html sites? Anyone have any advice/tips on this.

Have you checked the other questions on this as it is an often asked and answered question? — PurplePilot

Paweł Dyda Paweł Dyda · Accepted Answer · 2011-05-17T07:31:25

As far as I know, there are no such "must haves". All of these are optional (maybe with an exception of character encoding). What you might need:

Character encoding declaration

That is for sure, you need content type and character encoding declaration:

<META http-equiv="Content-Type" content="text/html; charset=UTF-8">

For obvious reasons UTF-8 is recommended.

Language declaration

Language could be declared with lang attribute, which is defined for most of HTML elements. Therefore you can set it document-wide, body-wide or anywhere you please:

<html lang="de">
  <body lang="es">
     <p lang="pl">Jakiś tekst</p>
  </body>
</html>

Of course that would be nice if these tags make sense (unlike in example above), so it is common to set lang tag for body and for paragraphs (if it happens that given paragraph is in different language than body).
The content of lang attribute is two letter ISO 639 language code (ISO 639-1 to be precise). The same applies to xml:lang (which could be declared in XHTML web sites).

Directionality

If it happens that you will face the challenge of localizing web site into Hebrew, Arabic or other Right-To-Left language, you will also need to apply dir attribute. Just like in case of lang, this attribute is optional and could be placed almost anywhere. If it is omitted, dir="LTR" is assumed. Example:

<body lang="ar" dir="RTL">

That's I am afraid it. Multilingual support for web sites is still kind of grey area, and support is not the best to say the least. For example, you would need to care yourself for providing valid formatting of dates, numbers, currencies and similar artifacts.
Also, you would need to remember not to use gems like CSS text-transform: uppercase | lowercase, JavaScript's uppercase and lowercase related functions, as well as JavaScript's toLocalizedString() functions. These gems are very unreliable and doesn't work correctly.

multi lingual website html setup

1 Answers