Skip to content

Commit 24749ca

Browse files
committed
Homepage hero: cookieless tooltip + calculator trust copy
- Hero: underline no cookies with Advance Metrics tooltip; supporting links - Calculator: cited sources in hero, fix scenarios typo, link to #calculator-sources
1 parent b4dabf3 commit 24749ca

File tree

5 files changed

+105
-9
lines changed

5 files changed

+105
-9
lines changed

apps/docs/app/(home)/calculator/_components/calculator-section.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export function CalculatorSection() {
9595

9696
<InputField
9797
displayPercent
98-
hint="Share of visitors who leave before engaging because of the banner. Research often cites ~20–40% for consent friction."
98+
hint="Share who leave before engaging because of the banner. One large B2B sample found 68.9% closed or ignored the banner; we default to 30% so the model stays conservative."
9999
id="bounce"
100100
label="Banner Bounce Rate"
101101
max={0.45}
@@ -248,10 +248,10 @@ export function CalculatorSection() {
248248

249249
<div className="mt-4 text-center">
250250
<p className="text-muted-foreground text-xs text-pretty">
251-
Banner friction in the ~{formatPercent(BOUNCE_RANGE_LOW)}
252-
{formatPercent(BOUNCE_RANGE_HIGH)} range is commonly reported (e.g.
253-
consent vendors, enterprise analytics). Databuddy needs no
254-
cookies, so no banner.
251+
The yearly range uses {formatPercent(BOUNCE_RANGE_LOW)}
252+
{formatPercent(BOUNCE_RANGE_HIGH)} bounce — a conservative band vs.
253+
studies that find much higher non-engagement (see sources below).
254+
Databuddy needs no cookies, so no banner.
255255
</p>
256256
</div>
257257
</section>
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
export function CalculatorSources() {
2+
return (
3+
<div className="mx-auto w-full max-w-3xl rounded border border-border bg-card/40 px-4 py-5 text-center sm:px-6">
4+
<p className="text-pretty text-muted-foreground text-xs leading-relaxed sm:text-sm">
5+
<span className="text-foreground/80">Sources: </span>
6+
<a
7+
className="underline underline-offset-2 hover:text-foreground"
8+
href="https://www.advance-metrics.com/en/blog/cookie-behaviour-study/"
9+
rel="noopener noreferrer"
10+
target="_blank"
11+
>
12+
Analysis of 1.2M+ banner interactions (Advance Metrics)
13+
</a>
14+
<span aria-hidden="true">, </span>
15+
<a
16+
className="underline underline-offset-2 hover:text-foreground"
17+
href="https://www.modernisation.gouv.fr/publications/la-ditp-mesure-limpact-du-design-des-bannieres-cookies-sur-les-internautes"
18+
rel="noopener noreferrer"
19+
target="_blank"
20+
>
21+
CNIL/DITP banner design study (2023)
22+
</a>
23+
<span aria-hidden="true">, </span>
24+
<a
25+
className="underline underline-offset-2 hover:text-foreground"
26+
href="https://www.dlapiper.com/en-gb/insights/publications/2026/01/dla-piper-gdpr-fines-and-data-breach-survey-january-2026"
27+
rel="noopener noreferrer"
28+
target="_blank"
29+
>
30+
DLA Piper GDPR Survey 2026
31+
</a>
32+
.
33+
</p>
34+
</div>
35+
);
36+
}

apps/docs/app/(home)/calculator/_components/scenarios-section.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export function ScenariosSection() {
1818
</p>
1919
<h2 className="mb-3 font-bold text-2xl tracking-tight sm:text-3xl">
2020
The numbers across 5 real-world profiles
21-
</h2>page
21+
</h2>
2222
<p className="mx-auto max-w-2xl text-balance text-muted-foreground text-sm">
2323
Opportunity cost at realistic bounce and visitor-to-paid
2424
assumptions. Your mileage will vary.

apps/docs/app/(home)/calculator/page.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import type { Metadata } from "next";
22
import { Footer } from "@/components/footer";
33
import { SITE_URL } from "@/app/util/constants";
44
import { CalculatorSection } from "./_components/calculator-section";
5+
import { CalculatorSources } from "./_components/calculator-sources";
56
import { CtaSection } from "./_components/cta-section";
67
import { ScenariosSection } from "./_components/scenarios-section";
78

@@ -75,15 +76,18 @@ export default function CalculatorPage() {
7576
</h1>
7677
<p className="mx-auto max-w-2xl text-balance text-muted-foreground text-sm sm:text-base">
7778
Visitors who bounce on the consent screen never enter your
78-
funnel. This tool estimates opportunity cost from that lost
79-
traffic — not guaranteed revenue.
79+
funnel. Large-scale studies report high non-engagement with
80+
banners; we default to a conservative 30% and show a 20–40%
81+
band so you are not overstating the case. This tool estimates
82+
opportunity cost from lost traffic — not guaranteed revenue.
8083
</p>
8184
</header>
8285

8386
<div className="space-y-16 sm:space-y-24">
8487
<CalculatorSection />
8588
<ScenariosSection />
8689
<CtaSection />
90+
<CalculatorSources />
8791
</div>
8892

8993
<Footer />

apps/docs/components/landing/hero.tsx

Lines changed: 57 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,11 @@
33
import { ArrowsOutSimpleIcon } from "@phosphor-icons/react";
44
import Link from "next/link";
55
import { useEffect, useRef, useState } from "react";
6+
import {
7+
Tooltip,
8+
TooltipContent,
9+
TooltipTrigger,
10+
} from "@/components/ui/tooltip";
611
import { formatLocaleNumber } from "@/lib/format-locale-number";
712
import { cn } from "@/lib/utils";
813
import { SciFiButton } from "./scifi-btn";
@@ -90,7 +95,37 @@ export default function Hero({
9095
<h1 className="text-balance font-bold text-4xl leading-[1.1] tracking-tight sm:text-5xl md:text-6xl lg:text-7xl">
9196
Privacy-first analytics.{" "}
9297
<span className="text-muted-foreground">
93-
One script, no cookies, no consent banners.
98+
One script,{" "}
99+
<Tooltip>
100+
<TooltipTrigger asChild>
101+
<button
102+
className="cursor-help border-0 bg-transparent p-0 font-inherit text-inherit underline decoration-muted-foreground/70 decoration-dotted underline-offset-[0.15em] hover:decoration-foreground/60"
103+
type="button"
104+
>
105+
no cookies,
106+
</button>
107+
</TooltipTrigger>
108+
<TooltipContent
109+
className="max-w-72 text-pretty text-left text-xs leading-relaxed sm:max-w-sm"
110+
side="bottom"
111+
sideOffset={8}
112+
>
113+
<span className="block">
114+
Cookieless by design. No fingerprints, no consent banner.
115+
B2B research on 1.2M+ interactions found 68.9% of cookie
116+
banners closed or ignored.{" "}
117+
<a
118+
className="font-medium underline underline-offset-2 hover:text-primary-foreground/90"
119+
href="https://www.advance-metrics.com/en/blog/cookie-behaviour-study/"
120+
rel="noopener noreferrer"
121+
target="_blank"
122+
>
123+
Advance Metrics
124+
</a>
125+
</span>
126+
</TooltipContent>
127+
</Tooltip>
128+
no consent banners.
94129
</span>
95130
</h1>
96131

@@ -100,12 +135,33 @@ export default function Hero({
100135
<Link
101136
className="text-foreground"
102137
href="https://github.com/databuddy-analytics/databuddy"
138+
rel="noopener noreferrer"
139+
target="_blank"
103140
>
104141
Open source
105142
</Link>
106143
.
107144
</p>
108145

146+
<p className="max-w-2xl text-pretty text-muted-foreground text-xs leading-relaxed sm:text-sm">
147+
<a
148+
className="underline underline-offset-2 hover:text-foreground"
149+
href="https://www.advance-metrics.com/en/blog/cookie-behaviour-study/"
150+
rel="noopener noreferrer"
151+
target="_blank"
152+
>
153+
Advance Metrics
154+
</a>{" "}
155+
on real-world banner behavior.{" "}
156+
<Link
157+
className="underline underline-offset-2 hover:text-foreground"
158+
href="/calculator"
159+
>
160+
Model the opportunity cost
161+
</Link>{" "}
162+
for your traffic.
163+
</p>
164+
109165
<div className="flex items-center gap-3">
110166
<SciFiButton asChild className="px-6 py-5 text-base sm:px-8">
111167
<a href="https://app.databuddy.cc/login">Start free</a>

0 commit comments

Comments
 (0)