Multi language page content

HTML has an attribute that indicates the language. By using this you get a page that can,

• Show text for multiple languages.
• Support Unicode by default.
• Switch language on the fly without server requests.
• Use language specific markup such as ruby tags.

This is done by Resolver("translations").set("locale","en-GB") or Resolver("page").set("state.lang","en"). Setting the locale will change the language as well. When the language is set the lang attribute is updated on the HTML element. A set of simple CSS rules do the magic of showing the text for the current language.

When you put text in your page make a copy of the tag and add lang attributes. For instance,

<button>
<span lang="en">Continue</span>
<span lang="de">Weiter</span>
<span lang="fr">Ensuite</span>
</button>

will give you a button where the text changes when you select another language.

You could pick the text to use on the server. That might be the best thing to do for you. But consider,

• The page is easier to cache when the locale or language doesn't have to be in the URL.
• It works really well for embedded pages
• Gzip will reduce redundant information in a single HTML file to very little.

SCSS macro

There will be a SCSS macro to generate the needed CSS for a list of languages.

Performance

Since the elements that are not shown are styled with display:none they are ignored by the browser when rendering, so they do not slow down the behavior and rendering of the page.

It will of course increase the download size of the page, but for most pages the overhead will not be noticeable.

Programatic translation

There is an API for translation, reverse translation and cross translation for use in JavaScript