A2 转化型落地页与视觉设计 · 课程体系

【讲义正文】

先泼一盆冷水：你花三万块做的品牌站首屏，大概率是在向访客汇报你的公司历史。 访客不关心你 2016 年在哪里注册、工厂有几条产线——他在三秒内只判断一件事：你能不能解决我这个麻烦，以及我信不信你。三秒没答上来，他就走了，而且永远不会回来告诉你为什么走。这就是为什么很多站流量买得挺猛、转化却像漏水的水龙头。

我是你的教练。今天这 90 分钟，我不跟你谈"品牌调性"这种虚的，我只给你一套能照抄、能自检、能 A/B 的首屏工程方法。

你先记住一条总纲：首屏负责成交，下面所有屏负责说服。 上面三秒没抓住，下面写得再漂亮都是给空气看。

一、首屏价值主张：above the fold 里只许装一件事

above the fold（首屏）指不滚动就能看到的区域。桌面端和移动端的可见高度差很大，所以首屏不是"页面顶部 600px"，而是"你的目标机型不滚动时看得见的那块地方"——具体视口参数以各机型官方规格为准，别拿一个数字套所有设备。

价值主张的写法，给你一个能直接填空的公式：

> 主标题（≤18 字）= 目标人群 + 核心结果 > 副标题（≤30 字）= 凭什么做到 / 多久见效 / 风险谁担 > 主视觉 = 一张能直接展示"结果"的图（不是工厂、不是团队合照、不是抽象光效）

举例对比一下，你就懂差距：

❌「专注户外装备研发制造二十年，品质值得信赖」
✅「露营一夜不断电｜便携电源 30 天无理由退换，顺丰发货」

第二句里有结果（不断电）、有保障（30 天退换）、有交付（顺丰）——三秒读完，交易条件清楚了。

可照做的操作步骤（15 分钟改完一版首屏）：

拉 20 条真实用户评价/客服聊天，圈出出现次数最多的那一个"结果词"（不是功能词，是结果词）。
用公式写 3 个主标题版本，念给一个不懂你业务的人听，让他复述——复述不出来就重写。
把公司介绍整段从首屏删掉，挪到页尾"关于我们"，首屏只留一句话的资质背书。
选一张能证明结果的主图：产品在使用场景里，占画面 ≥50%，人脸或手部出现优先。
移动端预览一遍，再定稿。

图片/视频策略就三条硬标准：能用场景图就不用白底图；能证明结果就不拍氛围；主视觉与广告素材必须同源——你的 TikTok 广告里那个人、那个色调、那句话，点进落地页后必须还在，否则用户会怀疑自己点错了链接，跳出率立刻教你做人。

二、信任元件：评价、保障、媒体，三件一起上

首屏把话说清楚之后，第二件事是让陌生人信你。信任元件分四类，位置比内容更重要：

评价：带星级 + 条数 + 最近时间（例如"4.8 分 · 来自 1,327 条评价 · 更新至本月"）。数字必须真实可核，编造评分属虚假宣传，平台与监管口径以官方最新文档为准。
保障：退换期限、物流时效、支付方式。写成一句话塞进 CTA 上方，例如"30 天无理由退换 · 顺丰包邮 · 支持 Visa / PayPal"。
媒体与背书：媒体报道 logo 墙、认证标识。未经授权的媒体 logo 一律不得使用，这是合规红线，不是排版问题。
社会证明数字：累计用户数、复购率、销量。同样要求可追溯，宁可少写也别编。

一致性原则：整页只用一套字号阶梯、一个主色、一种按钮样式；信任元件在所有屏重复出现的样式保持一致。视觉不一致 = 廉价感 = 信任打折，用户在潜意识里就会把"页面粗糙"翻译成"货可能也不行"。

三、单一清晰 CTA 与移动端优先

3.1 单一清晰 CTA。 一个屏只允许一个主行动。主按钮实心高对比，次级动作降级成描边按钮或文字链接，绝不并排放两个一样大的按钮——那不是给用户选择，那是让用户纠结，纠结的结果通常是不点。

