站点运营

站点运营:前端渲染方式自查,别让蜘蛛只看到一个空壳 HTML

前端渲染方式决定了蜘蛛能否在原始 HTML 中看到正文和内链。本文梳理 CSR、SSR、SSG 与混合渲染的差异,给出一份可执行的自查清单,并说明如何对比蜘蛛抓到的内容与浏览器渲染结果,避免页面在日志里正常、实际却是空壳。

站点运营

站点运营:前端渲染方式自查,别让蜘蛛只看到一个空壳 HTML

很多站长在浏览器里看页面一切正常,标题、正文、链接都在,但搜索引擎蜘蛛拿到的 HTML 里可能只有一行加载脚本,剩下全是空的。页面能不能被抓到内容,很大程度上取决于前端用什么方式把内容渲染出来。这个环节不需要复杂工具就能自查,但拖久了会让整站的收录表现越来越钝。

为什么渲染方式会影响抓取

蜘蛛抓取页面时,第一步拿到的是服务器返回的原始 HTML。如果正文、链接是通过 JavaScript 在浏览器端拼接出来的,蜘蛛就必须额外执行脚本才能看到内容。虽然主流搜索引擎都具备渲染能力,但渲染是有成本的:它要排进队列,占用额外的抓取预算,还可能因为脚本报错、接口超时、登录态缺失而只渲染出空白页面。

结果就是:用户看到的和蜘蛛看到的是两个版本。更麻烦的是,这种差异通常不会报错,日志里页面还是 200 状态码,看不出问题。

常见渲染方案与各自的注意点

纯客户端渲染(CSR)

HTML 骨架加一段 JS,内容靠接口返回后动态插入。这类页面在日志里很常见,但蜘蛛首次抓取时基本只能看到空容器。如果整站栏目页、详情页都是这种方式,抓取效率会明显下降。建议至少让标题、正文、主要内链出现在原始 HTML 中。

服务端渲染(SSR)

HTML 由服务端拼好后返回,蜘蛛拿到即完整。要注意的是缓存策略:如果 SSR 结果被缓存过久,蜘蛛可能抓到改动前的版本。另外要确认渲染失败时有降级方案,而不是返回空白页。

静态生成(SSG)

构建期生成 HTML,对蜘蛛最友好,加载也快。代价是内容更新需要重新构建。适合更新频率不高的栏目,比如关于、帮助文档、专题页。更新频繁的列表页要谨慎,别让蜘蛛抓到一份很久没重新生成的页面。

混合与增量渲染

首屏服务端渲染、次要模块客户端补充,是目前比较常见的折中。自查时要分清哪些内容必须第一次就出现在 HTML 里,哪些可以后续加载。核心正文、标题、主要导航、面包屑建议放在首屏 HTML,推荐位、评论、相关阅读可以晚一点。

自查清单

  • 用“查看网页源代码”而不是开发者工具,确认标题、正文、内链是否出现在原始 HTML 中。
  • 关闭 JavaScript 后再打开页面,看是否还剩可读的内容。
  • 用抓取工具或 curl 请求一次,和浏览器渲染后的结果做对比。
  • 检查主要栏目页、详情页、分页是否属于同一渲染方式,避免部分页面漏掉。
  • 确认接口超时或报错时,页面是否还返回有意义的内容和状态码。
  • 检查渲染依赖的接口是否被 robots.txt 或鉴权拦截,导致蜘蛛拿不到数据。

验证与排查顺序

  1. 先选一个流量最大、收录最差的栏目页做样本。
  2. 抓取原始 HTML,记录标题、正文词数、内链数量。
  3. 与浏览器渲染后的页面做对照,列出差异项。
  4. 查看服务器日志,确认蜘蛛抓的是完整页还是空壳。
  5. 定位到具体是模板问题、接口问题还是缓存问题。
  6. 改完后重新抓取同一 URL,对比差异是否消失。
不要一次性把整站渲染方式全换掉。先在一个栏目验证,确认蜘蛛拿到的 HTML 稳定包含正文和内链,再逐步推广。

几个容易被忽略的细节

一是分页和筛选页面。这类页面往往由参数驱动,客户端渲染时更容易出现“同一套骨架、内容全靠接口”的情况,蜘蛛容易在空列表里反复抓取。二是懒加载图片和内容。懒加载本身没问题,但如果首屏内容也依赖滚动或点击才加载,蜘蛛可能永远触发不到。三是接口返回的错误页。当接口返回 404 或空数组时,前端如果直接渲染成“无数据”的正常页面,就形成了软 404。

把这些点补齐,蜘蛛能稳定看到的页面内容越多,后续的收录判断才有可靠的基础。渲染方式不是一次性配置,模板改动、框架升级、接口调整之后都需要重新抽查一遍。