People do scroll. It’s even quite natural to the way we use websites or view content on mobile devices. But many marketers believe that like the mid-nineties people aren’t used to scrolling.
All content can’t possibly be made to fit into the first viewed screen. Nor is it readable when sliced into different screens. For example, longer articles or how-to-dos require more space but have to be easily accessed for coherence. Scrolling allows for an organic flow, readability, and continuity of content and makes it easy to navigate.
If you want people to scroll, you need to guide them with your content and design. But bear in mind the fact that despite today’s users being familiar with scrollable content, you still attract their attention only in the first page or above the fold, and this screen estate will always be the place where users decide on the worth of what’s to come.
Let’s take a look at the stats that show us people scroll.
- While attention may be focussed above the fold, people will scroll if the design encourages them to do so.
- Of 2 billion visits analysed, 66% of the attention was found below the fold.
- In a series of usability tests, it was found that people scroll regardless of how they are cued to do so nor based on page length.
- On mobile devices, scrolling has become an instinctive gesture made within the first 10-14 seconds.
- The most clicked CTAs/links are at the bottom of the home page.
- Long scrolling pages were found to be easier to read than paginated ones.
- The biggest proof to attest these words: in 2011 Apple removed the scrollbar from its Mac OS X (with a setting option to put it back), indicating how familiar people are with scrolling they don’t need a visual clue for it.
How to clue users into scrolling
If the page is designed to accommodate it, people will be compelled to scroll.
- Less content above the fold may make users curious about exploring what’s below.
- The cut-off look encourages scrolling. It lets people know there is more content below and keeps the interest alive. Otherwise, if all the sections end evenly on the page and it looks complete, it could look like everything has loaded, and users subconsciously decide there is nothing more below.
- Strong horizontal lines across the bottom of the page discourage scrolling. E.g. heading banners with titles highlighted this way. This doesn’t mean you have to avoid it at all costs, but use it with the cut-off look mentioned above.
- Less is more works brilliantly for the first screen or top of the fold. With good use of the white space and imagery, you can let the user know this is where they will find what they are looking for, as well as whet the user’s appetite to scroll down.
- Avoid in-page scroll bars. It disorients users as to the amount of content on the entire page and may lead to important content not being viewed.
Additional use of the scrollbar
This interface element doesn’t just serve the purpose of scrolling.
- Firstly, it suggests that all the content isn’t in one frame but there is more below which can be accessed by scrolling.
- It is an indicator of the length of the content being displayed. (A short scroll bar means less content on the page and vice versa).
- This gives viewers a sense of scope and orientation at a glance.
- When navigating a longer piece of content, it offers a way for people to quickly jump back to find earlier pieces of the content by the approximate position of the bar at that point in the text.
- It does all of the above elegantly, inconspicuously, and without distracting from the page content.
While scrolling with a scrollbar can become inconvenient when being used on mobile devices, the now familiar and universal action of thumbing the page up or down or sideways has helped overcome it. At the moment of swiping the screen, the scrollbar briefly appears, orienting the person as to which part of the document they are in, and disappears again unobtrusively.
So digital marketers, don’t be afraid to create scrollable content. Only worry about laying it out well in a manner that suggests and encourages scrolling!