0

This is how the tool works. Users need to first interact with the toolbar to see the information on the information panel.

Currently we have two arguments regarding where should the toolbar and information panel be placed. Right or left.

enter image description here

enter image description here

A. Since people are reading from left to right. And users need to first interact with the toolbar then see result display on the information panel. Therefore, toolbar should be placed on the left side. This argument is emphasizing on interaction.

B. Since people are reading from left to right. Information panel should be placed on the left side and toolbar on the right. This argument is emphasizing on reading information.

I’ve been trying to search for some answer. I am just wondering is there any study out there talks about the optimal toolbar placement. And what’s your rationale?

The closest I can find is this A Study on Optimizing Toolbar Placement in Computer Graphical User Interfaces

2 Answers 2

2

Place the "toolbar" on the left, and the information panel on the right.

Why?

The F-Pattern

This positioning emphasizes the natural left-to-right movement you mentioned—a user first reads the items in the "toolbar", then reads the detailed information.

This pattern, known as the F-pattern, is a very common way that a user will process a page; users often prefer to scan the top and left side of pages. Aligning your layout with this instinct will provide a more natural feeling for your users.

For example

This positioning is favored by several other types of applications which use an item-detail relationship. For example:

  • Email clients list messages on the left
  • Instant messaging clients, such as Skype and Google Hangouts, group conversations on the left
  • File explorers, including Windows Explorer and Finder, have top-level folders stuck on the left
2
  • Did you read the article you linked? The F pattern is mirrored for RTL languages, so it should be on the right for RTL languages.
    – phyrfox
    Apr 13, 2018 at 15:43
  • @phyrfox, sorry, maybe I am missing something; OP said "people are reading from left to right", so I feel that my advice is accurate. Apr 13, 2018 at 15:45
0

People read both left-to-right (LTR) and right-to-left (RTL). You should put the toolbar, which is arguably the most important starting point for your program, in the place where people start scanning. For LTR readers, that's on the left, and for RTL readers, that's on the right. This is the simple principle of putting the most important details in the first place a person would look, which is usually where people have been trained to look from years of reading.

If you can determine the user's language, use the language's natural flow (LTR/RTL) to determine the placement of the toolbar, and if not, consider just asking the user, or allowing the user to freely move/dock to either side at their convenience.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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