We base our visual and interaction designs on fundamentally sound principles. These principles consist of things we learned in school, things we personally experienced to be true, and things commonly understood as “best practice” (BTW: “best practice” is tied with “game-changer” as my least favorite industry phrases). These principles eventually become unconsciously baked into everything we do. This is natural and necessary. However, stepping back and re-examining exactly why we do things is an important part of critiquing design. It might “feel right,” but if we can’t articulate why a chosen approach is preferred then the approach should be open for discussion.
The decision about whether to use scrolling instead of clicking in an interface is one such principle I rely on daily in my work. Obviously the approach I take on each design just “feels right” to me, but sometimes it can be a struggle to articulate why. There has been a ton written that compares scrolling and clicking in interfaces (try Googling “scrolling vs clicking”). So I wanted to examine this principle and collect some sound rationale for choosing one over the other.
According to a research report put out by ClickTale (report):
- 91% of the page views were long enough to contain scroll-bar. Of those, 76% were scrolled to some extent.
- 22% of the page views with a scroll-bar were scrolled all the way to the bottom.
- Visitors are equally likely to scan the entire page no matter the page size.
In an A/B test done by Elastic Path on the redesign of the Official Vancouver 2010 Olympic Store checkout page (article):
- After only 300 transactions, the winner was clear and we stopped the experiment after 606 transactions. Google Website Optimizer concluded that the single-page checkout outperformed the out-of-the-box checkout by a whopping 21.8%.
In an article titled “Blasting the Myth of the Fold,” Milissa Tarquini notes:
- The most clicked on item on the TMZ homepage is the link at the very bottom of the page that takes users to the next page. Note that the TMZ homepage is often over 15000 pixels long.
- On the “AOL News Daily Pulse,” you’ll notice the poll at the bottom of the page – the vote counts are well over 300,000 each. This means that not only did folks scroll over 2000 pixels to the bottom of the page, they actually took the time to answer a poll while they were there. Hundreds of thousands of people taking a poll at the bottom of a page can easily be called a success.
And the Winner is …
Sorry to disappoint, but even though it’s clear that people do in fact scroll, this data doesn’t suggest that scrolling wins over clicking in all cases. It turns out that the action of clicking has some unique benefits, as well. Here’s what others are saying about both.
According to an article titled “Why Scrolling is the New Click,” “Scrolling is faster for users than clicking. With mouse wheels and touchpad swipes, users can scroll through content with a flick of a finger. Compare that with clicking, where users have to find the link, read it, target it, click it and wait for the page to load.” The author also goes on to say that by using scroll, users receive content in the order it was designed and keeps them in the reading flow. Clicking breaks that flow and allows users to skip around. In the end, the author concludes, “It seems that scrolling is better for usability. But clicking is better for analytics and search engines. As the designer, it’s your job to weigh what’s important.”
In the article “Scrolling is Easier Than Clicking,” the author states, “So here is the real difference: scrolling is a continuation; clicking is a decision. Scrolling is simply continuing to do what you’re currently doing, which is typically reading. Clicking, however, is asking the user to consider something new … is this new thing the same as what I’m already doing, or something new? Obviously this is a small interaction … but think about it in scale. Hundreds or thousands of decisions taken together add up to real friction.” The author goes on to say, “… consider what you’re asking your users to do. Are you asking them to make a real decision and go someplace else? Or are you asking them to just scroll a little further to see what’s next? Cognitively, it’s easier to move a little where you are than to go somewhere else.”
The article “Life Beyond the Fold - Scrolling vs Clicking” discusses that clicking is ideal for organizing large chunks of information. “For larger websites, page clicking is a must. We recently had the privilege of re-designing one of Chicago’s most popular online publications, The Chicago Sun-Times. In order to provide an optimal user experience for this site, it was very important to guide users readers down the right path, without overloading them with information they have no interest in.” The author goes on to say, “Users will scroll, when given the proper guidance to do so. You do not want to overwhelm someone with too much information, in too little of space. Allowing a design to extend down the page creates nice visual separation. It is very difficult to have a clear hierarchy without some white space between groups of content.”
Usability guru Jared Spool stated in his article “As the Page Scrolls,” “… one of the most significant findings of our research on web-site usability is that users are perfectly willing to scroll. However, they’ll only do it if the page gives them strong clues that scrolling will help them find what they’re looking for.” He goes on to say, “In the trade-off between hiding content below the fold or spreading it across several pages, users have greater success when the content is on a single page.”
Go Forth and Scroll … or Click
Like everything in life there are pros and cons to both approaches. Every design challenge needs to be evaluated individually. From a usability perspective, my research seems to validate that scrolling is the easier interaction of the two. Paddy Donnelly put it great in the article “Life, Below 600px”: “Think about the ultimate journey you want (users) to take. Entice them in, make them actively want to scroll and read on, and on, and on. Guide them with your excellent content and let them explore your site. Tell a story with your content. Space it out a little and you will have some happy visitors who actually want to be there!”
When do you use scrolling instead of clicking and vice versa?