按钮文案用"动词 + 收益"：「立即领取 30 天试用」，不用「提交」「点击这里」。
首屏底部放一次，之后每滚动约 1.5 屏重复一次；表单字段能省就省，移动端每多一个必填项都在掉人。
按钮旁的微文案承担兜底：「30 秒完成，无需信用卡」。

3.2 移动端优先。 现在就接受现实：多数独立站流量大头在手机。所以设计顺序必须是手机 → 桌面，反过来做的人，最后都在给桌面版打补丁。

首屏在小屏上必须完整显示主标题 + 主视觉 + CTA，不被截断。
所有按钮点击区域足够大，上下相邻元素留出间距，防止误触。
图片按屏宽自适应裁切，禁止桌面大图直接压到手机上（加载慢 + 错位 + 文字被裁）。
首屏加载速度用公开工具自测（如 Google PageSpeed Insights），具体指标口径以官方最新文档为准；图片先压后传，视频默认静音自动播放且提供暂停。

真实案例：把"关于我们"换成一句信任句，+17%

某家居类 DTC 站，原首屏是标准"关于我们"写法：公司成立于某年、自有工厂、品质为本。改版只动了三处——把主标题换成结果句、把"关于我们"整段挪到页尾、在首屏 CTA 上方加一句信任句「30 天无理由退换 + 顺丰发货」。其余模块、价格、流量来源全部未动。A/B 跑完一个完整周期后，转化率相对提升 17%。

请注意这 17% 是怎么来的：不是换设计师、不是重做品牌、不是加预算，而是把首屏从"介绍自己"改成"给出交易条件"。这就是今天这堂课最值钱的一句话——首屏的每一行字，都要么在降低疑虑，要么在推动点击，否则一律删掉。

四、避坑红线

❌ 首屏放公司介绍不放卖点 → 你不是在做官网，你是在写简历，客户没兴趣面试你。
❌ 多个 CTA 互相打架（"立即购买"旁边站着"预约咨询"还站着"下载手册"）→ 三个按钮等于一个按钮，用户选择困难，转化原地躺平。
❌ 只做桌面版草草适配手机 → 移动端错位、图片裁头、按钮被折叠，你投的广告费有一半在给 bug 交学费。
❌ 评价、媒体 logo、销量数字全靠想象 → 编造背书是虚假宣传，罚款和封店从不提前打招呼。
❌ 广告素材与落地页视觉两张皮 → 用户以为点错链接，3 秒内原路返回。

五、明天就能试的小动作

今晚睡前 5 分钟，打开你的店铺首页，用手机截一张首屏图，发给一个完全不懂你业务的朋友，只问一句："你能看出这个店卖什么、对我有什么好处吗？"他答不上来，明天第一件事就是把"关于我们"挪到页尾，按第一节的公式重写一句主标题，再在 CTA 上加一句「30 天退换 + 顺丰」。就这 5 分钟，你已经在做大多数人拖三个月都不做的那件事。

【课堂练习】

（选择） 关于落地页首屏，下列做法正确的是？

答案：B

（实操） 用本课第一节的价值主张公式，为指定产品写出 3 个主标题版本，并选 1 个配主视觉说明（画面里有什么、占比多少）。评判标准：① 主标题 ≤18 字且含"人群 + 结果"；② 副标题含可验证的保障或时效；③ 主视觉能直接证明结果而非展示工厂/团队；④ 三个版本之间差异明确，可直接进 A/B。

（诊断） 学员 A 的落地页：桌面端很漂亮，手机上主标题被截断、按钮被图片盖住一半，首屏写着"我们成立于 2015 年，拥有 8000 平米厂房"。请指出三处问题并给出修改方向。

答案要点

【岗位工作流包·六件套】

① 标准操作流程 SOP（落地页改版包）

