Scrolling a page: Is Scrolling Right for You?

Pageless Designs of the Future

Long scrolling sites are not going anywhere. While we’ve seen ebbs and flows (or increases and decreases) in the sizes of screens on popular devices, small is here for the foreseeable future. And small screens require more scrolling.

Actually, the transition from long-scrolling to “pageless” design has already started, and some designers (like those at Digital Telepathy) even believe it is the future of the web. As websites continue to shed some of the constraints of how users think about and consume information, designers must think more radically about the best ways to create content in different environments.

Interaction design is the foundation of long scrolling website design. If users like the interface and find it intuitive and fun to use, then they won’t really mind the length of the scroll (as long as it’s not atrociously long).

With every design technique and tool, there are those who love the concept and those who hate it. In most cases, neither side is intrinsically right or wrong; that’s why it’s important to weigh all considerations before tackling such a project.

Advantages of Scrolling:

• Encourages interaction – With the ever constant stimulation of changing element, it can be an interesting storytelling method that encourages user interaction – especially with tastefully-executed parallax scrolling.
• Faster – Long scrolling is faster than clicking through a complex navigation path and does not slow down or limit the user experience. As described in Interaction Design Best Practices, the perception of time is often more important than the actual passing of time.
• Entices users – The ease of use promotes interactivity and increase time on site. This is especially true for infinite scrolling sites, where you can help users discover relevant content that they may not have even thought of.
• Responsive design – Page designing can get complicated across devices with different screen sizes and capabilities, but scrolling helps simplify the differences.
• Gesture controls – Scrolling seems organically linked with touch, since swiping downwards is much easier than repeated taps on different areas of the screen. Users (especially mobile) are commonly accepting this as a way to display information.
• Delightful design – Few clicks can result in quicker interactions for a more app- or game-like user experience.

Disadvantages of Scrolling:

• Stubborn users – Nevermind why, some users always resist change. Nonetheless, the technique is so widespread now (especially during mobile experiences) that it’s probably safe to say that the majority of users are accustomed to the technique.
• SEO drawbacks – Having only one page may have a negative effect on the site’s SEO. (To learn how to minimize these SEO downsides, check out this Moz piece for parallax scroll and this Quicksprout piece for infinite scroll.)
• Disorienting – The disconnection between scrolling and content may leave users confused or disjointed.
• Navigational difficulties – It can be awkward to “go back” to previous content on the page. To counter this, you could create a persistent top navigation where each item is anchored to a page section
• Site Speed – Large pieces of content such as video or image galleries may slow down the site speed, especially for parallax-scrolling sites, which rely upon Javascript and jQuery (check out this tutorial to learn how to create parallax sites without slow site speed).
• No footers – With infinite-scrolling sites, we’d recommend a lean “sticky” footer so you don’t sacrifice navigability. Otherwise, users may be confused by a lack of further navigation at the bottom of the page.

Summary:

Advantages and disadvantages aside, the long scroll is a technique that suits some types of sites more than others. Longer scrolling websites and best suited for content and design plans that…

• … are going to include a significant portion of mobile traffic (most users)
• … include frequent updates or new content (such as a blog)
• … have a lot of information presented in a singular way for comprehension (such as an infographic)
• … do not contain rich media because of the drain this can cause in terms of load times