3

Most answers to this question say that for instance Arabic text should be aligned right-to-left even if the rest of the page is in a left-to-right script such as English.

So, I was surprised to see that the language selector https://www.wikipedia.org shows all languages left-aligned (as seen on Ubuntu in English):

enter image description here

Both Wikipedia and Ubuntu are very international and are driven by very vocal communities so I don't think this choice is random.

My question: Is there something special about language selectors that makes it OK to have alignment ignore language direction?

Related:

  • Hi! To be honest I never came across of a dropdown that respects different language directions. I would assume that the UI component it self has limitations that prevent from that happening. – Menandros Apostolidis Jul 17 '18 at 6:33
  • @MenandrosApostolidis: Thanks! In my current case we have a language selection UI component that shows each language in its preferred direction, and a developer has identified that as a bug ("it should be aligned to the left side"), full discussion at github.com/commons-app/apps-android-commons/issues/1713 for more background, I have to agree it does not look very good but I have about zero experience with RTL so I can't tell. – Nicolas Raoul Jul 17 '18 at 7:06
  • If the languages are so many. I would suggest instead of a dropdown to use a text field with auto complete functionality. That is based on drop down usability studies. The user know what to look in advance and you will avoid having the cumbersome view of list items aligned left or right. – Menandros Apostolidis Jul 17 '18 at 13:14
  • I think you're assuming Wikipedia has an UX department rather than volunteer programmers. Besides that, you're checking a western version, so it aligns to the left . If you check an arabic version such as ar.wikipedia.org you'll see dropdowns are aligned to the right. This is because it's more consistent and it covers user's expectations for both Western and Eastern languages – Devin Jul 18 '18 at 2:54
  • btw, you might be interested in this: responsivenews.co.uk/post/123104512468/… – Devin Jul 18 '18 at 3:02
4

Simple lists need not be like paragraphs.

Suppose we displayed each language name according to its “natural” alignmend: Language-Aligned List

Not only would that look wrong, but it would be hard to scan.

Now suppose we aligned the entire list to the right: Right-Aligned List

Sure, you’d think it’s weird, since most of the languages on the list are LTR, but it wouldn’t look wrong, and it would still be easy to scan.

What we can learn from this is that natural alignment isn’t as important in situations such as these. For such a list, it makes more sense to maintain the alignment of its surrounding interface.

However, once we get to longer phrases and sentences (especially anything that spans more than one line), it becomes much more important to display a language with its natural alignment. Just as it would be annoying to read long sentences in English when they’re right-aligned, left-aligned Hebrew and Arabic are also annoying to read.

That said, all this is about alignment. It’s important to be aware that direction should always follow its language. Otherwise, punctuation shows up in the wrong place.

  • So, your suggestion is that I chose an alignment and stick to it for all items in the language selection widget, if I understand correctly? Maybe center-aligned would be the less unnatural to both RTL and LTR people? – Nicolas Raoul Jul 18 '18 at 1:58
  • 1
    I would stick to the alignment of the locale the list is embedded in. Center-alignment would create jagged edges on both sides of the list, and that would harder to scan for everyone. Besides, once the user had chosen an RTL language, wouldn’t the entire interface become RTL (including this language selector)? – David Regev Jul 18 '18 at 2:02
  • Good answer. You can probably generalize to all lists including bulleted lists – qoba Jul 18 '18 at 3:42
  • I find the first example amazing, it actually makes scanning much easier due to the fact that certain languages are easier to recognise and "filter" from the list. – Levano Jul 18 '18 at 14:37
  • @Levano, that’s a good point for when the list is wide. But then RTL items would stick out too much and look wrong, like in that example. If we decreased the width, then I think the advantage of being able to find your particular RTL language would be lessened. For everyone else, I think having a few items stick out like that would slow down scanning for their particular language. – David Regev Jul 18 '18 at 16:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.