Joshua Franklin Wiedeman

Above-Fold Clarity

The first screen a visitor sees, before scrolling, should answer three questions: what is this, who is it for, and what do I do next. Visitors decide quickly whether to stay. If that first screen is cluttered or vague, they leave before they reach the rest of the page.

How it works

Visitors arrive distracted and skeptical. The first screen does not need to explain everything. It needs to make one promise clearly. A useful check is the “grunt test”: after a glance, could someone say what you sell, why it matters, and what to do? That usually means one headline, one supporting line, one visual, and one call to action (CTA). Everything else competes for attention.

How to do it

  1. Write a headline that states the main benefit in plain, specific words. “Send emails that get opened” beats “Revolutionize your communication.”
  2. Show the headline to five people who do not know the product. Ask them what you sell. Rewrite until they can answer.
  3. Add a one-sentence subheadline that says who it is for and how it works.
  4. Add one primary CTA that says what happens on click, such as “Start free trial” or “See pricing.” Avoid “Learn more.”
  5. Make the CTA the highest-contrast element on the screen.
  6. Add one visual that shows the product in use, such as a screenshot or short demo.
  7. Move everything else below the fold. Keep navigation minimal and limit social proof to one line.

What to measure

  • 5-second test score: Show the first screen for 5 seconds in a tool like Lyssna or Maze, then ask testers what the page offers. Count correct answers.
  • Bounce without scroll: Share of visitors who leave without scrolling. High numbers point to a first-screen problem.
  • Above-fold CTA click rate: Share of visitors who click the main CTA without scrolling.

Best practices

  • Check the layout on a phone first. If the headline, subheadline, and CTA fit and read clearly at 375px wide, they will work on larger screens.
  • Use specific outcomes in the headline when you can back them up. “Cut reporting time in half” is clearer than “Save time.”
  • Squint at the page. The CTA should be the first thing you can make out.

Common pitfalls

  • Trying to say everything on the first screen. The result says nothing clearly.
  • Using a hero image or video that looks good but shows nothing about the product, such as stock photos of smiling people.
  • Placing the CTA below the fold or styling it so it blends in.