Unfortunate fact of the day: your blog's homepage is getting in the way of people reading your articles.
It's true. Your homepage design plays a HUGE role in visitors staying on or leaving your page. In some cases, up to 56% of visitors leave a blog before they see the first article.
Could you imagine half your visitors not seeing a single article? You worked hard for that traffic, and all they do is leave. How rude.
But how would you know if that's happening? If you've got a blog, you're probably looking at these stats:
- Visits
- Pageviews
- Time On Site
- Opt-ins (maybe)
That's it.
But you know what no one is talking about? It's quite possibly the most important stat with the rise in mobile phone usage and fall of attention spans.
That one stat? Scroll rate.
That's the one stat that matters most when you buy our create a blog homepage. Scroll rate, in layman's terms, is how much of your page people actually see. The more you scroll, the farther down a page you get.
Here's an example of why that's so important. Let's say this is your blog homepage:
On the surface, great looking homepage. Lots of articles, looks modern, and it's mobile-responsive. By my count, you can see 14 of your articles on the page. Not bad at all.
But imagine your visitors only saw this much of your homepage:
For the record, that's 12% of your homepage. If you were using this template, that means your visitors would see three of your 12 articles.
That's what happens when visitors don't scroll on your homepage.
It essentially means those other articles don't exist. It's kind of hard to read something when you don't even know it's there.
You can use certain tools to see how far people scroll on your site. In the meantime, here are five ways the best blogs keep people scrolling.
Tip #1: Use A Hero Layout
This is one of the most successful above-the-fold (first thing you see on a site) layouts currently available. A hero layout is comprised of three things: your logo, a small menu and a large, full-screen image.
Check out this example from A Sweet Pea Chef:
94% of readers get to the bottom of the fold (read: screen). To give you perspective, the average first fold of successful blogs only retained 81% of readers.
A Sweet Pea Chef has a perfect, textbook above the fold layout. There's a category menu, their first image/article and a spot to opt-into the blog. Nothing crazy complex, and it keeps people engaged enough to keep scrolling.
A few reasons to love this:
- Visitors Know To Scroll: Visitors know there isn't just one article on a homepage. By keeping additional stories below the fold, you guide your visitor to scroll more.
Tip #2: Ditch The Slider
When I say slider, I'm talking about a feature on your page that cycles through your articles. They're built into almost every blog template you can buy.
Even though data proves they shouldn't be.
The University of Notre Dame conducted an eye-opening study on sliders. Of the 3.7 million visits the official website pulled in during a six-month period, only 1% of people clicked on ANY of their slider images.
Plus, remember what I said in the intro. On blogs that had sliders above the fold, only an average of 69% of visitors stayed on the page.
"But what if they're leaving the page because they're clicking on my article?"
A few people might click on your slider, but the vast majority won't. That's because:
- The slider isn't loading
- They're experiencing banner blindness,
- It's being blocked by a pop-up blocker
- Or they just don't like your slider.
Using a slider sets you up for failure from the moment your page loads. Make your image static (non-moving) and leave it at that.
Tip #3: Embrace The Rows
The most consistent layout for scrolling is the row layout.
Here's the key when you look at a scroll map. The warmer the color (red, orange, yellow), the more visitors on that section of a page. The cooler the color (green, purple, blue), the fewer visitors.
Obviously you want warmer colors throughout your entire page. But that's rare. Instead, you want long, gradual fades into colors as opposed to short, quick changes. The latter means something is wrong with your page and people are leaving in a hurry.
Look at all these below the fold layouts that use the row style and notice how gradual their changes are:
Here's the Science of People keeping visitors on the page, scrolling down to the next fold.
And here's Big Think with a great example (only 8% of visitors leave). Their row layout it a bit bigger, but you can still clearly see two articles in the fold.
This layout works for two reasons:
- Avoids Choice Overwhelm: Rows fall in line with scrolling habits. Each scroll brings one new article into view. The eye doesn't have to track anything unfamiliar, which makes it easy to scroll farther.
There are variations on the row style (image size, headline placement, etc), but the fact remains this layout remains tried and true to this day.
Tip #4: Keep Your Layout Consistent
Consistency is what keeps your visitors scrolling. The same layout, repeated over and over makes it easy for your readers to scan and scroll.
Disrupt that layout and you create a completely different viewing experience. Ever walk through your long-time grocery store and one day they change up the aisles?
It's confusing and you get more frustrated than curious.
Look what happens when a blog changes up their layout below the fold:
The color change is abrupt (orange to green), which is essentially a 30%+ loss in visitors.
But look what happens when you keep your layout consistent:
Look at how little drop-off there is (less than 15%). This is The Rideshare Guy's blog keeping visitors scrolling through the page. He doesn't go with the row strategy, but that's because he's consistent with his layout and his headlines are great.
There are so many new templates flooding the marketplace with crazy designs and funky layouts (I know, I sound like a crotchety old person). But it's the ones that stay consistent that perform best.
Tip #5: Have A Brief Description
Article descriptions might be the most overlooked part of a blog layout.
But it's the one aspect that can control your entire layout.
Of the four types of layouts (none, small, medium, long), small to medium descriptions are used in 73% of successful blogs.
Three reasons for that:
- More Control: Long descriptions are essentially copy/pastes of your article. Shorter descriptions let you control how much you want to show to readers.
The majority of successful blogs -- layouts that keep people scrolling -- use these small to medium descriptions to walk the line between scrolling and clicking.
Emulate them, and your site can see success, too.
Emulate all five of these tips, though, and your blog homepage