縮小不需捲動位置的內容

當 PageSpeed Insights 偵測到網頁需要額外的網路來回行程,才能轉譯不需捲動位置的內容,就會觸發這個規則。

總覽

如果所需資料量超過初始壅塞時間 (通常壓縮為 14.6 kB),則伺服器和使用者瀏覽器之間需要額外的往返時間。如果使用者所用的網路延遲時間 (例如行動網路) 較高,網頁載入速度可能會因此大幅延遲。

建議

如要加快網頁載入速度,請限制轉譯網頁不需捲動位置所需的資料大小 (HTML 標記、圖片、CSS、JavaScript)。 做法如下:

建立 HTML 架構,使其優先載入重要和不需捲動位置的內容

請先載入網頁的主要內容。建立網頁架構,讓伺服器提供的初始回應立即傳送轉譯網頁重要部分所需的資料,然後延後顯示其他內容。 這可能表示你必須將 CSS 分成兩部分:內嵌部分負責設定內容 ATF 部分的樣式,以及可延遲顯示的部分。

請參考以下範例,瞭解如何重新建立網站,加快載入速度:

  • 如果您的 HTML 是在載入主要內容前載入第三方小工具,請調整其載入主要內容的順序。
  • 如果網站採用包含導覽側欄和文章的雙欄設計,但您的 HTML 是在文章之前載入側欄,請考慮先載入文章。

減少資源占用的資料流量

如果網站經過重新設計,可在各種裝置上順利運作,並先載入重要內容,請使用下列技巧減少轉譯網頁所需的資料量:
  • 壓縮資源:您可以移除不必要的空格和註解,藉此壓縮 HTML、CSS 和 JavaScript。如要進一步最佳化,則可使用各種工具為資源中的變數名稱重新命名。
  • 如果可以,請盡量使用 CSS 取代圖片
  • 啟用壓縮功能

意見回饋

本頁內容對你是否有幫助?