用AI改网站,别给它形容词,给它工具

方法论 · 豹叔AI出海笔记

很多人让 AI 做网站、改页面，拿到的成品都一个味儿：紫蓝渐变、圆角卡片、居中大标题，配上"赋能""极致"之类的词。一眼假，一眼廉价。

问题真不在 AI。问题在你给它的东西：只有形容词，没有参考，没有标准，更没有验收。

这段时间我集中升级了一批网站，流程跑顺了，成品拿出去没人猜是 AI 做的。今天把方法摊开讲，全是工具层面的事，学会了你也能用。

第一步：先找参考，别让它凭空画

AI 没有品味锚点。你跟它说"高级一点""大气一点"，它只能理解成把它见过最多的那套模板再堆一遍。形容词对它来说，等于没说。

我的做法是动手之前先去一个叫 Refero 的网站（refero.design）。它是一个真实产品页面的版式参考库，收的都是市面上做得好的产品页面：人家的首屏怎么排、定价区怎么摆、产品目录怎么做、联系表单怎么收尾，一页一页都能拆开看。

用法像装修先看样板间：

· 首屏挑一个最对味的，定下第一眼的感觉

· 内容区挑一个，定下讲故事的节奏

· 价格区挑一个，定下让人比较和下单的结构

· 表单区挑一个，定下最后一步怎么收口

四个部件拼起来，就是你自己页面的骨架。先有样板，再谈施工。给 AI 参考图和版式，等于直接把它的品味下限抬到了那些好产品的水平。

第二步：把"好设计"翻译成一份审查清单

有了参考还不够。AI 照着样板做，做到七八分像就交卷了，剩下的两三分，全是细节上的油腻：字太挤、灰太浅、阴影乱飞、什么都想强调等于什么都没强调。

所以我给它配了一把尺子：一个叫 apple-design 的审查工具，把苹果公司的人机界面设计规范（整整 123 页）整理成了 AI 能逐条执行的检查标准。苹果的东西为什么看着舒服？不是玄学，是规范：层级靠字号和字重拉开，不靠花里胡哨的装饰；留白是设计的一部分，不是没填满；文字和背景的对比度有硬性下限；动效要克制，服务于理解，不抢戏。

流程变成这样：AI 每做完一版，先自己拿这把尺子量一遍，不达标的自己返工，量过了才交给我看。

把"好看"这种感觉，翻译成一条条能打勾的标准。

要点就在这儿。标准能打勾，AI 就能自查；标准只是愿望，它就只能猜你想要什么。

第三步：验收用机器，不用感觉

交卷之后还有最后一关，我称之为"不许用眼睛验收"。

凡是能机器验的，全部上工具：

· 无障碍扫描（axe-core）：自动检查文字对比度够不够、图片有没有说明、表单有没有标签、键盘能不能操作。海外市场对这一块有合规要求，不达标不只是难看的问题。我的过关线是违规数等于 0 才算交卷

· 对比度逐组算数值：每组文字和背景的配色算出确切比值，对着标准线比，不看"差不多清楚"

· 不该变的东西逐字比对：改版前后，把标题、链接这些不能动的内容拉出来逐字 diff，一个字符不一致就打回

· 上线后逐个版本打开验：同一个网站，带 www 的、不带 www 的、http 的、https 的，是四种打开方式，一个一个点开确认，少验一个都可能藏着问题

为什么要这么较真？因为"差不多"是 AI 最爱用的交差方式，而工具不接受差不多，只有过和不过。

最后，四条心得

1. 给参考，不给形容词。你想让它做成什么样，先找到长那样子的东西给它看。

2. 给清单，不给愿望。"做得高级"不是标准，"对比度达标、层级靠字重、留白到位"才是。

3. 验收要可量化。违规数是不是 0、内容是不是逐字一致、版本是不是逐个打开过，全是可以数出来的事。

4. AI 的自检报告，也要抽查。它说量过了，你随机抽几处自己验。抽查在，它才不敢糊弄；这一条对人对 AI 都成立。

工具本身都不贵，有的甚至免费。值钱的是这个顺序：先参考，再标准，后验收。

AI 不缺一双手，缺的是这三样东西。你给齐了，它交的活就不再是"AI 味"，而是正经活。

豹

豹叔AI出海笔记

记录一个出海老兵和他的 AI 合伙人 COCO 的日常实验：AI 到底能不能替外贸老板，把活真的干了。

关注豹叔AI出海笔记

每篇都是一次真实复盘：用了什么方法、配了什么工具、踩了什么坑。

下篇见。