术业有专攻
我决定开始写这个网站是 4 月 12 号,那是周二脑子一热。一直想做个 app 或 agent,连个 toy 都停在"想"这一步,没有任何行动,大学舍友一语惊醒梦中人——
不是 toy 的项目,也是从 toy 开始的
这么一想还真是,以前笑别人写的网站,笑别人不是记账就是 todolist,无聊。现在隐隐约约感觉这公司在走下坡路,干不久。想了想,先写个博客网站吧,给别人一个看见自己的机会,给自己一个展示给别人看的机会。
怕拖延,同天我就立刻新建文件夹,面对一个空的文件夹,开始了。历时一周,也就是 4 月 19 号写完了,然后 4 月 20 号买了域名,等了几小时审核,最终在 4 月 21 号的半夜一点多,上线了我的网站。
在一周的时间里,编写这个个人博客 网站时,我就想着把我搭建这个博客的过程写点什么,因为光是写个网页我就遇到了蛮多的坑,上线后某个朋友(非互联网行业)看了后,甩了个 b 站链接,说十分钟可以搭建,为什么你要花一周?我想了想,首先我有设计语言,不是模板化的设计,二,别人依据框架立起来的,可能自由度没我高,三。。。 最终想想没回他,不如把这过程写下来,写个博客吧!

图 1:某朋友提出疑问。
从零开始,一周上线
gpt-5.3 的时候,人们排名前端审美,能力,gemini3 > opus4.6 >> codex ,对啊你没看错,是远大于,不过现在中转站原因,gemini3 风控强不稳定,opus4.6 贵的起飞,所以我最后选择 codex(加之工作用的顺)来开发我的网站,其实现在 5.4 已经出了蛮久了,年后到现在大抵都有两个月了,加之 skill 的增强,我觉得 codex 写个小网站,也不是不能打!选好模型,建立好文件夹后,打开 cursor 后,我直接打开开始编写,首先就是把 superpower 和 front-design 这两大 skill load 进这个项目文件夹,看着还是空白的 curosr 界面,我就开始想,我的网站长啥样?
彼时,harness engineer 很火爆,个人不是很想吃国内自媒体二次创作的垃圾文章,于是我去 Anthropic 官网和 OpenAI 官网去看他们的博客,Anthropic 的博客那个页面非常好看,简单,但是优雅。所以当我在想我的网站是什么风格时,我看到挂在浏览器还没看完的 Anthropic 的博客,就立马下决定,按照这个风格写一个。我把博客的网站发给了 gpt-5.4,他给到我的设计风格:克制,简约,以及一个很总结的词:编辑部风格。

图 2:Anthropic 博客页面。
superpower 编写前端非常爽,在设计时他会进行头脑风暴然后会起一个端口,上面展示设计的预览,然后让你选择是不是这样,由于编写过程时没咋截图,所以现在没素材,所以拿另一个项目给大家看看。superpower 会怎么给你设计

图 3:superpower 会起一个端口给你展示设计预览。
点开后可以看到设计的风格

图 4:网页打开时预览。
就这样他问你答,他锁死边界后,就会出一版计划,计划落盘后,他就会库库的依据计划去实现这个网页。 故事的开始总是一帆风顺,开始的大的框架我非常喜欢,基本上没大问题,网站的设计风格已经落好了,那后面的各个页面的功能,细节补充,应该不是难事。
细节是魔鬼
大的方向和骨架定好后,我便开始填充页面的细节,Articles页和 About 页就不用多说,是很简单的展示页,这点 codex 还好,没有出差错,因为需求是简约的风格,所以写出来算是一口气过的,但是 Notes 页和 photo 页则是很大问题。
理论上一个博客网站,应该就是一个看博客网页和自己一个大头照的网页就差不多,但我不记得我看的哪个大牛的网站,他有个“随想” ,就是记录自己日常会想到的一些小的观点,或者一些名句,说真的非常好!我也想记录一些奇奇妙妙的想法,于是有了 Notes 页,然后我个人的确是喜欢拍烂片的,必须得有个可以给大家看到我烂片的地方,于是有了 photos 页。
先是 Notes 页,我首先是受到网站godly的设计启发,建议你点开看看,这个无限桌布的创意非常的帅气,然后为了更符合我的网站风格,我想到了软木板,想着一大块软木板,然后便签上像钉子钉上去的。
如果硬要参考,其实感觉有点类似游戏《Alan WakeⅡ》的那个推理板。
但我说不出来,其实没问 AI 时我都不知道这个效果叫“无限桌布”。我只想说背景是一块可以移动的板子,便利贴在上面。

