Exploring the blog’s above the fold

What to keep and what to ditch if you want more focus.
Ever wondered what you should keep above the fold on a blog homepage?

Each company prioritizes elements that are aligned with its business goals.

Let’s see what this looks like in practice:

[note I added links instead of images so you'd get the same experience as that blog's readers]
  • Keeping the focus on one thing with a single article feature or CTA
  • Multiple highlights to bring more views for articles you’re trying to promote
  • A similar mix of multiple goals but done better from a design POV [this blog homepage resembles traditional SaaS homepages with the Subscribe CTA replacing your go-to Sign up CTA]
  • When you’ve got different goals like Asana showcasing an article and a playbook but also wanting to get people in their email list [note how this above the fold lets the rest of the page peek so you’ll know that if you scroll down, you’ll find more articles]
  • Another good above the fold practice that previews the below the fold area
  • And yet another one
  • And another one [seems like most companies are trying to keep one goal/above the fold]
  • I also like this approach as it allows you to use the above-the-fold space to showcase a different type of content. Most people on your blog homepage will probably come via a blog post, so it’s refreshing to present/see something else.

Now for a bad example

See what Squarespace did with their blog. They're taking too much space just for the name of the blog. Greenhouse provides another negative example but it’s a bit better as it at least highlights what you’re going to get if you scroll down.

Keep in mind blog homepages don’t usually get a lot of traffic anyway.

So if you’re able to at least impress those brand fans and loyal readers who take the time to look at it, make it worth their time. This means understanding what your loyal readers really want. Sometimes it’s just seeing your best post, but for industries such as web development, it’s probably getting an overview of the topics you tackle [so it’s easier to find content they want to read] like this perfect layout.

One final note on blog homepages

I can’t stress the importance of optimizing for different devices and screens. Take the way your blog looks like on mobile into consideration as well and test the design with multiple zoom options [yes, even when you’re not the designer]. 

This blog, for instance, would be decent but I’m not seeing any of the CTAs above the fold.

Depending on how people are used to scrolling [and on what mouse they’re using, ugh] having your important CTAs right in between what’s above the fold and the rest might cause people to miss them. That’s because they’ll scroll directly to the posts or whatever you have below the fold instead. So you’ve wasted your blog’s real estate for good.

What about independent article pages?

But what’s above the fold on every article page also matters.
  • My favorite example with all the right info at the top [we took this as inspo at Wynter]
  • For certain industries, you just need to know what the reader would want. Like a post summary + tags/categories so they can find related content.
  • A lazier approach to the same format. This one has a big See all resources CTA for readers who might want to read similar posts. Not relevant if you ask me, but you can use that space for a product pitch/CTA/small banner/whatever you can test.

And… closing with the classic example of what not to do.
If this edition made ya' change something on your blog, don't forget to send it to a friend and save their content!

Until next time,
Alexandra Cote


Was this email forwarded to you? Sign up here.

Copyright © 2022 COTE ALEXANDRA MONICA PFA, All rights reserved.

Want to change how you receive these emails?
You can update your preferences or unsubscribe from this list.

Email Marketing Powered by Mailchimp