ai for designersJuly 27, 20269 min read

你的设计网站在 AI 搜索中毫无可见度

我们用 AI 爬虫的方式抓取了 25 个设计工作室和作品集页面。可读文本中位数:397 个词。有一个页面用 147KB 只说了七个词。

By Boone
XLinkedIn
design site invisible to ai

简短的答案

对于现在负责回答你所在行业相关问题的机器来说,你的网站很可能看起来是空的。不是慢,不是排名差。是空的。

我们在 2026 年 7 月 27 日对 18 个设计工作室、作品集平台和建站工具域名下的 25 个页面做了抓取,每个页面一次普通的 HTTP GET 请求,不执行任何 JavaScript,使用 ClaudeBot 的用户代理。页面可读文本的中位数为 397 个词。有八个页面返回的词数不到 200。

这就是 AI 爬虫在寻找哪家做优质品牌设计时所看到的内容。这个行业的大多数玩家,提供的是一个漂亮的外壳,里面却没有任何可读的东西。

体素风格插画:一面挂着空画框的展示墙,没有任何可读的标签。
体素风格插画:一面挂着空画框的展示墙,没有任何可读的标签。

三分之二的搜索现在都在原地结束

SparkToro 图表显示 2026 年 Google 零点击搜索比例升破 68%。
SparkToro 图表显示 2026 年 Google 零点击搜索比例升破 68%。

在 sparktoro.com 查看数据

根据 SparkToro 于 2026 年 6 月对 Similarweb 点击流面板数据的分析,2026 年前四个月中,美国 Google 搜索有 68.01% 的比例最终没有产生一次点击。相比 2024 年的 60.45%,两年内上升了 7.5 个百分点。

这个趋势早于 AI 出现。SparkToro 早在 2019 年就首次测得这一比例为 49%。AI 所做的,是加速了一条本就在弯曲的曲线。

根据 SparkToro 引用的 Ahrefs 数据,AI Overviews 现在出现在超过 20% 的所有搜索中。而当它出现时,Ahrefs 发现排名第一的页面平均点击率会下降 58%。这个数字来自 Ryan Law 在 2025 年 12 月数据上的重新测算,涵盖 30 万个关键词,其中一半带有 AI Overview,一半是不带 AI Overview 的信息类搜索,使用的是 Search Console 的汇总数据。

值得注意的是变化方向。Ahrefs 在 2025 年 4 月版本的同一项研究中,给出的下降幅度是 34.5%。方法论系出同源,但数字糟糕得多。

读取你网站的机器无法运行你的网站

主流的 AI 爬虫都不执行 JavaScript。Vercel 与 MERJ 联合发布于 2024 年 12 月 17 日的网络层研究发现,以下爬虫全部只抓取原始 HTML,然后就此止步:

  • GPTBot
  • OAI-SearchBot
  • ChatGPT-User
  • ClaudeBot
  • Meta-ExternalAgent
  • Bytespider
  • PerplexityBot

它们确实会下载你的 JavaScript。只是从不运行它。同一项研究测得 JS 文件占 ChatGPT 请求的 11.50%,占 Claude 请求的 23.84%。

例外是 Google 和 Apple。Gemini 借助 Googlebot 的渲染基础设施,AppleBot 则通过基于浏览器的渲染器进行抓取。除此之外,其他所有爬虫拿到的都只是你服务器在初始响应中给出的内容。

这项研究是我们能核实到的最新的大规模第一方测量数据。据广泛报道,该结论在 2026 年依然成立,不少文章仍在转述其 5.69 亿次 GPTBot 抓取的数字,四舍五入为"5 亿"。但我们没有找到更新的一手研究。请将其视为目前最好的可用证据,而非最新消息。

Vercel 自己在这项研究中给出的建议直截了当:对关键内容做服务端渲染,把客户端渲染仅用于增强效果。

体素图示:服务器在 JavaScript 水合开始之前渲染可读文本。
体素图示:服务器在 JavaScript 水合开始之前渲染可读文本。

一个 AI 爬虫在设计网站上实际看到了什么

Webflow 首页以原始 HTML 渲染,显示密集的可读正文文本。
Webflow 首页以原始 HTML 渲染,显示密集的可读正文文本。

在 webflow.com 上查看实际效果

