Below are some more ways in which to utilize HTML5 to enhance your multilingual websites:
Ruby annotations
Ruby annotations are pieces of text showing up alongside the so-called base text. They usually provide additional information about the base text, such as its pronunciation. Their use is most common in East Asian documents. It can also show translations right above the source text. Here are some examples:
Ruby providing translation
Ruby providing pronunciation guidance
Examples taken from here.
HTML5 supports Ruby annotation through the following four tags:
The Ruby tag -- Specifies a Ruby Annotation
Ruby base tag -- Specifies the base text to be annotated
Have you ever dreamed of adding sticky note functionality to your website, allowing users to jot down comments directly on your Web pages? Or have you ever wished your translation agency could directly access your web copy to extract text for translation? Your wishes are granted with this new attribute.
All you need to do is set ContentEditable to true for any element, and the user or translator can then click on it to directly change or copy the text.
Here's how it works: By default, elements with the ContentEditable attribute set will have a gray border as the user hovers over them. Clicking inside the element will give the user access to its content. The user can then edit or copy it directly.
The
attribute
If you want to provide spellcheck for user-generated content, you can now use the new
attribute. Adding this attribute to an editable element will trigger spellcheck when the user adds or changes text. The following elements can be spellchecked:
Text values in input elements (exception: password)
Text in
In the above sample code, the first text area will be spellchecked in English (html lang="en"). The second text area has French set as its language, so it will be spellchecked in French. The third text area does not have a language set, so it will use the setting of the first parent up, which is the
with lang="ru" (Russian).
Pay extra attention to the language settings of your elements when you set up spellcheck for a site that will be in multiple languages.
About the author:
Jon Ritzdorf serves as the in-house globalization architect for Acclaro. He is an adjunct professor of translation technology, localization and the business of translation at New York University, the Monterey Institute of International Studies, and the University of Chicago.
