十年之约的新版网站快上线了。
这次改版，我是负责人，也是落地实施的人。需求我来拍，设计稿我来判，logo 我自己画。
这篇文章讲新版做成了什么样，以及每个地方为什么这么做。开工时我给自己定过一条规矩：每个决定都要有数据或者理由撑着，不能因为我觉得好看就去做。
一稿计划 | Last one
上篇 · 为什么要改
项目在自我感动
十年之约是一个独立博客的公益项目，博主承诺自己的博客十年不关站、持续更新，我们把他收进名录。最早一批博客在 2017 年签约，明年第一批 32 个博客就满十年了。到今年 8 月，在约的博客有 1913 个。
数字看着不错，但我越往细里看，越觉得这个项目在自我感动。周边是自己掏钱做的，推荐谁基本靠拍脑袋，别人坚持写了十年，我们能给的只有一句"再来一个十年"。
所以这次改版，我用商业项目的标准来要求这个公益项目：用数据说话，成本算得清，价值验得了，项目能养活自己。
一张表决定了先改什么
十年之约有个功能叫虫洞，点一下就随机把你送到一个成员的博客。它累计送达了 61.3 万次，这是十年之约最大的家底。
我把在约的博客按最近 90 天有没有更新分成两组，算了一下各自被送达的次数：
停更的博客，反而被送得更多。 这 1366 个停更的博客占了全部送达的 72.4%。访客点四次虫洞，差不多有三次落到一个几年没更新的博客上，看一眼就关掉了。
所以我先改虫洞，再谈页面好不好看。新的虫洞规则是：
- 只送半年内有更新的博客。
- 按更新情况给每个博客算权重，更新越勤，被抽到的机会越大，但最高和最低最多只差 3 倍。用 8 月的数据模拟 10 万次，半年内有更新的博客占总数的 38.6%，能拿到 58.8% 的曝光。差距看得出来，也不会让少数几个博客把流量全吃掉。
- 加入年数不算分，点击量和停留时间我们根本不收集。
- 整套规则公开写在网站上。
个人站长通常不会公开自己怎么分流量，公开以后就没法凭喜好推人了。十年之约愿意公开，别人就很难学。
题材先于年份
做每个需求之前，我会先问三个问题：谁会来，他想要什么？他要做判断，需要看到哪几条信息？几方的需求之间，谁是因，谁是果？
签约年份服务的是已经加入的成员，让他们有成就感；题材服务的是第一次来的访客，帮他找到想看的内容。访客能找到好内容，网站才有口碑，成员挂在这里才有面子，年份徽章才有分量。题材是因，年份是果，所以名录的第一层筛选是题材。
现在网站有九个题材：摄影、视觉、旅行、美食、影音、读书、生活、技术、财经。题材由博主申请时自己选，审核时核对，不靠关键词自动归类。技术我只给了一格，还放在最后。市面上的博客目录站大多偏技术，而摄影、旅行这类内容要靠自己去拍、去走，别人很难搬运。题材的顺序，也是在告诉大家十年之约想要什么样的博客。
中篇 · 新网站的设计
整体风格
新网站默认打开深色模式，整体是有电影感的现代风格。首页用一个照片球开场，虫洞是一扇光门，页面会随着滚动发生变化。
风格参考了好几个网站，每一层借一家：结构和滚动方式借一家，光门借一家，粒子借一家，配色思路借一家。没有哪一层整套照搬，老成员不会一眼认出这是在抄谁。
配色
配色由三部分组成：
- 底色是黑白灰。
- 九个题材各配一种颜色，每种颜色都取它最饱满的那一档。访客看到颜色，就知道这是哪一类博客，颜色本身就在传递信息。
- 品牌橙色做点缀，和九个题材色放在一起用。
橙色只做点缀，是因为橙色又亮又艳，白字压在上面对比度只有 2.94:1。我们试过大面积铺橙，整屏看着像电商大促。
配色还要满足一个特殊要求。十年之约在清明这类哀悼日会把整个网站变成灰色，所以任何信息都不能只靠颜色区分。题材靠图标和文字区分，名录里博客的几种状态（在更新、半年未更新、未接入订阅、暂时联系不上、已离约）靠方块的形状区分。已经离约的博客整张卡片变灰，不用红色。这些博主只是没有继续写下去，没有犯什么错。
一条交互原则
整个网站的交互都遵守一条原则：访客什么都不做的时候，也要一眼看到他做判断需要的信息。 动效只给已经看得见的东西加反馈，不能拿来藏东西。
我们曾经做过一个"满屏灯海"的概念，鼠标照到哪盏灯，哪个博客的名字才浮出来。画面很美，可访客要找的信息全被藏在了操作后面，手机上更是什么都看不到，这个方案就放弃了。
首屏
首屏是一个照片球，用 35 张成员博客的真实首页截图拼成。
用首页截图而不用头像，是因为头像靠不住。全库登记的邮箱里，QQ 邮箱占 48.6%，这部分能拿到真头像，其余大多显示成同一张灰色剪影。博客的首页最能说明这个博客长什么样、还有没有在写。
照片球右边有一条进度线，写着四句话：
都是真博客吗 / 守了几年约了 / 都在写什么呢 / 有多少实绩呢
访客往下滚，画面跟着变化，一句一句回答这四个问题：先让访客看到这些都是真博客的截图，再把截图平铺开，标上每个博客在约几年，然后按题材归成九堆，最后落下三组数字。这四句话就是一个陌生人第一次点进来时，心里最可能冒出来的四个疑问。
不想往下滚也没关系，首屏的文字、按钮和搜索框，一打开就能看、就能点。
首屏的主标题是：不为流量写的博客，值得被人好好读。 下面分别写给读者和博主：
写给读者：在这里点开的每一个博客，都约定了十年不关站
写给博主：真实访客随机逛到你这儿，不用求算法赏脸
旧的标语"一个人的寂寞，一群人的狂欢"情绪很浓，可访客读完还是不知道这是个什么网站，这次换掉了。另一句"都是真人在长期更新"也删了，1913 个在约博客里有 1177 个半年没更新，访客随手点开一个就可能发现这句话不成立。
虫洞
虫洞是一扇光门。黑色的画面里只有一扇发光的门，访客点"穿过虫洞"，镜头往门里走，抽中的博客从门里展开。
落地后，页面上有 12 秒倒计时和两个按钮。访客可以点"进入这个博客"，在新标签页打开它，也可以点"再来一个"留在原地继续抽；什么都不点，12 秒后会自动进入这个博客。旧虫洞只停 4 秒就整页跳走，访客还没看清是什么博客就被带走了。
博客下面写着为什么把访客送到这里：半年内有没有更新，最近 12 个月有几个月在写，在约第几年，属于什么题材。分发规则公开在规则页上，每次分发的理由也直接写在访客眼前。
送达次数现在要访客真的进入了博客才算，点按钮或者倒计时结束自动进入都算一次，同一个人 24 小时内去同一个博客只记一次。
手机端
手机上的手指既用来滑动，也用来点击。照片球占了大半个屏幕，如果截图可以点，用户想往下滑，一碰就会被带进某个博客。
所以手机和平板的首屏用的是透视环。同一批截图排成两三圈，左右滑动可以转，点截图没有反应，往下滑照样会展开、归类、落下数字。虫洞的两个按钮在手机上固定在屏幕底部，大拇指够得着。
下篇 · logo
选一个大家早就认识的颜色
新 logo 的颜色用了华与华的超级符号理论：不要自己去创造一个新符号，而是选一个大家早就认识的符号。
在博客圈，大家最熟悉的颜色是橙色。RSS 订阅图标是橙色的，谷歌早年的 Blogger 用的也几乎是同一个橙。写过博客、订阅过博客的人，看到这个颜色就会想到博客。
所以新 logo 用了 RSS 橙 #FF6600。这个颜色和博客的关系，不需要我再去教给任何人。
保留正负空间的 BF
旧 logo 是我 2019 年画的：一个粗笔画的 B，里面挖出一个细细的 F，代表 Forever Blog。
一开始我只想在旧图形上小修小补，做出来全是年代感，像在十年前的枯树上画绿叶子。后来我只保留了最核心的一样东西：正负空间的 BF，实心的 B 里面藏着一个镂空的 F。大家认出十年之约，靠的就是这个特征，其他的都可以重做。
我要的效果是：logo 变了，但别人看到还知道是我。
往前倾的图形
新 logo 整体往前倾，笔画更粗，F 的镂空更清楚，整个图形看起来像在往前跑。这个项目已经跑了快十年，现在还在往前跑。
中文"十年之约"四个字改成圆润的粗笔画，和图形用同一种笔触。英文 ForeverBlog 保留斜体，字距拉开一些。斜体本身就带着活力和动势，和前倾的图形方向一致。
我还做了一个弥散渐变的版本，橙色从中间往四周慢慢变淡，像一盏暖黄的灯。十年之约的成员大多写了很多年博客，他们不需要谁来鼓励，也不喜欢热闹。我希望这盏橙色的灯安安静静地一直亮着。
缩到 16 像素，F 依然看得清。
logo 是橙色的，网站却只把橙色当点缀。logo 的任务是让人认出来，网站不需要整个染成 logo 的颜色。
方法 · 四天上线靠的是什么
9 月 30 日我定了一个硬前提：三四天之内，把需求、设计、开发完整走一遍。项目最后按时上线了，靠的是一套和 AI 协作的方法。这里挑几条最管用的，讲思路，也讲具体怎么做。
一、分工：我判断，一个 AI 调度，另一个 AI 干活
我现在用的组合是：
- Claude 当中枢：拆需求、写交接文件、查数据、验收结果，不亲自下场干活。
- Codex 负责执行：改代码、批量处理数据、画插图。
- 豆包负责文案：首屏那句话和进度线的四句，都是豆包先写候选，我再挑。
这样分有一笔很实际的账。项目早期我让中枢自己带着一群助手干执行的活，几天烧掉两百多万 token，其中有一次五个助手全部在写入结果前挂掉，活干完了，一个字没留下。同样的活交给 Codex，成本低一个数量级。
分工之后还要定好三条边界：
- 什么时候来问我。 判断标准只有一句：做错了只是不好看、不好用，AI 自己定；做错了会把产品做歪、伤到用户，必须来问我。
- 什么时候中枢可以接手。 同一件事 Codex 连续两轮没做对，中枢才接过来自己做，并写清楚它卡在哪一步。接手是例外，不是常态。
- 不要同时开两个大任务。 我吃过一次亏，两个任务同时跑，把并发额度占满，其中两条线直接报错失败。
二、一条主线跑到底
很多人喜欢让 AI 开一堆助手并行干活，看着很快，其实有三笔隐藏成本：
- 每个新助手都要从零读一遍资料，上一轮的缓存用不上，全部重新计费。
- 主线和助手之间来回传的摘要，算的是输出 token，单价是输入的五到十倍。
- 摘要一定会丢东西，丢掉的地方就是后面返工的地方。前两笔是钱，这一笔丢了就补不回来。
所以我的规矩是：查问题可以分出去，改东西不分出去。 需要大范围翻代码、找问题，可以派助手去看，它们只交回结论和位置；动手修改，由掌握完整情况的那条主线自己来。
主线跑久了也会变笨。我实测下来，上下文超过五十万 token 左右，AI 就开始明显犯糊涂，这时候我会让它手动压缩上下文。压缩时必须带走五样东西：事情的前因后果和试过哪些方案、已经总结出来的原则、接下来要做的事、要避开的坑、我提过的所有要求。还有一条：不许留任何缩写和代号。压缩以后原来的上下文就没了，"按之前那样""上面那个方案"这种话，到时候谁也看不懂。
三、先写成文件，再动手
复杂的任务，AI 要先把规划写成一份文件，我看过再开始执行。
这份文件里写的是判断标准和约束：要什么，不要什么，做到什么程度算完成。它有两个用处：我能在计划阶段就拦住方向错误；长任务做到后半程，AI 每完成一个阶段就回头对照一次，确认自己没被眼前的细节带偏。
中枢把活交给 Codex 时，也是给文件，不给转述。交接说明里固定写四样东西：能动哪个目录、能改哪些文件、不能碰什么、怎么算验收通过。
交接说明的第一句话最关键。我对比过同一天派给 Codex 的几件活：开头写"逐条核对，不成立就写证据"的那件，它理解成了审查任务，自己拉了三个助手去审，最后交回一份报告，一个文件都没改；同一件事重新派一次，开头改成"这是修改任务，不是调研任务，交付物是改好的文件"，它就动手改了二十处。决定 AI 做不做事的，往往就是第一句话。
四、把我的判断方式做成技能包
我把自己判断需求、做设计、写文案的方法，整理成了 AI 能自动调用的技能包。做好一个技能包，有三个要点：
- 说明里写用户会说出口的症状。 不写"用于文案写作"，要写"申请页没人提交""文案太自嗨""邮件发出去没人理"。AI 听到类似的话，就会自动用上这个技能，命中率能高一个量级。
- 主文件只放主干。 细则拆成几个小文件，用到哪条再读哪条，不一次把几万字塞进上下文。
- 一个总入口，下面分派。 总入口先判断问题出在哪一环，再交给对应的子技能。
在十年之约上用得最多的有三套：
- 需求闸。 任何需求进开发之前，先过产品三问（谁会来、他做判断需要什么信息、谁是因谁是果），再过五道商业判断：成本谁来付；结论有没有数据支持；用户为它付出了什么，零门槛人人都有的东西不会有获得感；用户能不能真的感受到，只写在公告里的价值不算交付；别人都在做的，我们凭什么还要做。
- 设计取舍。 按"有用、可信、独特、表达、好看"排序。好看排最后，但排最后不等于可以没有。
- 说服路径。 写任何要让人行动的文字，按四步走：先让他觉得这和自己有关，再让他相信我们有能力，然后让他觉得这事跟他能成，最后才请他行动。
五、改之前，先查会牵连到哪里
AI 改代码最常见的问题，是改好了 A，弄坏了 B。所以动手之前，我要求它先列一张清单：这个功能有几个入口，谁在用它产出的数据，有没有第二份做同一件事的代码，哪些规则改完以后必须仍然成立。
十年之约上就碰到过一次。虫洞改成"只送还在更新的博客"之后，清单查出还有一个公开的随机接口，成员站上的"随机博客"小挂件就在用它，而这个接口没有加同样的过滤。我们自己的网站不再把访客送去停更的博客，挂件却还在送。同一件事有两处实现，只改对了一处。最后把判断逻辑收到一个地方，两边共用。
六、规矩交给机器，验收只看证据
靠人记住的规矩，迟早会被忘掉。所以凡是能检查的规矩，我都让它变成一个检查脚本：文档有没有登记、链接有没有断、测试有没有比上次变少、上线配置对不对，不通过就报错。
检查报错时，AI 不能用跳过检查的开关绕过去，要把报错当成线索：先找到真正出错的那一步，再判断是这次改出来的，还是以前就有的问题，修好以后重跑，看到通过才算解决。
验收也只看证据，不看 AI 说自己做完了，固定三步：
- 看实际改了哪些文件。什么都没改，直接退回。
- 跑测试，通过的数量不能比上次少。
- 抽几处改动看内容，重点查三种情况：以修 bug 为名删了原有功能；同一个功能留下了两份实现；只写了注释，没有真的实现。
七、每次纠错都留成一条原则
AI 犯了错，我纠正以后，记下来的不是"这次某个地方要怎么改"，而是一条下次还能用的原则。写法固定成：凡是什么情况，就怎么做，因为什么。 写之前先问一句：这个错下次还会以同样的样子出现吗？不会的，就只是一次性的事实，不值得写成规则。说不清"因为什么"的，也不写。
规则也不能越攒越多。铁律多到读不完，就等于没有铁律。
这些原则存在跨会话的记忆里，开新对话时自动生效。前面提到的"颜色和结构要一起改""logo 的颜色不等于网站的颜色"，都是这样留下来的。
文案也有一套这样攒出来的规矩，用来去掉 AI 腔：句子按正常语序写，主谓宾齐全，尽量用动词开头；不用倒装，不用"……那边有"这种存在句，不堆名词，不用"就好""即可"收尾；不用"开启""踏上"这类比喻动词，不用"陪伴""旅程"这类说不清指什么的词。写完念给一个不熟悉这件事的人听，他会反问"啥意思"的地方，就要改。
AI 能帮我省下大量时间，但方向、取舍和最后拍板，都在我自己手里。
写在最后
我希望十年之约是这样一个地方：你随手点开一个博客，它还在更新；你想知道它为什么会出现在你面前，规则就写在那里；你坚持写了十年，名字旁边会亮起一个角标，这个角标有分量，因为这里的每一个博客都是真的。
logo 变了，颜色变了，首屏的那句话也变了，但你一看就知道，这还是十年之约。
文中数据除特别说明外，均来自 2026 年 8 月的生产数据快照和项目内的测算记录。