我们测量了 HTML 负载大小、可读词数、每个可读词消耗的 KB、alt 文本覆盖率以及是否存在结构化数据。Brainy 也在表中,因为不把自己算进去未免太怯懦了,而我们的成绩处于中游。

网站页面传输 KB可读词数每词 KBAlt 覆盖率
Webflow首页619.03,4660.18168 张图片中的 57 张
Pentagram首页1,019.43,2880.31183 张图片中的 134 张
IDEO首页198.81,8410.1135 张图片中的 2 张
Pentagram作品集347.11,1980.2942 张图片中的 6 张
Brainy首页137.85540.2527 张图片中的 27 张
Instrument首页3,355.63978.4510 张图片中的 0 张
Instrument作品集3,340.729111.482 张图片中的 0 张
Collins作品集134.51241.0852 张图片中的 0 张
Readymag首页147.7721.10不适用

在全部 25 个页面中:14 个可读词数不足 500,15 个完全没有结构化数据,10 个的图片 alt 文本覆盖率不到一半。Area 17 和 Made Thought 表现最干净,alt 覆盖率均为 100%。

Readymag 的首页是极端案例。它传输了 147.7 KB 的 HTML,却只呈现出七个可读词,相当于每个词约 21 KB。这不是在批评它的设计。这只是在描述一个不做渲染的爬虫实际收到了什么。

一行命令测试你自己的网站

对自己的网站跑同样的测试。一行命令,不需要安装任何工具:

curl -s -A "ClaudeBot/1.0" https://yoursite.com | sed 's/<[^>]*>//g' | tr -s '[:space:]' ' ' | wc -w

如果返回的数字不到 300,那么搜索的 AI 层基本上对你一无所知。

作品集页面是你最空的那个页面

Instrument 的作品集页面展示以图片为主导的案例研究,配文极少。
Instrument 的作品集页面展示以图片为主导的案例研究,配文极少。

在 instrument.com/work 上查看实际效果

这个规律在整个审计中都成立。首页承载的文本最多,而真正能证明能力的作品集或案例研究页面,承载的文本却最少。Instrument 的作品集页面返回了 291 个词,而它的首页是 397 个。Collins 的作品集页面只返回了 124 个词。

原因是结构性的,而非疏忽。作品集页面被建成了画廊。论证依托于图片、布局与排列节奏,文字只是被当成图片之间的说明文字。这种惯例在人类浏览的十年里效果极佳,而这正是我们在案例研究之死中论述过正在瓦解的东西。

一个被要求点名擅长编辑式品牌识别设计的工作室的模型,读的是文字。它不会看你的网格布局。如果你最好的项目呈现方式是十二张通栏大图配四十个词,你就没能进入候选名单。

解决办法不是为凑字数而写更多文案,而是把你已经具备的思考过程放进页面里:问题、限制条件、决策、结果。我们在案例研究模板中给出过这个结构,同样的思路也适用于你如何在反作品集指南中安排整个作品集的顺序。

Alt 文本不再只是无障碍待办事项

Pentagram 的作品集页面展示了数十张项目图片,alt 文本覆盖率很低。
Pentagram 的作品集页面展示了数十张项目图片,alt 文本覆盖率很低。

在 pentagram.com/work 上查看实际效果

25 个页面中有 10 个的图片 alt 文本覆盖率不到一半,而在以图片为主导的作品集页面上,这个比例更糟。Collins 上传了 52 张图片,alt 属性全部为空。Pentagram 的作品集页面有 42 张图片,只有 6 张带 alt;IDEO 的首页有 35 张图片,只有 2 张带 alt。

对一个无法渲染页面的爬虫来说,alt 文本不是锦上添花的小事。它是响应内容中对你图像内容的唯一描述,而在一个以画廊为主的作品集页面上,它可能占据了该网址上大部分的可读内容。

所以,你一直拖延着没做的无障碍工作,现在多了第二个、商业上的理由去完成它。同一项任务,双重回报。我们的无障碍检查清单讲的是如何把它做对,而不是在属性里堆砌关键词。

结构化数据是另外半个答案。25 个页面中有 15 个完全没有结构化数据。Organization、Person 和 CreativeWork 这三种 schema,是机器判断一个页面是工作室、是设计师本人,还是一个项目,而不是三团没有标签的文字块的方式。

四项修复,按照能撬动数字的顺序排列

