Multilanguage sites: Left-to-right and right-to-left

Question

I see some good suggestions in SO for creating multilanguage websites in JavaScript including this article on JavaScript internationalization. However, I am finding it more difficult to determine best practices for developing multilanguage websites where one of the languages is read left-to-right and another is read right-to-left. Do you know any best practices for this task?

The user may change language mid-stream - perhaps from English to Arabic.

Answer 1

A good practice would be to use the lang attribute to describe which language is being used: http://www.w3.org/TR/REC-html40/struct/dirlang.html

I would define the language within the Head, and if necessary locally within the document.

You don't mention which doctype you are using, but if you are using XHTML then there are also xml lang attributes to consider: http://www.w3schools.com/Xhtml/xhtml_syntax.asp

I don't know if it is 'best practice', but when I worked on an english and arabic site recently I found it useful to use CSS classes for setting rtl and ltr.

Answer 2

I also found a lack of information regarding best practices for a RTL site.
Here are some things, along with the lang attribute (mentioned above) that I have stumbled across:

• dir attribute - tells the browser which direction the text/table cells/etc. should flow from
• Arabic Lorem Ipsum Generator
• From the UX Side of things: Design Principles
• Another SO Question, concerning fonts
• Also note that with animations, they may not make sense sliding or swiping if someone is viewing it RTL vs. LTR.