取证据(20条真实评价/客服记录 → 圈出高频"结果词")
   → 写首屏(主标题=人群+结果｜副标题=保障/时效｜主视觉=结果场景图)
   → 删废话(公司介绍移出首屏→页尾)
   → 装信任(评价星级+条数+时间｜退换/物流/支付｜授权内的媒体logo)
   → 收 CTA(一屏一个主行动｜动词+收益｜微文案兜底)
   → 移动端校验(小屏首屏完整可见｜按钮可点｜图片自适应｜速度自测)
   → 定 A/B(一次只改一个变量｜记录样本与周期｜达标才全量)

② 检查清单 checklist

③ 可直接用的提示词（完整 Prompt 文本）

你是一名 DTC 独立站转化率优化顾问。基于我提供的产品信息与真实用户评价原文，请输出：
1. 三个首屏主标题（每个 ≤18 字，必须包含"目标人群 + 核心结果"）；
2. 每个主标题配一条副标题（≤30 字，必须是我已承诺过的保障/时效/售后，不得新增承诺）；
3. 一句 CTA 上方信任句模板（含退换期限 + 物流方式占位符）；
4. 主视觉拍摄建议（画面内容、产品占比、是否与广告素材同源）；
5. 一张 A/B 首屏对照表（列名：变量｜版本A｜版本B｜主观测指标｜样本量与周期｜判定规则）。
【硬性约束】禁止编造任何数据、评价、评分、媒体背书与平台规则；凡我未提供的信息，一律写成"[待填：以官方最新文档/后台实际数据为准]"；不得虚构转化率提升幅度；不得建议在首屏使用公司介绍。用中文回答，分点清晰，可直接粘贴进文档。

④ 计算表 / 决策树

首屏强度评分（四维加权）：价值主张清晰度(0-5)×40% + 信任元件完整度(0-5)×30% + CTA 单一性(0-5)×20% + 移动端体验(0-5)×10% = 综合分。判定：≥4.0 可上线；3.0–4.0 必改后再测；<3.0 重写首屏。
决策树：三秒路人大爷能复述"卖什么、对我有啥好处"？→ 否：重写主标题 → 是：CTA 是否唯一？→ 否：降级次级按钮 → 是：移动端首屏完整无错位？→ 否：按移动端优先重排 → 是：信任元件是否齐全且真实？→ 否：补评价/保障 → 是：进入 A/B（一次只改一个变量）。
A/B 首屏对照表口径：一次只改一个变量（标题 / 主视觉 / CTA 文案任选其一）；主观测指标为转化率；样本量与测试周期以所用 A/B 工具的官方说明为准（如 Shopify 官方帮助中心对应文档），未达判定规则前不得提前下结论。

⑤ 避坑清单

不把公司介绍、发展历程、厂房面积放进首屏。
不在同一屏放两个同规格主按钮。
不先做桌面版再"适配"手机，必须移动端优先。
不编造评价、销量、评分、媒体 logo。
不让广告素材与落地页视觉脱节。
不在未达判定规则前提前喊"A/B 赢了"。

⑥ 验收口径

首屏主标题可被陌生人在 3 秒内复述出卖点与好处。
信任元件齐全（评价 / 保障 / 媒体授权），且每一条都真实可核。
全页每屏只有一个主 CTA，文案为"动词 + 收益"。
移动端首屏截图完整、无错位、无遮挡，且通过 checklist 全部条目。

【验收标准】

学员结营应能做到：

独立用价值主张公式写出 3 个合格首屏主标题，并完成陌生人三秒复述测试。
完整搭出高转化落地页结构（首屏 → 信任 → 卖点 → 证据 → 重复 CTA → 常见问题 → 页尾保障）。
在移动端优先前提下完成一次首屏改版，截图证明无错位、无遮挡、无横向滚动。
产出一份 A/B 首屏对照表，做到一次只改一个变量、写明样本量与判定规则。
用四维加权评分表给自己的落地页打分，并说出 ≥3 条必须整改项及其依据。

*佛山海猫 iSeacat · 企业培训教研组*