有四项改动能撬动这个数字,顺序很重要:

  • 服务端渲染文本。如果你的技术栈在客户端进行内容水合,那么这些文字对除 Google 和 Apple 之外的一切都是不可见的。Webflow 预编译的输出相对安全;没有做 SSR 的自定义单页应用是最糟的情况。Framer 会输出 HTML,但依赖 React 水合,所以要实测而不是想当然。我们的营销站点技术栈解析讲了其中的取舍
  • 重写作品集页面。让每个项目的实际论证文字达到大约 400 个可读词以上。这是本次审计发现的最大缺口,也是最重要的那些页面
  • 到处补上 alt 文本,描述的是作品本身,而不是文件名。在一个画廊式页面上,这一项工作一个下午就能让你的可读文本翻倍
  • 添加 Organization、Person 和 CreativeWork 结构化数据。成本低,机械化,而我们测量的页面中有 60% 都跳过了这一步

按这个顺序做。把 800 个精心打磨的词写进一个爬虫永远到不了的组件里,毫无意义。

对于一家依赖询盘获客的小工作室来说,这不是可有可无的维护工作。这是"被写进某个答案里"和"根本不存在"之间的差别,我们在独立工作室生存指南中详细讨论了这一点。

体素场景:一大块臃肿的 HTML 压垮了寥寥几个可见的词。
体素场景:一大块臃肿的 HTML 压垮了寥寥几个可见的词。

常见问题

AI 爬虫会渲染 JavaScript 吗?

主流的不会。Vercel 与 MERJ 在 2024 年 12 月 17 日发布的研究发现,以下爬虫全部只抓取而不执行:

  • GPTBot
  • OAI-SearchBot
  • ChatGPT-User
  • ClaudeBot
  • Meta-ExternalAgent
  • Bytespider
  • PerplexityBot

Google 的 Gemini 通过 Googlebot 的基础设施进行渲染,AppleBot 则通过基于浏览器的爬虫渲染。

我如何检查自己的网站是否可见?

用一个带 AI 爬虫用户代理的 curl 命令抓取,去掉标签,统计词数。上面审计部分给出了这条单行命令。把结果与访客实际看到的内容做对比。

词数低是不是一定意味着做错了?

不一定。这项审计只测量初始 HTML 响应本身,不衡量网站是否有排名、是否能转化、设计是否优秀。一家主要靠转介绍获客的工作室,完全可以合理地不在乎搜索询盘。

这能替代常规 SEO 吗?

它是常规 SEO 之下的地基。标题、链接和页面速度依然重要。但如果页面主体内容是空的,这些都无济于事。生成式引擎优化,本质上大多只是确保你真正的实质内容出现在 HTML 里。

这背后到底关系到多少流量?

SparkToro 给出的数据是 2026 年初美国零点击比例为 68.01%。Ahrefs 测得当 AI Overview 出现时,排名第一结果的点击率下降 58%,比他们 2025 年 4 月测得的 34.5% 更糟。这两个数字都是各类查询的平均值,所以你自身受到的影响程度取决于你的查询有多"信息型"。

美观和不可读并不矛盾

Pentagram 首页将大胆的视觉设计与数千个可读词并列呈现。
Pentagram 首页将大胆的视觉设计与数千个可读词并列呈现。

在 pentagram.com 上查看实际效果

这里的一切都不是在主张把网站做丑。Pentagram 的首页返回了 3,288 个可读词,依然是那个我们熟悉的 Pentagram,Webflow 返回了 3,466 个。Area 17 和 Made Thought 在不牺牲任何视觉效果的前提下实现了 100% 的 alt 覆盖率。人们以为存在的那种取舍,大多数情况下并不存在,这与我们在网页设计原则一文中提出的观点是一致的。

事情的真相是,图片优先、文字极简、重度依赖 JavaScript 这套惯例,在人类浏览的十年里是正确的,却在受众悄然改变之后,不知不觉变成了一种负债。表中那些工作室并不是不擅长自己的本职工作。其中好几家是行业里最顶尖的。是这套惯例辜负了它们。

去跑一下那条 curl 命令吧。四秒钟就够了,它返回的数字才是诚实的那一个。

Want work that machines and humans can both read? Join Brainy Creators.

Get Started

More from Brainy Papers

Keep reading