How We Increased Lead Captures 41% With Sticky Header CTA Tests on a B2B Onboarding SaaS
We ran a focused conversion experiment across 12 landing pages for Ramplo, a B2B SaaS onboarding tool serving mid-market HR and operations teams. The goal was straightforward: stop losing warm visitors who scrolled past the hero section without converting. After 9 scroll-triggered sticky header CTA tests using Hotjar, Google Optimize, and Webflow’s native interaction builder, we documented a 41% lift in qualified lead captures measured by demo request form completions. This post breaks down exactly what we tested, what failed, and what scaled. Learn more about A/B testing hero section experiments.
Sticky headers are one of the most underutilized conversion surfaces in B2B SaaS design. Most teams treat them as navigation bars and nothing more. What we discovered at Ramplo is that the sticky header is prime real estate for a secondary CTA that becomes increasingly persuasive the further a visitor scrolls — because deeper scroll depth directly correlates with higher intent. The challenge is designing a CTA that earns attention without disrupting reading flow. Learn more about CTA placement performance testing.
Why Ramplo’s Sticky Header Was Bleeding Conversions Before We Intervened
Before we started testing, Ramplo’s sticky header contained a logo, four navigation links, and a ghost-style “Login” button. There was no conversion-focused CTA in the header at all. Hotjar scroll maps showed that 68% of visitors who reached the pricing section — roughly 40% of the way down the page — never made it back up to click the hero section’s primary “Book a Demo” button. The header was present on every scroll position but doing zero conversion work. Learn more about conversion rate optimization elements.
We pulled three months of session recordings and identified a specific behavioral pattern: visitors would scroll to the feature comparison table, pause, and then either bounce or navigate directly to the pricing page. They were clearly evaluating but had no frictionless action path available at that scroll depth. The hero CTA was out of sight, the footer CTA felt final and intimidating, and the sticky header offered no middle-ground action. That gap was the opportunity. Learn more about scroll-triggered urgency element placements.
Our hypothesis going into the test series was that introducing a contextually aware CTA into the sticky header — one that changed copy or style based on scroll depth — would intercept high-intent visitors at exactly the right moment. We set a 6-week testing window, split traffic 50/50 on each variant using Google Optimize, and tracked primary conversions via demo request completions confirmed through Ramplo’s HubSpot pipeline. Every test ran until we hit statistical significance at 95% confidence. Learn more about above-the-fold landing page optimization.
The 9 Scroll-Triggered Tests We Ran and What Each One Taught Us
We structured our 9 tests into three phases: visibility timing, copy relevance, and design behavior. Each test built on the previous one, which is why we recommend running these sequentially rather than as an isolated A/B split. Here is the full breakdown of what we tested on Ramplo’s primary demo landing page, including the variant that ultimately drove the 41% lift.
| Test # | Variable Tested | Variant Description | Result vs. Control |
|---|---|---|---|
| 1 | CTA Visibility Trigger | Header CTA appears at 25% scroll depth | +8% demo requests |
| 2 | CTA Visibility Trigger | Header CTA appears at 50% scroll depth | +14% demo requests |
| 3 | CTA Visibility Trigger | Header CTA appears at 75% scroll depth | +6% demo requests |
| 4 | Button Copy — Generic | “Book a Demo” (static, all scroll depths) | Baseline |
| 5 | Button Copy — Feature-Aware | “See This Feature Live” (triggers near feature section) | +19% demo requests |
| 6 | Button Copy — Pricing-Aware | “Get Custom Pricing” (triggers near pricing section) | +22% demo requests |
| 7 | Visual Design — Color Shift | CTA button shifts from outline to filled at 50% scroll | +11% demo requests |
| 8 | Social Proof Microcopy | Added “Join 800+ HR teams” below CTA button | +17% demo requests |
| 9 | Full Combined Variant | Tests 2 + 6 + 7 + 8 combined | +41% demo requests |
The most important insight from the first three tests was that scroll depth trigger timing matters more than almost any other variable. Triggering too early at 25% scroll depth meant the CTA competed with the hero section’s primary button, creating visual noise rather than a complementary pathway. The 50% trigger hit visitors who had already consumed the feature narrative but hadn’t yet committed — that is the highest-intent window Ramplo’s page had to offer.
Stop Guessing. Start Converting.
LeadFlux AI Does the Heavy Lifting.
Tracking KPIs is only half the battle — you need a system that turns data into revenue. LeadFlux AI automatically identifies your highest-value prospects, scores leads in real time, and delivers conversion-ready pipelines so you can focus on closing deals, not chasing dead ends.
See How LeadFlux AI WorksTests 5 and 6 were the most instructive because they revealed how strongly B2B SaaS visitors respond to contextual specificity. “Book a Demo” is a generic ask that puts the entire decision burden on the visitor. “Get Custom Pricing” is a specific ask that matches the visitor’s exact mental state when they are staring at a pricing section wondering whether Ramplo fits their budget. Contextual copy out-performed generic copy by 22% on its own — before we even layered in the other variables.
The Technical Implementation Stack We Used to Make This Work
We implemented scroll-depth detection using a lightweight JavaScript snippet that fired Webflow’s native interaction triggers at defined scroll percentage thresholds. This approach avoided the need for a third-party scroll library and kept page load impact under 12 milliseconds on our Lighthouse audits. For teams not using Webflow, the same logic can be replicated with a 15-line vanilla JavaScript IntersectionObserver function targeting section anchors rather than percentage-based scroll events.
The contextual copy swap — where the sticky header CTA text changed from “Get Custom Pricing” when the visitor was near the pricing section to “See This Feature Live” near the feature section — was handled through a CSS class toggle driven by that same scroll listener. Each page section had a unique data attribute, and the JavaScript function matched the nearest visible section to a pre-mapped CTA copy string stored in a small JSON object. This kept the implementation clean and easy for Ramplo’s growth team to update without engineering involvement.
Google Optimize managed the variant assignment and tracked conversions through a goal connected to HubSpot’s form submission event. We used Hotjar’s event API to layer in heatmap data segmented by scroll depth, which allowed us to see not just whether visitors clicked the sticky CTA but where on the page they were when they made that decision. That behavioral layer was what gave us the confidence to combine tests 2, 6, 7, and 8 into the winning variant rather than guessing at which combination would perform.
One technical caution worth flagging: on mobile, the sticky header CTA created layout conflicts with Ramplo’s existing mobile navigation drawer on screen widths below 768 pixels. We resolved this by conditionally suppressing the sticky CTA on mobile and instead implementing a fixed-bottom bar CTA for mobile visitors — a separate test that produced a 28% mobile conversion lift and is worth covering in a dedicated post. Do not attempt to force a desktop sticky header CTA pattern onto mobile without rethinking the interaction model entirely.
The Design Principles Behind Every Test That Worked
Every test that produced a meaningful lift shared three design principles that we now treat as non-negotiable for any sticky header CTA work. The first is progressive commitment: the CTA should become more visually prominent as scroll depth increases, not less. This mirrors the psychological principle that commitment deepens when someone has already invested time reading your content. At Ramplo, the filled button state in test 7 worked because it felt like a natural escalation rather than an interruption — the header was gently increasing its ask in proportion to how much value it had already delivered on the page.
The second principle is specificity over urgency. None of our winning tests used urgency tactics like countdown timers or “limited spots available” language in the sticky header. Ramplo’s audience is operations and HR buyers who are professionally skeptical of sales pressure. What they responded to was relevance — a CTA that reflected what they were currently reading felt helpful rather than pushy. If you sell to a similar evaluative B2B audience, resist the temptation to add urgency language to your sticky CTA. Specificity converts better with this buyer profile.
The third principle is social proof proximity. Adding “Join 800+ HR teams” directly beneath the sticky CTA button in test 8 produced a 17% lift on its own, but we believe that number would have been lower if we had used a generic proof line like “Trusted by thousands of companies.” The proof needed to be as specific as the CTA copy. Ramplo’s audience is HR and operations teams, so naming HR teams in the proof line created an instant identity match. Match your social proof language to the exact persona who is reading the page, not to the broadest possible audience you could claim.
We also learned one important design principle through failure. Test 3, which triggered the CTA at 75% scroll depth, underperformed the 50% trigger by 8 percentage points. By the time visitors reached the 75% scroll depth on Ramplo’s page, they were in the testimonials and FAQ sections — a lower-decision-pressure zone where the primary need is reassurance, not action. If we had introduced a high-commitment CTA at that depth without adjusting the copy to match a reassurance-stage message, we would have created cognitive dissonance. The scroll depth trigger you choose must match the emotional state of the visitor at that position on the page, not just optimize for maximum visibility.
How to Apply These Tests to Your Own B2B SaaS Landing Page
Start with a Hotjar scroll map of your primary conversion page. If you see that a meaningful percentage of your visitors are reaching 40–60% scroll depth without converting, you have the same opportunity we found at Ramplo. The scroll map will also show you which sections are capturing the most attention at mid-page depth — those are the sections where your contextual CTA copy should be anchored. Do not guess at what your visitors are reading at the moment of highest intent; the data will tell you exactly where that is.
I’ve found that implementing LeadFlux AI for lead scoring has cut our qualification time in half by automatically prioritizing prospects based on engagement patterns and behavioral signals.
Run the tests sequentially in the same order we did — trigger timing first, copy second, visual behavior third, and combined variant fourth. Running them sequentially means each test result informs the next decision rather than leaving you with conflicting data from simultaneous tests. We recommend a minimum of 500 conversions per variant before calling a result, which at typical B2B SaaS conversion rates means you may need two to four weeks per test. Do not cut tests short to hit a deadline; a false positive early in the sequence will corrupt every downstream test that builds on it.
Finally, treat your sticky header CTA as a living element rather than a one-time optimization. Ramplo updates their contextual CTA copy every time they run a significant messaging refresh on the body of the page. The sticky header CTA that worked when the page featured “employee onboarding automation” as the primary hook will need to be revisited if the page is later repositioned around “new hire time-to-productivity.” The technical infrastructure you build for scroll-triggered CTA control is what makes those updates fast and testable without involving an engineering sprint.
The 41% lift we achieved at Ramplo was not the result of a single clever design idea. It was the compounded result of four individually validated improvements — scroll timing, contextual copy, visual escalation, and specific social proof — deployed together on a page that already had strong mid-funnel traffic. If your B2B SaaS landing page has the same mid-page drop-off problem we diagnosed, this test sequence gives you a proven, repeatable path to closing that conversion gap.