How should horizontal scrolling be handled?

Question

In this example, horizontal scrolling is handled with vertical scrolling.

My question is: is this a good practice for handling horizontal scrolling in desktops? Is there a better way or horizontal scrolling shouldn't exist in desktops at all?

I have also seen that some mouse manufactures start to worry about this: for instance Logitech, and even Microsoft (which make sense due to Windows 8).

But we cannot expect that users will have one of these mouses when using our website/application, right?

What do you think about this?

Answer 1

is this a good practice for handling horizontal scrolling in desktops?

Certainly not; to see why all you have to do is shrink your browser window until you get a vertical scroll bar...on that page you cannot vertically scroll, ever. They've ruined the ability to scroll normally just to save you from pressing the arrow keys, using a tilt-wheel mouse, using autoscroll or clicking and dragging the horizontal bar (people forget there are actually a variety of ways to horizontally scroll).

This is one of those cases where it makes sense to stick to convention; even though horizontal scrolling on desktop is rare (and should be), odds are your site isn't the first horizontal scroller the user has seen. They're going to expect horizontal scrolling to work just like it does on other sites (and they're certainly going to expect vertical scrolling to work as it does on other sites). Tiltwheel mice are becoming increasingly common, and the trusty horizontal scrollbar, though loathed so much by designers, does it's job well enough.

Now there is a time and place for fancy scroll effects where vertical scrolling results in paralax scrolling, slideshow effects or other unusual scrolling methods...but those cases are rare, and are part of specialty interfaces like showcases or slideshows, not a normal interface where a more traditional method of scrolling would be preferred.

Answer 2

If you need to scroll objects or elements that fit into the width of a screen, you should stick to vertical scrolling. It's easier for people to read, easier to interact with, and what people are used to. The example that you have given has poor UX, and I would avoid it.

There are, however, situations where you need both horizontal and vertical scrolling, in which case there isn't really much of an alternative to using both. Examples include spreadsheets or large graphics files.

Answer 3

There are some cases where it makes sense to do that. For example, you're making a parallax (misnomer) experience and you want content to fly in from all directions. http://www.nike.com/jumpman23/aj2012/ If you stick by the guidelines, the user would be stuck since he needs to navigate vertically, horizontally and diagonally(?).

What I understand from this is, if you have multiple scrolling situations in the same page (not entire page, but sections of the page), you might want to do horizontal scrolling with a vertical scroll.

Ideally, you want to stick with the norms, horizontal scroll for horizontal content and vertical for vertical. You can use subtle hints to tell your user that there is more content in a particular direction. Cut-off a letter halfway/apply a shadow border to show there is hidden content in that direction, keep the scroll bar permanently visible, etc.

Answer 4

Scrolling is a burden.
We have to force users to scroll because of the limited size of the current screens, where current means ever.
Nowadays users are used to scroll, and they can do it mostly without paying any attention. Something like zero attention would be best.

Now, each time a designer comes out with a different scrolling scheme, it breaks the user's automatic behavior forcing them to think, to pay attention.
Being a burden, taking less from the user is better.

This is aligned with the suggestions of those who endorse sticking to the normal operation, Ben Brocka and JohnGB.

Additionally, notice than in bisc8's example if the viewport has a certain width and height, showing a complete item, the user might not notice the need to scroll.

Answer 5

Note that there's already an irritating usability issue on that page - I cannot use two-finger gesture on MacBook trackpad to go back from that page. Don't do that!