网站收录

蜘蛛拿到的初始 HTML:JS 渲染页面在收录上的常见坑

蜘蛛抓取页面时,第一轮通常只拿到服务器返回的初始 HTML,JS 渲染出来的内容要等后续处理。正文、内链、列表如果都靠 JS 生成,蜘蛛第一眼看到的可能只是空壳。本文说清抓取与渲染的区别、常见的踩坑写法、几种可选的处理思路,以及用源码、渲染对比和日志自查的顺序。

网站收录

蜘蛛拿到的初始 HTML:JS 渲染页面在收录上的常见坑

不少站点把内容放在前端渲染,用户看到的是完整页面,但搜索引擎蜘蛛第一次抓取时拿到的,可能只是一份空壳 HTML。理解这一点,比反复纠结「为什么还不收录」更有用。

抓取和渲染是两个阶段

搜索引擎处理一个 URL,大致会经过发现 URL、抓取 HTML、解析内容、渲染页面、判断是否值得进索引这几步。第一轮抓取通常只拿到服务器直接返回的 HTML,JavaScript 执行往往发生在后续,而且有额度和延迟。如果首屏文字、站内链接、图片地址都要等 JS 跑完才出现,蜘蛛在第一轮就可能认为这个页面没什么可读内容。

哪些写法容易掉进盲区

  • 正文由前端请求接口后拼进 DOM,初始 HTML 里只有「加载中」的占位符;
  • 站内链接写在点击事件里,不用 a 标签的 href 属性;
  • 列表页依赖滚动加载,首屏之外的内容不在初始 HTML 中;
  • 用单页应用路由,多个「页面」其实共享同一份极简 HTML。

这些写法对用户体验不一定有错,但会让蜘蛛第一眼看到的页面和你看到的不是同一个东西。

常见的三种处理思路

一种是服务端渲染或静态生成,让初始 HTML 就带正文和链接,改动成本取决于技术栈。一种是预渲染或动态渲染,对蜘蛛返回渲染好的版本,要注意与用户看到的版本保持一致,避免被判断为内容不一致。还有一种最省事:把关键正文、标题、主要内链直接写进初始 HTML,交互功能再用 JS 增强。三种方式没有高低,选团队能长期维护的那种。

自查可以按这个顺序

  1. 浏览器禁用 JavaScript,或看页面的「查看源代码」,确认首屏是否还有正文和链接;
  2. 用搜索平台提供的 URL 检查类工具,对比原始 HTML 与渲染后的结果;
  3. 翻访问日志,看蜘蛛抓取是否频繁停在只有框架的 URL 上;
  4. 抽查几个核心页面,核对渲染前后的标题、正文、内链是否一致。

几个容易误判的地方

渲染后能看到内容,不等于搜索引擎一定渲染了,更不等于一定收录。抓取成功、渲染成功、进入索引是三件事。

另外,动态渲染通常只对部分爬虫生效,长期依赖它需要持续维护识别规则;页面渲染慢也不等于不收录,但会拉长从抓取到被判断内容的时间。还有人把索引里的旧快照当成渲染问题,其实那更可能是抓取更新节奏的问题,两件事要分开排查。

把重点放在初始 HTML

对大多数做内容的站点,最稳的做法是让核心信息在初始 HTML 里就完整可读:标题、正文主体、主要导航和分页链接。JS 用来做增强,而不是承载唯一内容。这样做不会直接带来收录,但能减少蜘蛛读不懂页面的概率,让后续判断建立在真实内容上。真正需要长期盯的,是每次改版后首屏 HTML 有没有变得比上一版更空。