图 5:notes 的设计
但是 codex 这里就开始犯病了,开始疯狂撸卡片,永远是一块非常丑的木板贴在上面,真的非常的丑,可能是写死在了某块容器下面,然后这个容器又是整个网站的模板下面,所以怎么死活改,就是不肯跳出去。哪怕我截图画红框说跳出来,都没有任何作用。
这时候我怀疑是不是设计图历史会话给他框住了,他永远以开始那个为最先优先度?为了避免这个情况,我新开了个会话,然后借助网页的 gpt 去了解到无限桌布的情况下,重新讲述了我的要求。 为了避免容器卡死的情况,我说这页面是特殊页面,不和别的页面共用一块模板。跑出来后终于是铺满了屏幕,可是非常的丑。怎么说呢,那个色块一大坨铺上去,和我设想的软木板背景完全两个概念,gpt-5.4 弄不出那种软木纹理。折腾了七八轮对话我觉得不对了,我知道在软木板上死磕,gpt 肯定是做不出我想要的结果的,于是果断开启新对话,换一个风格,正好看到自己 obsidian 的方格纸片的背景,于是我重新设计,才有了现在的界面。
这时候我就有一个反思,ai 和人,但凡有一个钻牛角尖,另一方就必须跳出这次对话了,不然就是一直在,不能说错的方向,而是在对的方向上但是不可行的岔路上一直往下走。他让你觉得终点就在那(你想要的效果),但他就是做不出。然后我们百分百知道,AI 侧一定不会跳出,他只会一直局限在你给他的上下文,哪怕你说换个方向,他也是参考着你之前给的上下文,只是从一个岔路口换成另一个同样不可行的岔路口。

图 6:关于在用 AI 时,钻牛角尖的反思(AI 绘图)
这时候我还是相信着 codex 的,虽然 Notes 这块的确闹心,但是最后还是可以的,但是让我真正觉得,”codex 啊,你写前端就是区”,就是 photos 页。
photos 页我想要一个好看的瀑布流相册,结果 codex 给我的东西,怎么说,就是那种你一眼看过去,哦,AI 写的。没有灵气,布局死板,间距全是默认值。不是,在平时工作中事无巨细的 codex,怎么写前端这么犟呢?写的是真的丑,我开始怀疑,不是人的问题了。
这里,我觉得必要讲解一下,我们常说 LLM 写前端的能力,不是说代码能力,而是描述 LLM 设计前端的能力,前端的功能的实现,codex 等现在一系列主流大模型,都可以保证前端代码写出来不报错,我们应该比较的是同一个 prompt 下,不同的模型在同一个框架下跑出来的网页,在观感上谁更好看。
廉颇老矣,尚能饭否?我实在没辙,打开网页让 gemini(降智到阿巴阿巴版) 先写一版,gemini 三轮就给了个让我眼前一亮的效果。然后我把 gemini 的代码复制过来,开新窗口喂给 codex,明确跟他说就参考这个写,多轮调试下来,才勉强达到我想要的样子。

图 7:只是网页端, gemini短短三轮对话都能写出极好前端效果
这时候我要插播一个当时的小趣事,不知道是不是大数据发力了,b 站给我推送了一个视频,就是大批特批 codex 写前端是区的视频– 【为什么我不建议你用GPT-5.4写前端 | 果穗也能看懂的名片网页制作教程【EP5.GPT的前端真是一条区啊】-哔哩哔哩】 我觉得讲的很有意思,up 主开始也是使用 codex 搭配 gpt-5.4 编写前端,但是写的很糟糕,还以为是自己菜,他看了 GPT 发布的一篇博客,看着 GPT 大吹特吹,还以为是在初期使用 GPT 遇到上述困难时,一直以为是自己开发操作上的问题,没有怀疑到 AI 身上。直到UP观看了另一位博主(theo)的视频,才恍然大悟这其实是 GPT 自身的通病。 毛病是啥:我精炼一下 up 的理论
- 设计审美固化且糟糕:GPT 生成的前端页面总是千篇一律,它非常喜欢堆砌各种卡片,配上巨大无比的衬线体标题,并且还会往里面塞入各种无意义的说明文字。
- 完全不听从引导:无论开发者怎么纠正,GPT 都固执己见。即使在 skill 和提示词中进行了强调,或者按照官方给的最佳实践来操作,甚至给出了明确的图片作为参考,GPT 依然我行我素,毫无作用
我就说,哪怕是塞了前端设计的 skill,怎么写出来还这么臭!
术业有专攻
这时候我就有一个特别的想法,现在大厂都致力于做一个全能的 LLM,但事实为啥不能挑一个方向专攻呢?现在的我还能回想起 gemini3 刚出的时候,全网都在疯狂展示自己用 gemini3 写出来的网页,百花缭乱,目不暇接。真的是大白话语言,能给到你一个非常 surprise 的 web 界面。大模型的微调我不是很懂,但是微调就是让大模型变得更像你想要的样子,那每个厂家侧重一个方向不好吗?
特别的小彩蛋!原本形容 claude 的时候,我不知道写啥,用到后面觉得 claude 太贵了,我自己没咋用过,他强的确很强,那什么能像 gemini 对于前端,gpt 对于后端这种强的突出让人深刻的东西呢?所以原本 claude 我写的是“编不出来了”,后面用 claudecode优化这篇文章时,这个哥们自己给自己加戏!
术业有专攻,或许不会使得某个 AI 公司会进行垄断?或许每个大厂只需要更专注,某一个领域方向,往那边精调,给于更好的模型效果?

图 8:整个活,各个大厂互相推荐
你可能会说,傻的,原本只需要给一家付费,现在要给三家付费,不是蠢?或许是吧,可能资本家眼里是:本来都是我的钱,我还要和别人分?!
最后摇摇晃晃,网站算是落地部署完了,如果说有啥经验
对了,还有个血泪教训:AI 在跑代码的时候,尽量别开高实时性的游戏(类似 moba、fps)。一把打完,发现 AI 早就输出完在等你反馈了,白跑了十几秒。