在實際上線時,AI 爬蟲不渲染 JavaScript 的行為,已導致不少 CSR 頁面的關鍵內容被完全跳過。根據 Vercel 與 MERJ 的分析,GPTBot 等主流 AI 爬蟲不會執行 JS,僅讀取伺服器回傳的原始 HTML。這導致 CSR 網站的動態內容(如地址、招牌、問答對)在 AI 抓取時完全消失,只能依賴 <title> 标籤中極有限的資訊。

非 JS 爬蟲的限制與實務代價

AI 爬蟲如 GPTBot、ClaudeBot、PerplexityBot 不會執行 JavaScript,因此無法讀取 CSR 網站的動態內容。這意味著,若關鍵資訊(如服務詳解、地址、FAQ)依賴前端 JavaScript 動態生成,則 AI 抓取時只會得到一個空頁面。這種情況在實務上導致的結果是:品牌內容雖在前端可見,但對生成式引擎完全「透明」。

爬蟲行為静態 HTMLJS 渲染後的動態內容
GPTBot✅ 會讀取❌ 不執行 JS
PerplexityBot✅ 會讀取❌ 不執行 JS
ClaudeBot✅ 會讀取❌ 不執行 JS

這導致 CSR 網站的內容在 AI 抓取時只會顯示初始 HTML 中的內容,而動態載入的資訊(如問答、表格、FAQ)根本無法被讀取。根據實務觀察,這使得 CSR 網站的 AI 引用率大幅下降,品牌聲量在生成式搜尋中被嚴重削弱。

免程式 JSON-LD:實體圖與 HowTo 的雙重結構化

TrueLink 運用 JSON-LD 結構化資料,建立一個「免程式」的 SEO 視覺化架構。此做法的優勢在於:透過八型 Schema(Article、Organization、Person、Review、FAQPage、HowTo、Product、Service),建立一個可被 AI 引擎直接解析的實體圖。這不僅解決 CSR 的爬蟲問題,也強化了「內容可被引用」的機制。

JSON-LD 的八型 Schema 規範

Schema 類型優點註解
Article建立內容與作者的關聯可作為 HowTo 的父結構
Organization建立品牌實體為內容提供機構背景
Person建立作者實體與 Article 的 author 關聯
Review建立第三方評價增強信任訊號
FAQPage問答可被富結果與 AI 引用有助於切片引用
HowTo結構化步驟式說明易於 AI 摘取與再組織
Product結構化商品資訊有助於 AI 理解服務與產品
Service結構化服務資訊搭配 Product 使用,補足服務細節

這八類 Schema 是 TrueLink 視覺化結構的基礎,透過 JSON-LD 註解,這些實體可被機器直接解析,無需 JavaScript 渲染。

非 JS 爬蟲 vs SSR/SSG:結構化資料的選擇

為確保 AI 爬蟲能讀取內容,TrueLink 採用 SSR(Server-Side Rendering)或 SSG(Static Site Generation)方式,將 JSON-LD 註解直接嵌入 HTML 中。這與 CSR 的動態渲染形成對比:

渲染方式爬蟲可讀性效能適用場景
CSR❌ 低✅ 快動態互動
SSR✅ 高⚠️ 中SEO 導向
SSG✅ 高✅ 快静態內容

TrueLink 選擇 SSG 或 SSR 的方式,確保 AI 抓取時能獲得完整的 JSON-LD 註解與 HTML 結構。這使得 CSR 網站常見的問題(如動態載入內容無法被讀取)完全避免。

JSON-LD 八型 Schema 的實作步驟

為讓客戶能有效部署 JSON-LD 註解,TrueLink 採用「免程式」的實作方式,透過 Markdown 編輯與自動轉換,將結構化資料嵌入 HTML 中。這不僅降低技術門檻,也確保內容在 AI 抓取時能被正確解析。

實作流程

1. 內容結構化:將文章內容拆解為 Schema 規範的類型(如 Article、FAQPage)。 2. 嵌入 JSON-LD:將結構化資料轉換為 JSON-LD 註解,嵌入 HTML 的 <script type="application/ld+json"> 標籤。 3. 驗證結構:透過 Google 的「結構化資料測試工具」驗證 JSON-LD 是否正確。 4. 部署 SSG:將內容轉為靜態 HTML,確保 AI 抓取時可直接讀取。

這四步流程能讓 CSR 網站內容轉為 AI 可讀的格式,無需額外程式撰寫。

FAQPage 與 HowTo:結構化資料的雙重引用優勢

FAQPage 和 HowTo 是 AI 爬蟲最易抓取的兩種 Schema。FAQPage 可讓問答內容以富結果呈現,而 HowTo 能結構化步驟式說明,兩者皆有利於 AI 引擎切片引用。

Schema 類型AI 引用優勢範例
FAQPage問答可被直接引用用戶問「如何開設公司?」AI 可引用 FAQPage 中的步驟
HowTo步驟可被切分引用用戶問「如何申請營業執照?」AI 可引用 HowTo 中的每個步驟

TrueLink 運用這兩種 Schema,讓品牌內容在 AI 抓取時能被完整解析,並提高被引用的機率。

結論:結構化資料是 AI 引用的基礎建設

