修正延遲載入內容

延緩載入次要或不可見的內容是提升效能和使用者體驗的常見最佳做法，這種做法通常稱為「延遲載入」。如需更多資訊，請參閱「網站基礎知識」的延遲載入圖片和影片指南。然而，如果未正確執行，這項技術可能會不小心對 Google 隱藏特定內容。這份文件會說明如何確認 Google 可以檢索延遲載入的內容，並為其建立索引。

當可視區域顯示內容時載入內容

為了確保 Google 能夠完整查看網頁內容，請在執行延遲載入時，確認所有相關內容在可視區域顯示時皆已載入。舉例來說，您可以透過下列項目確認內容載入情況：

• 適用於圖片和 iframe 的原生延遲載入功能
• IntersectionObserver API 和 polyfill
• 支援在資料進入可視區域時載入資料的 JavaScript 資料庫

此外，請務必測試您的導入作業。

支援無限捲動網頁的分頁載入功能

如果您正在導入無限捲動網頁體驗，請確實提供支援分頁載入的功能。分頁載入功能對使用者而言非常重要，不僅可讓使用者分享及再次與您的內容互動，也可讓 Google 顯示前往內容中特定位置的連結，而非無限捲動頁面頂端。

如要支援分頁載入，請為各區段提供不重複連結，讓使用者能夠直接分享和載入。我們建議您在內容以動態方式載入時使用 History API 來更新網址。

測試

在導入作業設定完畢後，請確保作業能夠正確執行，其中一個方法是使用 Puppeteer 指令碼在本機進行測試。Puppeteer 是用來控制無頭 Chrome 的 Node.js 資料庫。如要執行指令碼，您需要使用 Node.js。請使用以下指令來檢查並執行指令碼：

git clone https://github.com/GoogleChromeLabs/puppeteer-examples
cd puppeteer-examples
npm i
node lazyimages_without_scroll_events.js -h

執行指令碼之後，請手動檢查產生的螢幕截圖，確保畫面中包含所有您預期可見並由 Google 建立索引的內容。

您也可以透過 Search Console 的網址檢查工具確認所有圖片的載入情況。如要確保圖片皆已載入，請查看螢幕截圖和轉譯後的 HTML。