Scrollbars in right-to-left layout

Question

I'm currently developing the Arabic version of an existing iOS app.

iOS always displays scroll bars on the right. Should they be displayed on the left in RTL mode?
With right-aligned content (images on the right + right-aligned text), the scroll bar adds noise over the content and the right side looks quite cluttered.
I wonder if we put scroll bars on the right because of LTR mode or because most people are right-handed.

And as most systems always put them on the right, I fear users might be confused if I put them on the left.

I don't speak Arabic and have little experience of what the best practices are for right-to-left apps, but these details bother me...

Answer 1

There's multiple layers of context here; the language layer and the design layer.

It's important to consider the language layer, but the fact is the design layer is more relevant to the user's context. If a user has two conventions in mind, one generally applicable (end of the page is on the left) and one specifically applicable (the scroll bar is on the right), it makes more sense to keep with the most relevant conventions.

Stick to right side scroll bars simply because it makes the most sense in the digital context. Sure, if you were designing this interaction from scratch, a left hand scrollbar would make some sense. But you're not; the convention is set, and conventions help users understand and use your application without issue--or at least without that issue.

This is similar to the problem of QWERTY keyboards; sure if you were designing keyboards from scratch there are better ways to do it. But time and time again research has shown the cost of learning non-QWERTY and the confusion when switching keyboard contexts is too big of an issue for non-QWERTY to be viable on a global level. It's too late in the game for that change.

Answer 2

We need to see the use cases where scrollbars are being used.

1. To quickly skim through the content available on the screen
2. To continue reading once a person has reached the bottom of the page
3. To quickly navigate to the bottom of the page.

With regards to all these actions,the positioning of the scrollbar has an impact and though there has been some debate over the optimal placement of the scrollbar with regards to reading to left to right, it has been established as a defacto standard that the scrollbar is generally on the right due to the conventional standard of reading from left to right and enabling a design element at the end to allow for quick navigation.

I am also going to steal from @Glen Lipka's excellent answer (from the question linked above) about why the scrollbar might be placed on the right.

I think of this more as a mental model issue. Imagine if there was no mouse, but rather you were doing it with your hand. Most people are right-handed. My mental model is that I am moving the scrollbar with my right hand. Therefore, scrollbar on the left would indicate that my arm is moving across (in front of) the content and blocking my vision so I can scroll the page.

Of course, the mouse makes this ONLY a mental image and not actually blocking my face. However, as I imagine the scrollbar on the left, I keep feeling like I am reaching over the content to scroll, rather than scrolling from the side.

This paper why scrollbars are on the right and other stories states

The right-hand side looks right because to grab a scrollbar on the left, or to press a button on the left would mean your hand would have to move across the screen. Wait - of course your hand doesn't really have to move across the screen, the mouse does, but it feels as if it would have to! In fact, for a touch screen, light pen or stylus the right-hand side is a good idea, but not on-screen

Please read the whole paper for the historical perspective.

However this does raise the question about what would left handers do and I believe the answer to this would ideally be a reversal i.e. place the scrollbar on the left but its a case where economic incentive would trump usability.Taking this quote from a forum about why Microsoft does not support left sided scrollbars

Bill Gates is left-handed so a priority does exist. Microsoft has actually spent a couple years and a ton of money on development, but when it came down to it, there were too many third-party programs where the companies couldn't or wouldn't invest the time and money to make the change-over available to the users, and Microsoft can't alter the intellectual properties of another company.

Coming to your question about what to do in case of your IOS app , I would say it would depend on the balance of deciding between whether we should stick to design standards and place the scrollbar on the left for the RTL language and having users face challenges in hands across the screen to scroll down (considering the high demographic of right handed users) or place it on the right to prevent the overlapping of content but face the possible challenge it being against custom and also the user having to travel in the opposite direction to reading to scroll down

However if you are looking for examples of softwares which have done this for arabic or RTL langauges

If you are using an Arabic Operating System and your Windows locale is also Arabic, the scrollbar will automatically load correctly on the left of the browser. If, however, you have a European locale and the language preference within GMS is set to Arabic, Firefox will display the vertical scrollbar incorrectly on the right.

Here are some additional examples of RTL text and how it influences design

This Smashing Magazine article - Shalom! Showcase Of Web Design In Israel also has some design inspirations for RTL text specific web design