Horizontal Scrolling

Q: How do you design a transactional page that requires horizontal scrolling? Do you freeze the left frame like Excel, or use tabs?

It is almost never appropriate to design a page that includes horizontal scrolling. In several studies conducted by Expero staff, horizontal scrolling caused many serious usability issues. For example, in one study, users repeatedly failed to see important row actions within a page that scrolled horizontally – there was just too much information on the page for the user to see what they needed to do.

When data begins to scroll horizontally, one approach is to show only a subset of the data in the page. You can use “details” links to show more data on a secondary page, or you can use “drawers” that will open up more information when the user explicitly selects the control.

Another suggestion is to have view-only pages that can show more information, and take the users to a form-like page to edit information. The different views are each optimized to present data in the most appropriate way for viewing or editing.

Test any pages that contain horizontal scrolling with your users to benchmark any usability issues. Redesign the pages to eliminate horizontal scrolling and see whether there are differences in such metrics as number and severity of usability issues, or time to complete tasks.

Generally, redesigning the page to eliminate horizontal scrolling will improve the user experience.