In a chat UI that displays RTL (Arabic, Hebrew etc). Should you mirror the UI so that messages you send appear on the left and the person replying to you appears on the right?
Does whatsapp, iMessage etc. do this?
3 Answers
WhatsApp does mirror the UI when it is set to an RTL language. Google image search for "ווטסאפ" (WhatsApp in Hebrew) shows:
Note how sent messages are now on the left, incoming on the right, and the back button has moved to the right as well.
This only applies when the user has set their UI preferences to be an RTL language. Using the interface in English but chatting in Hebrew (as i do) leaves the default LTR flow (outgoing - right, incoming - left).
This is the problem with Ken Mohnkern's answer; the UI in that screenshot is in German(?), so it doesn't get flipped.
- Aha! Good eye!!Ken Mohnkern– Ken Mohnkern2017-11-02 19:17:16 +00:00Commented Nov 2, 2017 at 19:17
I don't know. Let's find out.
Google Image Search "arabic whatsapp chat" ...
Here's a screenshot. The little checkmarks are on the messages to the right, and they're the messages I send, aren't they? Does that answer your question?
- 4The chat is in Arabic, but the UI is in German(?), which is why it's arranged like that. See my answer.Scimonster– Scimonster2017-11-02 18:24:30 +00:00Commented Nov 2, 2017 at 18:24
- 1@Scimonster has it. If you want to salvage anything from my answer, let it be that a little research can provide the answers you're looking for.Ken Mohnkern– Ken Mohnkern2017-11-02 19:18:59 +00:00Commented Nov 2, 2017 at 19:18
No, do not mirror the UI. It will confuse RTL users because WhatsApp, Facebook, and pretty much all chat apps work in the same way where the right-side is your side of conversation, left-side is for the person/people you are speaking with.
In the RTL world, websites are indeed mirrored but when it comes to chatting, it's not.
However, make sure dir="rtl" is on the element surrounding the RTL text. You can use dir="auto" but sometimes isn't accurate.
