A/B 落地页 — 开发者操作指南

给参与 /guide/getting-started A/B 实验的 4 位开发者(B/C/D/E)。 架构/原理见 ab-test-getting-started.md;本文只讲「你具体要做什么」。

0. 谁负责哪个文件

A 是 control = 现有页面,不动(canonical 目标)。4 位开发各做一版新页面 B/C/D/E,主题自定。

变体	谁	你要编辑的文件	URL
A	— (control,现状基线,无需改)	guide/getting-started.md	/guide/getting-started.html
B	开发者 1	guide/getting-started-b.md	/guide/getting-started-b.html
C	开发者 2	guide/getting-started-c.md	/guide/getting-started-c.html
D	开发者 3	guide/getting-started-d.md	/guide/getting-started-d.html
E	开发者 4	guide/getting-started-e.md	/guide/getting-started-e.html

你只动自己那一个文件。 四个文件互不相交,所以四个 PR 之间零冲突,谁先写完谁先合,顺序无所谓。

⚠️ 不要改这些共享文件(改了会影响全员):.vitepress/config.mts 的分桶脚本、.vitepress/theme/ab.ts、functions/api/ab-event/、wrangler.toml。

1. 起步(每人一次)

git clone https://github.com/piglet12138/claude-zh.cn.git
cd claude-zh.cn
npm ci

# 从最新 main 切自己的分支（命名按你的变体）
git checkout main && git pull
git checkout -b feat/landing-b      # B 用 -b，C 用 -c，D 用 -d，E 用 -e

前提:harness 分支(feat/ab-getting-started)必须已经合进 main。没合之前先别开工——你会缺少 stub 和埋点。

2. 写你的页面

打开你的 .md 文件(已有占位 stub),把内容换成你的设计。遵守 4 条约定,埋点才能正常工作:

1. canonical 不要删 — frontmatter 里这段保留原样,否则 SEO 权重会被稀释:

   head:
     - - link
       - rel: canonical
         href: https://claude-zh.cn/guide/getting-started.html

   (A 是 control,它的 canonical 指向自己,无需改。)

2. lucky 安装命令用普通代码块 — 这样转化会被自动识别,你什么都不用加:

   ```bash
   curl -fsSL https://bridge.annealing.cn/install.sh | sh
   ```

   埋点脚本按命令内容判断 lucky / 官方,作者无需配合。

3. 给 lucky 段落加标记 — 把你那段「安装 lucky」的容器包一层,用于统计「看到了 lucky 段」:

   <div data-ab-section="lucky">
   …你的 lucky 介绍 + 安装命令…
   </div>

4. 大 CTA 按钮(可选) — 如果你做了「点这里装 lucky」之类的按钮/链接,加一个属性,点击会被记为转化:

   <a href="#install-lucky" data-ab-cta="lucky_btn">用 Lucky，跳过这一页 →</a>

转化口径(你优化的目标)

主转化 = 访客复制/点击了 lucky 安装命令。所以你的页面设计目标:让用户自然倾向 lucky 并去复制那条命令。次要信号:滚动看到 lucky 段。

3. 本地预览

# 纯看页面长相（够用于排版/文案）
npm run docs:dev
# 打开 http://localhost:5173/guide/getting-started-b.html

# 想连埋点一起测（Function 只在 wrangler 下跑）
npm run docs:build
npx wrangler pages dev .vitepress/dist
# 浏览器 DevTools → Network 看 /api/ab-event/... 是否 204

强制看到自己的变体(分桶默认会把你导去 A):在 DevTools Console 跑

localStorage.setItem('czh_ab','b'); location.reload();   // b/c/d/e 自选

清掉重新分桶:localStorage.removeItem('czh_ab')。

4. 安装脚本(你那一版的脚本,Phase 2)

「整体体验包」= 页面 + 你自己的安装脚本端到端。脚本改动在脚本仓(claude-code/bridge),不在本仓:

• 你的脚本在上报安装事件时,带上自己的变体标记 ab_variant(你是 b/c/d/e 之一)。
• 本仓的 install-event Function 会加 blob8 接住(由 harness 维护者统一加)。
• 这样你那一版的「页面 → 安装 → 充值」整条漏斗能单独算。

脚本逻辑可以是你自己的设计;但务必带上你的变体标记,否则下游归因不到你。

5. 提 PR

git add guide/getting-started-b.md
git commit -m "feat(landing-b): 双路径并列式落地页"
git push -u origin feat/landing-b
gh pr create --base main --title "feat(landing-b): 双路径并列式落地页" --body "实验变体 B。见 docs/ab-test-getting-started.md。"

• review 会自动请到 CODEOWNERS(@Osgood001)。
• 合进 main = 自动部署上线,但此时仍是 100% 流量走 A,你的页面"上线了但没人被导过去",是安全的预发布状态。
• 合并前自查:npm run docs:build 能过、canonical 在、lucky 段有 data-ab-section。

6. 开跑(全员就绪后,一个 PR)

四个变体都合进 main 后,由维护者发一个一行 PR:把 config.mts 里

var W={a:100,b:0,c:0,d:0,e:0};   // 改成 ↓
var W={a:20,b:20,c:20,d:20,e:20};

合并即实验正式开始。要暂停/回滚:改回 {a:100,b:0,c:0,d:0,e:0},新访客全回 A(已分桶的老用户保持,符合粘性)。

7. 看数据

实验期间用 /api/ab-stats(token 保护)看各变体曝光/转化/转化率/显著性。别中途偷看就停(peeking):跑够预估样本量再下结论。样本量/周期见设计文档第 6 节。

---

速查

我要…	怎么做
知道改哪个文件	见 §0 表
强制预览我的变体	localStorage.setItem('czh_ab','b')
让 lucky 命令被统计	普通 ```bash 代码块即可(自动识别)
统计「看到 lucky 段」	容器加 data-ab-section="lucky"
统计 CTA 点击	元素加 data-ab-cta="lucky_btn"
验证埋点真发出	wrangler pages dev + Network 看 /api/ab-event 204
千万别改	config 分桶脚本 / ab.ts / ab-event Function / wrangler binding