ISSUE 65 · 新官网观察 第2期
字体、配色、域名、气质…
我扒了202个新官网的源码
找到了它们的"幕后工具"
Webflow · Framer · Lenis · 自建派
你和一个看起来"专业出品"的网站之间，差的往往不是能力，是"知不知道有这个东西"。
哈喽，我是大鹏，这里是第二灵感库。
第63期我扒了600个新官网，看的全是表面——字体、配色、域名、气质。
这期我干了一件更"往里"的事：扒源码。
我把最近收录的官网挑出220个，一个个把首页源码抓下来，看它们背后到底用了什么工具、什么技术。202个抓取成功，结果比我预想的有意思得多。
先看数据（202个新官网）：
202个新官网 · 首页源码扫描结果
● Webflow 45个（22.3%）—— 每5个新官网就有1个是它做的
● Framer 27个（13.4%）—— 设计师圈渗透最快
● Shopify 17个（8.4%）—— 电商类居多
● 平滑滚动库 Lenis 53个（26.2%）—— 比 Webflow 命中率还高
● 未检测到主流建站工具 113个（55.9%）—— 大概率是自己写的
前三个数字说明"用什么做"，最后一个数字说明"为什么它们动起来那么舒服"。
这期就4件事，每件事配一个我扒出来的代表站。看完你会知道，那些你收藏的官网到底是怎么做出来的。
PART 01
Webflow · 每5个新官网就有1个
设计师能直接上手、但不会被看出是模板的那一档
网址：webflow
命中率：45/202（22.3%）
第一个发现：新官网里最主流的"专业工具"是 Webflow。
它的官方定位是"面向现代企业的智能体网站平台"，首页主标题只有4个词：
"Build for what's next"
（为接下来要发生的事而建。）
听起来有点虚，但它的客户数字不虚：300,000+ 品牌在用 Webflow。客户故事里的数字也很具体：
● ABM：上线新站后带来 2亿美元的销售管道
● OrangeTheory：一年省下 600万美元
● DocuSign：流量同比增长 1170%
而且它最近这一版明显在往 AI 上走：可以直接连你自己的代码库、用智能体帮你建站、还能给不同团队成员定制工作空间。
我扒出来的代表站：Nothin'（noth.in）——就是第63期我推荐过的那个巴黎创意工作室。它的官网就是 Webflow 做的。
大鹏说：Webflow 值不值得学，我的判断标准很简单——它是"设计师能直接上手、但不会被看出是模板"的那一档。它最大的价值，是把"我要做一个能上线的网站"这件事，从需要找开发、走排期、来回改需求，变成你自己一个下午就能推上线。
对做设计的人来说，这是从"交稿"到"交付"的跨越：以前你交付的是一个设计稿，现在你能交付一个活的网站。这个差别，在接私活或者做个人项目的时候，是决定性的。
PART 02
Framer · 设计师的第二支笔
画布即网站，中间没有"交付给开发"这个环节
网址：framer.com
命中率：27/202（13.4%）
第二个是 Framer。它这几年在设计师圈子里的渗透速度，我觉得比 Webflow 还猛。
它现在的定位已经不只是"建站工具"了：
"Framer is the design agent for every step from idea to launch"
（Framer 是覆盖从想法到上线每一步的设计智能体。）
最值得注意的一句是：
"Agents that work alongside you, not instead of you"
（与你并肩工作的智能体，而不是取代你。）
这句话很关键——它的 AI 是长在画布上的：你让 AI 生成版式，改动是可见的、可编辑的、可控的，而不是"给你一张图你自己看着办"。而且它能从 Slack 改文案、从终端触发 CMS、从 GitHub PR 发布。
客户名单也很能说明它现在的段位：Miro、Perplexity、Zapier、Mixpanel 都在用 Framer。官方社区里有 20,970 个资源（模板、组件、插件）。
我扒出来的代表站：Tokens Studio（tokens.studio）——第63期我推荐的那个做设计系统的平台。它的官网是 Framer 做的。
大鹏说：如果要我用一句话说清 Webflow 和 Framer 的区别——Webflow 更像"给专业团队的项目工具"，Framer 更像"设计师的第二支笔"。前者是先搭结构、再填内容；后者是你直接在画布上做设计，做完它就是一个能上线的网站——中间没有"交付给开发"这个环节。
对个人站、作品集、产品官网这类"视觉和动效就是卖点"的项目，Framer 的效率优势非常明显。它的免费层也够你把一个完整网站做出来再决定要不要付费。
PART 03
Lenis · 一个5KB的库，成了"高级感"的统一手势
本期最意外的数字，也是最值得你现在就记住的一条
网址：lenis.darkroom
命中率：53/202（26.2%） ← 本期最意外
第三个是我这期最过这种体验：打开某些网站，页面滚动起来特别顺、特别"重"、特别有质感，你说不上哪里不一样，但就是觉得比普通网站高级？
答案很可能就是它：Lenis。它出现在 202个站里的 53个上——26.2%，比 Webflow 的命中率还高。
Lenis 是 darkroom.engineering 做的开源平滑滚动库。它的官网上有一段话，把这件事说得很透：
"Smooth scroll used to be a hard sell — hacky, heavy, inaccessible. Not anymore. Lenis settled the debate and quietly became the standard behind some of the web's most ambitious work."
（平滑滚动以前是个很难推销的东西——取巧、笨重、还破坏可访问性。现在不是了。Lenis 终结了这场争论，它已经悄悄成为那些最有野心的网页作品背后的标准。）
它解决的其实是一个很具体的体验问题：你稍微滚一下，整个页面的动效就跟着跳一下、卡一下。Lenis 做的是让 WebGL 和 DOM 严格同步，"一帧一帧一起动"。
最妙的是它的门槛低到离谱：
● 一行代码：new Lenis() 就完事了，不到5KB
● 不劫持滚动条：不用CSS变换、不牺牲可访问性
● 不想写代码？它官方有 Framer 插件，直接拖进去用
我扒出来的代表站：Signal-A Studio（signal-a.studio）、Monolog（bymonolog.com）、Farm Minerals（farmminerals.com）——这几个站的滚动体验，你点开就能感觉到那个"重量感"。
大鹏说：这条是我觉得这期最实用的。因为它是一个可以直接抄的"高级感开关"——你不需要会写代码，Framer 里有插件；哪怕只会一点前端，加一行也够了。
我一直觉得"高级感"这个词被说得很玄，其实拆开看，它就是一连串很小的体验细节叠加出来的：滚动顺不顺、动效跟不跟手、鼠标经过有没有反馈。Lenis 这类工具的价值，就是把过去只有大厂前端团队才能做的体验，变成了一个免费的开源库。这就是这几年最大的变化——差距不再是"能不能做"，而是"知不知道有这个东西"。
PART 04
超过一半的新官网，其实没用什么建站工具
顶级网站追求的，是"没有工具痕迹"
代表站：stripe.com
结果：113/202（55.9%）没检测到主流建站平台
最后一个发现有点反直觉：超过一半的站，我压根没检测到 Webflow、Framer、Squarespace 这些工具的痕迹。
再往下看技术栈就更清楚了：
自建站的技术栈（202个站）
● Next.js 42个（20.8%）—— 要靠开发者"写"出来的框架
● GSAP 34个（16.8%）—— 动效库
● WordPress 21个（10.4%）
● Nuxt 18个（8.9%）
也就是说，真正站在金字塔尖的那批网站，很大一部分是自己写代码搭的。
我扒到的自建站名单里有：Stripe（金融科技里的设计标杆）、Granola（第63期推荐过的AI会议笔记）、Huge.（老牌数字机构）——都是那种你一看就知道"这不是套模板做的"的网站。
大鹏说："自建"这个结果，我不是让你去学写代码。我想说的是它背后的逻辑：顶级网站追求的，是"没有工具痕迹"。它们不用模板、不用现成组件，每个交互都为自己的内容定制。而这一点，其实你也能做到——不管你用 Webflow 还是 Framer。
我见过太多设计师用这两个工具做出来的站，"工具味"很重：标准的三栏卡片、标准的按钮动效、标准的滚动淡入。问题不在工具，在于你直接用了它的默认值。那些做得好的站，无一例外都做了三件事：改掉默认字体、改掉默认间距、砍掉一半的模块。工具给你的是速度和门槛，不是审美——审美那一半，还是得你自己来。
LAST PART
4个发现，一个结论
收个尾。这期的4个发现摆在一起：
● Webflow（22.3%）：设计师能做、看不出模板的专业工具，代表站 Nothin'（noth.in）
● Framer（13.4%）：画布即网站，从设计到上线没有中间环节，代表站 Tokens Studio（tokens.studio）
● Lenis（26.2%）：一个不到5KB的免费开源库，成了"丝滑滚动"的统一手势，代表站 Signal-A Studio（signal-a.studio）
● 自建（55.9%）：金字塔尖的站在追求"没有工具痕迹"，代表站 Stripe（stripe.com）
它们的共同点是：你看到的每一个"高级感"，背后都有一个具体的、可查到的工具。
以前我们说"这个网站做得好"，只能感叹一句"人家有团队"。现在不一样了——工具的门槛已经被拆得差不多了：建站有 Webflow 和 Framer，滚动体验有 Lenis 这样免费开源的库，还能直接以插件形式拖进画布。
所以我这期最想说的其实是这句：你和一个看起来"专业出品"的网站之间，差的往往不是能力，是"知不知道有这个东西"。第63期我带你看了600个官网的"表面"，这期我带你看了它们的"里子"——表面靠审美，里子靠工具，而工具是可以今天就开始用的。
如果你想动手，我的建议是先别急着建站：
今天就能做的一件事：扒一个你最喜欢的官网
浏览器里按 Ctrl+U（Mac 是 Option+Command+U）打开网页源代码，然后搜几个关键词：webflow、framer、lenis、gsap。你会对"它是怎么做出来的"有一个完全不同的认识。就这一个动作，比收藏一百个网站有用。
关于这组数据，说清楚来源
本期数据为自建扫描：样本取自官网画廊素材库（Lapa Ninja）最近收录的220个新官网，202个抓取成功，扫描时间2026年9月。方法为抓取各站首页源码、按特征串识别建站平台与技术栈。一个站可能同时命中多项技术，所以百分比相加不等于100%；未检测到建站工具，不等于一定没有，只代表首页源码里没有留下特征痕迹。请把数字当趋势看，不要当行业报告用。
这期是"新官网观察"第2期，下期想看什么类型，评论区告诉我。
所有的"网址资源"我都整理好了一份文档。
#网页设计 #UI设计 #建站工具 #设计工具 #第二灵感库
觉得有用的话，点赞 + 在看 + 转发三连支持一下
ISSUE 65 · SEE YOU NEXT WEEK