Solving the mystery of why users don't scroll beyond the hero and fixing it

Challenge & solution in a nutshell

More than 50% of Spyrosoft home page visitors weren't scrolling past the hero section. This meant that most visitors weren't reaching key information about Spyrosoft’s services, expertise and case studies of successful implementations – essential content for driving conversions.

I was responsible for gathering and analysing the data, identifying possible causes and proposing solutions. I suggested improvements, that included:

  • Redesigning the hero section to eliminate the “false floor” effect, by indicating there's more content below the fold.
  • Redesigning the information architecture and layout to bring focus on case studies.
  • Replacing the hero section’s visuals and copy with content that clearly communicates the company’s services and benefits to potential clients.

I was also responsible for wireframing the new, improved home page layout.

MY ROLE
Heatmap analysis
5-second test
Wireframes
Copywriting
TEAM
1 Graphic designer
1 Web Developer
1 Marketing Manager
4 Sr Marketing Specialists

The heatmap and recording analysis revealed the first fold is where most users drop off

  • Less than 50% of visitors scroll below the fold.
  • Only 30% of users scroll to the case studies section.
  • Upon landing on the home page, users jump to browse the navigation menu immediately instead of exploring the content below the fold.
  • Interestingly, the 'About' page is the second most visited subpage after users bounce off the home page.

Why do visitors not scroll down the page?

After analysing user behavior and website performance data as well as doing desk research on UX best practices for homepage design, I came up with three potential reasons for the problem:

1. Unclear message

The heading doesn’t communicate who the company is and what it does clearly enough, which is confusing for web visitors.

2. Weak content

The content in the hero section is not engaging enough to motivate users to explore the page.

3. False floor effect

The hero section spans the entire screen height without providing any visual cue that there’s more content below the fold.

5-second test proves the hero falls short to communicate the value proposition

I conducted a 5-second test with 5 users using Maze.co to evaluate if the copy and imagery used in the hero section effectively communicate what Spyrosoft offers.

The test revealed that website visitors are unclear about or misunderstand the purpose of the page based on the hero section alone.

"Based on what you saw, what do you think this company offers?"
"Digital services"
"Technology services"
"A company that does something related to technology"
"Shaping things together"
"I think it could be some kind of a software solution"

Putting all pieces of the puzzle together

Together with other marketing team members involved in the project, we held a series of workshops to discuss my insights, brainstorm ideas, and gather benchmarks.

We decided to go ahead with my proposals. The changes included:

  • Redesigning the homepage layout to remove the "false floor" effect and prioritize case studies — the content users are most interested in and which drives conversions.
  • Replacing the hero image with a video showcasing our team, clients and projects.
  • Rewriting the headline to help new website visitors quickly grasp what services Spyrosoft offers and how they can benefit from them, keeping the copy short and to the point.

Following the workshop, I created a wireframe for the new homepage.

Final design

The graphic designer prepared high-fidelity designs based on the wireframe and copy I provided.

The first iteration required a few adjustments because certain elements did not meet WCAG contrast standards, as shown below.

The improved design is currently in the development phase. The video is a placeholder

What's next?

We’ll monitor user behavior and website performance on the new homepage. The key metrics we’ll track include:

  • Scroll depth
  • Engagement with case studies
  • Clickthrough rate on CTAs
  • User paths after landing on the homepage
  • Conversion rate

If we identify any friction, we’ll run A/B tests to determine the best approach for reducing it and improving the user experience.

My key takeaways from this project

1. Data-driven recommendations are key to leadership buy-in

Relying on data adds credibility and rationale to convince leadership of the value of proposed changes.

2. The hero section is not the place for vagueness

The content in the hero section should communicate the page's purpose clearly and concisely, ensuring users immediately understand its relevance to their needs.