First impressions are...well...everything! Especially when it’s the first time a customer visits your brand’s website. And one of the most commonly viewed pages users typically land on is your home page. What happens next? Well, that really depends on what’s above the fold.

What Do We Mean 'Above the Fold'?

Before users can scroll down the home page, their very first interaction with your site takes place above the fold; also known as the ‘hero’ section. You might have a hero image with a quick call to action, a video looping, or maybe artwork, products, or some type of animation in that particular section.

No matter what’s happening above the fold, one fact remains: it needs to be compelling to keep users on the page long enough to explore the rest of your site. If what they see is outdated or it conflicts with your brand, they might bounce without even getting to know you.

Last week, I sat down with Josh, founder of Clokendagger, to discuss this small, yet essential space, and how you can make a better first impression with visitors.

Not a fan of reading interviews? No worries! Listen to Episode 1 of Clokendagger's official podcast, Beneath the Brand, for an in-depth listen at what’s really going on above the fold.

LISTEN NOW →

Q: Josh, why is above the fold so important for a company's website?

Josh: You said it yourself. First impressions really are everything! Think about every time you go shopping and see in-store signage or product packaging. The information displayed—as graphics and typography—has one shot to grab your attention and make you want to lean in for a closer look.You want this same effect when someone is visiting your home page.

Q: Why dedicate an entire article (and podcast) to this topic?

Josh: Sometimes, designers don’t get this part right. And that might mean less visitors exploring your site and getting to know your brand. I’ve seen above the fold done extremely well, and I’ve seen it done poorly. I don’t think this area gets enough attention, and since the majority of viewers land on a home page more than any other URL, it’s fair to say it should.

Q: Why do you think some websites are missing the mark?

Josh: I think a big issue is not conducting any type of user testing. Feedback is so important in graphic design and web development. If you’re designing a website, whether it’s for a client or for yourself, you have to get constructive feedback from other designers before you launch.

Does it hurt when someone doesn’t like your initial idea, of course it does! But can someone help you view a webpage or graphic from a different perspective and improve it, absolutely!

My advice is to be open to criticism. Nine times out of ten, the person isn’t trying to hurt you. They’re trying to help you, and if you take a second to listen up, you could just learn something new that makes you a better designer.

This actually reminds me of another issue: staying up-to-date with design trends. Just like with SEO, content marketing, or PPC, you have to stay informed and educated in your field, especially with design. The world is changing quickly, so you need to keep up with creative graphic design in our country and around the world. This is also great for inspiration and adding another skill set to your design tool kit.

Q: How do you stay informed on design trends?

Josh: I follow creative design influencers on social media, like The Futur and Tobias van Schneider. I’m also a member of an online academy, which offers me a great platform to share work with other designers and get constructive feedback. Staying connected to other designers and learning from the pros is essential, but it’s a never-ending journey. But if you love what you do, you should always be hungry to learn more. If you’re not, this might not be the right career path.

Q: What are some do’s and don’ts you recommend for someone designing above the fold?

Josh: There are a few simple tricks you can pretty much use for every home page design to help you avoid rookie mistakes that could lead to users bouncing off.

Do's

• Design for All Devices - It sounds simple enough, but you’d be surprised at how many designers and developers forget to check their work on different screen sizes. As many of us design on desktop, it's important to view your work on laptop, tablet, and mobile screens to ensure your design remains consistent.
• Above the Fold Should Match Your Brand - Want to use illustration? Great! Next question: is it part of your brand? No? Well, that might get confusing. Always be consistent with your branding. That means make sure the logo, color scheme and graphics complement your brand’s identity.
• Show What You Do - Too often, home pages feature hero images or graphics that don’t have anything to do with the company’s work, products, or services. An example might be a cityscape. Though it’s fine to show where you’re located, it’s even more impactful to “show” what you do. After all, the user is looking at what you can do for them.

Dont's

• Avoid Obvious Stock Images - If you’re using a hero image for this space, avoid free stock images. Seriously, everyone knows when you’re using something from Pexels or Unsplash. I’m not saying these are bad resources. But if you’re not willing to invest in your website, people will notice it.
• Don't Forget a Tagline - Headers are great for SEO, and they’re also effective at telling people who you are and what you provide. Make sure the copy is clear, direct and to the point, though. Clutter will just keep people away.
• Don't Be Pushy with the CTA - Under your tagline, you’ll want a call to action to get users to explore more. But don’t assume that they’ll want to “buy now” or “contact you” right away. They literally just met you. Maybe give them two buttons instead—a “contact us” and a “learn more. This way, they have the option to discover more about your products or services. This benefits both new and returning users, too.

Q: Any final words of wisdom?

Josh: Yes, if you’re working on a WordPress template, it’s best to leave the layout as is, unless you're using a child theme. What I mean is, don’t go through the trouble of selecting a website template only to customize it to death and break it for good.

Remember that designers and developers are hired to create those templates, which means they’re spending hours perfecting it. When you go in and try to change things around, it’s messing with their masterpiece. And it ALWAYS becomes more of a headache.

One other piece of advice: Sign up forms are a great way to get subscribers but just like a demanding CTA is bad manners so is a subscription popup that fills the screen the exact moment a user arrives on the home page.

Give users time to get to know you before they see your popup. There are many ways you can customize this feature to appear after a certain span of time or as users scroll down to explore more. Give them a chance to get to know you first. No one likes a pushy salesman, even on a website’s home page.

Thanks Josh! Want a deeper dive into this topic? Be sure to listen to our podcast Beneath the Brand: Episode 1 - Above the Fold. You'll find more tips and ideas to help make your above the fold compelling and engaging!

Need Help Navigating Above the Fold?

Connect with our team to learn how we can design you a creative website that showcases your products or services. We offer graphic design and website development services to help you convert users into loyal customers.

Request a consultation today to learn about more ways we can help build your brand!