User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
I recently built a filter panel similar to the one left of Amazon.com search results.
My panel is different in that it can be collapsed out of the way to free up room for the results (see below)
I felt that the first letter of the title should basically remain in the same place as a user clicks to expand / collapse the panel so I went with option A but another developer thinks option B looks better.
I can't find anything official so I thought I'd ask here.
In general vertical text is best avoided, but in cases where it's the most viable option, the text should read from bottom to top. This is most commonly seen in feedback buttons:
The reason for this is often debated, but in my opinion it has clearly been shown that counter-clockwise (CCW) rotated text is easier to read that clockwise rotated text (CW). My simply explantation is that it's to maintain the left-right, and top-down consistency in reading. With the text flowing as in the example above, the top of the text is on the far left, which feels more natural than the alternative (at least for left-to-right languages).
Below is one example from Microsoft Visual Studio.
Panels can be docked and also collapsed to either side of the window. The vertical text always reads from top to bottom when the panel is collapsed to either the left or right side.
A user may have many of these dockable frames and by making the text of collapsed panels read from top to bottom it ensures that the first word of long titles is visible up top even if the rest of the title is truncated. The beginning of the title could also be shown going from bottom to top but in the case of truncation this would put the ellipse ... up top making it more prominent.
