用 AI 出单页面的人大多经历过这样一轮：一句"帮我写个产品落地页"，拿到一份看起来还行的 HTML，传上线，过两天发现标题是 AI 编的、样式引了外部字体加载很慢、结构与隔壁站几乎一样。问题出在哪？提示词太短？模型不行？还是单页面源码本身不适合交给 AI？答案都不在这个方向。差别只有一个：你给它的规格说明书写得够不够细。
单页面源码（一个 HTML 文件承载一个完整页面）是落地页与站群场景里最常用的交付形态：单文件、依赖少、复制即部署。但对 AI 来说，这恰好是自由度最高的任务。图省事的时候，模型会用默认模板打发你：通稿式文案、渐变按钮、外链字体。约束给足，源码的质量在生成那一刻就已经定了。
一、规格先行：给 AI 的输入决定输出
写给 AI 的规格说明书，本质上是一张验收单。六项内容写全，返工量会下降一个量级：
| 规格项 | 怎么写 | 不写会怎样 |
|---|---|---|
| 页面目标与受众 | 一句话写清给谁看、解决什么问题 | 文案泛泛而谈，谁看都不像在说自己 |
| 标题与摘要 | 给出确切标题与描述文本，字数区间写死 | 标题由 AI 自由发挥，关键词放得莫名其妙 |
| 结构骨架 | 列出区块顺序与各层标题的级别 | 默认套用通用模板，层级混乱 |
| 内容要点 | 每节要出现的事实、数据、术语写清楚 | 只给主题词，AI 用空话把版面填满 |
| 技术约束 | 单文件、原生 HTML 与 CSS、不引外链资源 | 默认引入外部字体和脚本，加载变慢 |
| 交付要求 | 完整源码不省略、附部署与更新说明 | 输出被截断、关键段落省略，拼接费时 |
AI 不会被"写得好一点"打动，只会被可检查的约束框住。"风格简洁大气"这类描述等于没写；"正文 15 号字、行高 1.8、每个区块不超过 200 字"，才能变成它执行得下去的动作。规格说明书的每一行，都应该能被人工或工具在交付时逐条核对。
二、一份能用的单页面源码，骨架长什么样
搜索引擎和 AI 读页面，读的从来不是视觉效果，而是这份结构。这里是一份合格单页面的最小骨架，可以直接当验收参照：
骨架里有五个位置值得单独盯住。标题唯一：一个页面一个 title，覆盖什么写什么，不堆词；层级清晰：H1 只有一个，各节用 H2，不跳级、不为字号乱用标题标签；首屏说清三件事：这是什么、给谁、能得到什么；结构化数据：用标准格式帮机器理解内容，它影响的是"机器怎么懂"，是否出现富结果由平台决定；样式内联：单文件、样式写在一起，减少外部请求，加载速度天然占优。
速度可以量化着看。业界的经验目标是：主要内容加载在 2.5 秒以内，交互响应在 200 毫秒以内，布局抖动在 0.1 以内，服务器首字节响应在 0.8 秒以内。这些是方向性目标，优先改善最差的那一项。单页面源码的优势恰好在这里：没有框架依赖、没有外链资源，做得好就是最轻的一类页面。
三、提示词怎么写：四要素加一段模板
把规格翻译成提示词，最有用的框架是四要素：技术约束、页面结构、交互行为、视觉偏好。四块的写法和常见反面情形是这样的：
| 要素 | 写法要求 | 不写的后果 |
|---|---|---|
| 技术约束 | 写明原生 HTML 与 CSS、单文件、不引外部资源 | 返回一个引着三套外部资源的版本 |
| 页面结构 | 按顺序列出区块与标题层级、每块要点 | 套用默认模板，区块顺序千篇一律 |
| 交互行为 | 写清锚点滚动、折叠展开、表单字段 | 交互动效靠猜，改起来比重写费劲 |
| 视觉偏好 | 给出配色范围、字号、留白的具体取向 | "好看一点"换回一份随机风格 |
可直接改用的提示词模板
目标：为【产品/服务】生成落地页，受众是【人群】。结构：H1 与导语、三个 H2 内容区块、一个折叠问答区、底部联系区。技术：原生 HTML 与 CSS，单文件，不引任何外部资源，移动优先。文案：每节不超过 200 字；事实与数字以我提供的为准，不得自行新增。输出：完整源码，不省略任何部分。
生成之后别一次改到底。骨架结构对，先确认区块顺序、标题层级和首屏内容，改到位；骨架定了再填细节，配色、间距、动效一次只动一个维度，每改一轮存一个版本。一次提十个修改点，AI 会把已经对的地方也改乱，回头找旧版本比重写还费时间。
四、源码到手后的检查清单
AI 交稿之后到部署之前，中间隔着一道检查。这道检查分成两半：能交给工具的部分，和只能靠人的部分。先看能自动化的：
- 结构校验：标签闭合、无嵌套错误，用校验工具过一遍；
- 标题与摘要：全站唯一，长度合适，和页面内容对得上；
- 标题层级：H1 唯一，H2 顺序合理，没有为字号乱用的标题标签；
- 图片：都有替代文本，尺寸标注完整，不引入站外图床；
- 结构化数据：能被解析工具识别，字段与内容一致；
- 依赖扫描：找出源码里的外链域名，确认没有遗留的外部字体与脚本；
- 速度测试：在移动网络条件下打开，看首屏出现时间与布局是否抖动。
另一半只能靠人：事实与数字是否真实（AI 会一本正经地编造资质、案例和统计口径，没有工具能替你判断）、客户信息是否准确、合规标识与免责声明是否到位、品牌口径是否一致。批量场景里，建议固定抽查比例：每十页至少人工过两页，出问题的批次整批回查。
检查清单打印出来贴进交付流程，比任何"让 AI 自查"的提示词都可靠。
五、批量部署：单页面变成站群页面
单页面真正的用武之地，是"同一规格、不同变量"的批量场景：把源码做成模板，标题、关键词、地区作为变量替换，一次生成一批页面，每个页面独立路径、独立内容。批量不等于复制。变量替换的是信息，段落结构要按主题重新组织；两个页面除了地名不同其余一模一样，在任何索引里都拿不到好位置。
静态托管
单文件直接传对象存储或静态托管，配置最少，适合快速验证页面效果。
建站系统上传
源码导入建站系统统一管理，模板复用、批量部署，适合成规模的站群。
变量批量生成
模板与数据表分离，脚本按行生成页面，城市、品类页面几分钟出一批。
部署完成并不是终点，页面上线后要接进收录流程：更新站点地图，让存量入口指向新页面；变更与新增走推送通道，把页面地址即时提交给搜索引擎，不等爬虫按自己的周期发现。这两步在批量场景里尤其关键。几十个新页面靠自然发现，等上几周是常态；推送之后再配一份看板，各站收录数量与抓取状态一目了然。
用 UC 建站系统这类站群工具，单页面的批量链路可以一条线走完：模板导入后按变量批量生成，每个站点独立部署、独立配置，避免批量痕迹；发布动作自动触发推送；各站收录与展现数据进同一个看板。AI 负责出初稿，事实核对与合规检查留在人这一侧。分工清楚，批量才可控。
六、常见坑：AI 源码的高发问题
交接过几十份 AI 源码之后，问题清单基本是固定的四类。外链依赖：字体、图标、图片从站外加载，上线后要么慢，要么外部服务一停页面就变形；结构雷同：同一套提示词产出的页面结构一模一样，多站之间留下明显的批量痕迹；虚构信息：AI 顺手编出资质、年限、客户数量和统计数字，这类错误对页面的伤害远超样式问题；合规缺失：AI 生成内容没有标识、页面没有免责说明，涉及数据与承诺的表述无人复核。
三类内容必须人工复核，不能抽查放过
- 事实与数字：资质、案例、统计口径，逐项对照原始资料
- 承诺性表述：效果、时限、保证类用词，一律删除或改写
- 合规要素：AI 生成标识、免责声明、联系方式的真实有效
修复要讲优先级：能打开是第一层，能被抓是第二层，能被读懂是第三层，好看排在末位。有人把大把时间花在调渐变色和圆角上，结果 title 重复、图片没有替代文本、手机上文字挤成一团。顺序反了，好看也只是给已经失效的页面化妆。
七、从源码到可交付页面
交付验收按四条过：打开正常，桌面和手机都要看，弱网不崩；内容可读，首屏有结论，每节第一句单独拎出来能成立；能被抓，站点地图与推送通道接到位，结构化数据能解析；能追踪，统计代码就位，访问与转化路径可查。四条都过，页面才算真的上线。
交付物别只给一个 HTML 文件。成套的做法是三件：源码包（含注释与变量说明）、部署说明（路径、依赖、验证步骤）、素材与更新清单（来源与责任人）。批量场景里，这三件东西决定了半年后还有没有人敢动这批页面。
AI 把单页面出稿从几天压到几分钟，省下来的时间该花在两个地方：写清规格，守住检查。规格决定生成时的下限，检查决定上线后的上限。这两件事做成固定动作，AI 出的单页面就是可以直接交付的页面。
（内容须真实、准确、可核对；AI 参与生成的内容按平台要求做相应标识；收录、抓取与展示结果取决于内容质量与平台机制，无法由任何工具承诺。）