在 AI 抓取機制下,CSR 網站的動態內容對 AI 爬蟲完全透明。TrueLink 運用 JSON-LD 結構化資料,建立一個免程式、免 JS 的 SEO 視覺化架構。這不僅解決 CSR 的爬蟲問題,也強化了「內容可被引用」的機制。透過八型 Schema 的實作,品牌內容能在 AI 抓取時被完整解析,並提高被引用的機率。

TrueLink 始終專注於降低技術門檻,讓 SEO 與 GEO 變得更可及。

==FIELDS==

{ "excerpt": "AI 爬蟲無法讀取 CSR 網站的動態內容,導致關鍵資訊被跳過。TrueLink 運用 JSON-LD 結構化資料,建立一個免程式、免 JS 的 SEO 視覺化架構,解決 CSR 的爬蟲問題。", "metaDescription": "非 JS AI 爬蟲只能讀 raw HTML,TrueLink 用免程式 JSON-LD 八型 Schema 打通 SEO 實體圖與 HowTo 指南切角,讓 CSR 網站的內容能被 AI 引用。", "keywords": ["JSON-LD", "Schema.org", "AI 引用", "CSR 爬蟲", "結構化資料"], "tags": ["JSON-LD", "Schema.org", "AI 引用", "CSR 爬蟲", "結構化資料"], "pillarTopic": "結構化資料", "clusterId": "structured-data-schema", "category": "geo-strategy", "internalLinks": ["/blog/ai-geo-schema-org-c2pa-citation-2", "/tools/structured-data-validator", "/consulting/seo-schema-implementation"], "relatedPosts": ["ai-geo-schema-org-c2pa-citation-2", "ai-faqpage-schema-citation-rights-strategy-search", "ai-recipeqa-schema-article"], "faq": [ {"q": "AI 爬蟲為什麼不能讀取 CSR 網站的內容?", "a": "AI 爬蟲如 GPTBot 不會執行 JavaScript,因此無法讀取 CSR 網站的動態內容。這導致 CSR 網站的關鍵資訊(如地址、招牌、問答)在 AI 抓取時完全消失。"}, {"q": "JSON-LD 是什麼?", "a": "JSON-LD 是一種結構化資料格式,可用於描述網頁內容的語義。它能讓搜尋引擎與 AI 引擎直接解析網頁中的實體與關係,是 SEO 與 GEO 可見性的基礎建設。"}, {"q": "TrueLink 如何用 JSON-LD 解決 CSR 的爬蟲問題?", "a": "TrueLink 運用 JSON-LD 結構化資料,建立一個免程式、免 JS 的 SEO 視覺化架構。這使得 CSR 網站的動態內容在 AI 抓取時能被完整解析,並提高被引用的機率。"}, {"q": "FAQPage 和 HowTo 有什麼區別?", "a": "FAQPage 是問答結構,有助於富結果與 AI 引用;HowTo 是步驟式說明結構,有利於 AI 切片引用。TrueLink 運用這兩種 Schema,讓品牌內容在 AI 抓取時能被完整解析。"}, {"q": "結構化資料對 AI 引用有什麼幫助?", "a": "結構化資料讓搜尋引擎與 AI 引擎能機器可讀地理解網頁中的實體、作者與文章類型。這有助於 AI 引擎直接解析內容,提高被引用的機率。"} ], "keyTakeaways": [ "AI 爬蟲無法讀取 CSR 網站的動態內容,導致關鍵資訊被跳過。", "JSON-LD 是一種結構化資料格式,可用於描述網頁內容的語義。", "TrueLink 運用 JSON-LD 結構化資料,建立一個免程式、免 JS 的 SEO 視覺化架構。", "FAQPage 和 HowTo 是 AI 引用的兩種重要 Schema,有助於內容被切片引用。", "結構化資料是 SEO 與 GEO 可見性的基礎建設,能提高內容被 AI 引用的機率。" ], "imageSceneHints": [ {"heading": "AI 爬蟲無法讀取 CSR 網站的內容", "scene": "一個伺服器回傳的 HTML 頁面,與一個 JavaScript 渲染後的動態頁面,AI 爬蟲只讀取前者。"}, {"heading": "JSON-LD 的結構化資料", "scene": "HTML 中嵌入的 JSON-LD 標籤,顯示網頁中的實體與關係。"}, {"heading": "FAQPage 與 HowTo 的引用優勢", "scene": "一個問答頁與一個步驟指南頁,AI 引擎直接解析內容並切片引用。"} ], "sectionVisuals": [ { "anchor": "sec-1", "kind": "compare", "title": "CSR vs SSG", "items": [ { "heading": "CSR", "points": ["動態渲染", "AI 爬蟲無法讀取", "關鍵資訊易被跳過"] }, { "heading": "SSG", "points": ["靜態渲染", "AI 爬蟲可讀取", "結構化資料可嵌入"] } ] }, { "anchor": "sec-2", "kind": "pillars", "title": "JSON-LD 八型 Schema", "items": [ {"label": "Article", "desc": "建立內容與作者的關聯"}, {"label": "Organization", "desc": "建立品牌實體"}, {"label": "Person", "desc": "建立作者實體"}, {"label": "Review", "desc": "建立第三方評價"}, {"label": "FAQPage", "desc": "問答可被富結果與 AI 引用"}, {"label": "HowTo", "desc": "結構化步驟式說明"}, {"label": "Product", "desc": "結構化商品資訊"}, {"label": "Service", "desc": "結構化服務資訊"} ] } ], "author": "林士華" }