網站收錄

懒加载、折叠面板與 Tab:抓取端能看到的正文有多少

浏览器里内容完整、源代碼里却只有一句“加载中”,是收錄环节最常见的落差之一。本文拆解图片懒加载、折叠面板、Tab、無限滚動這几類内容在抓取與渲染中的不同表現,並给出一套從查看網頁源代碼到核對索引狀態的自查顺序,以及不需要大改架构的調整方向。

網站收錄

懒加载、折叠面板與 Tab:抓取端能看到的正文有多少

很多頁面的正文在浏览器里是完整的,但抓取端拿到的 HTML 里只有一句“加载中”。這類問题在收錄环节很常见:頁面既没有被屏蔽,也不是质量不够,而是關键内容一開始就不在初始 HTML 里。

先分清两件事:源碼和渲染结果

抓取到一段 HTML 之後,搜尋引擎通常會做一次渲染,把 JavaScript 执行完再取 DOM。理论上,渲染後的内容也能進入索引,但渲染排期有延迟、有资源上限,也更容易因為脚本报错或接口超时而失敗。所以一個實用的判断标准是:這段内容在“查看網頁源代碼”里能不能直接搜到。搜得到,問题不大;搜不到,就要做好它可能被漏掉的准备。

另外要区分抓取與收錄:抓取只是把 HTML 取回来,之後還要经過處理、去重、质量评估,才决定是否建立索引。渲染失敗會卡在靠前的环节,後面的步骤也就無從谈起。

三類常见的“伪隐藏”内容

图片與 iframe 的原生懒加载

图片上使用原生的懒加载属性,只影响浏览器什么时候去下载图片,地址依然寫在 HTML 中,图片本身仍能被發現。iframe 也是同样的道理。真正有問题的是把地址留空、等滚動到位置再用脚本赋值,這種做法會让图片和嵌入頁面的 URL 在抓取阶段完全消失。

Tab、折叠面板、彈窗里的正文

如果這些内容從一開始就寫在 HTML 中,只是用 CSS 控制顯示與否,抓取端通常能看到。但不少實現走的是“点击後再請求接口、把返回结果插進 DOM”的路径,那么不点击就等于不存在。

  • 产品參數放在“更多參數”折叠里,預設不請求;
  • FAQ 的答案在点击时才拉取;
  • 评论区、用戶問答走接口加载,且每條内容没有可点開的獨立 URL。

這几類内容往往包含長尾词和用戶真實提問,丢掉它們,頁面能匹配的查询就少了一大截。

無限滚動與“点击加载更多”

如果滚動只往同一個 URL 里追加卡片,後面的内容就没有自己的地址,也没有内鏈入口。更稳妥的替代做法是保留分頁 URL,用可抓取的連結串起来,滚動加载只作為体驗层的增强。

按這個顺序自查

  1. 用“查看網頁源代碼”,搜一段只在折叠或懒加载区域出現的關键句;
  2. 用抓取測試或渲染測試工具,看渲染後的 HTML 里這句是否出現;
  3. 如果渲染後才有,检查控制台是否报错、接口路径是否被 robots.txt 挡住;
  4. 再看這條 URL 有没有内鏈或 sitemap 入口,確認它能被發現;
  5. 最後核對索引狀態,確認頁面是否真的進了索引,而不是停在“已發現”。
渲染能让 JavaScript 生成的内容進入索引,但它不是把内容推迟到点击之後的理由。關键正文最好在初始 HTML 里就有。

調整方向

  • 折叠内容預設輸出在 DOM 中,用 CSS 控制可见性,而不是等点击再取;
  • 图片保留原生懒加载属性,但地址必须寫在 HTML 中,別用脚本後置;
  • 评论区、問答区至少把前若干條服務端輸出,或给每條内容獨立 URL;
  • 列表頁保留分頁連結,避免只靠無限滚動;
  • 把接口路径一並检查,確認没有在 robots.txt 里被誤屏蔽。

判断标准其實很简單:把 JavaScript 關掉,頁面還剩多少正文?剩下的那部分,才是收錄最稳的部分。