The ONE Stat Your Online Business Should Pay Attention to in 2017

Unfortunate fact of the day: your blog's homepage is getting in the way of people reading your articles.
This post was published on the now-closed HuffPost Contributor platform. Contributors control their own work and posted freely to our site. If you need to flag this entry as abusive, send us an email.

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:

2016-09-23-1474646679-6390207-image_0.jpg

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:

2016-09-23-1474646705-5763297-image_1.jpg

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:

2016-09-23-1474646764-7685140-image_2.jpg

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.

  • You Give Choice: The menu allows readers to see certain types of articles. That helps them get to what they want way faster.
  • Simplicity: You either click the article, go to a category or scroll down. Choice paralysis doesn't set in with dozens of options in the first fold.
  • 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:

    2016-09-23-1474646953-3662572-image_3.jpg

    Here's the Science of People keeping visitors on the page, scrolling down to the next fold.

    2016-09-23-1474646983-9518363-image_4.jpg

    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.

    2016-09-23-1474647013-9982801-image_5.jpg

    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.
  • Information Is Easy to Digest: Everything is close together and in context. You don't have to scroll down past a title and image to see a description. It's compact and easy to reference as a whole.
  • 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:

    2016-09-23-1474647048-6019493-image_6.jpg

    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:

    2016-09-23-1474647098-3588083-image_7.jpg

    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.

  • Headlines Aren't Enough: With a headline and image, you only have those two options to inspire a click. The description offers a third option to capture those people on the fence.
  • You Save Space: Longer descriptions take up more space, which means you get less articles in each fold. That's the difference between one article and three.
  • 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

    Popular in the Community

    Close

    What's Hot