在某些情況下,您很可能遇到的網頁載入速度沒有您希望的那麼快。作為用戶,加載速度的缺乏可能會讓我們感到絕望,因此放棄該網站,轉而尋找能夠更快地為我們提供所需內容的替代方案。到目前為止,沒有什麼新鮮事:又一個糟糕的使用者體驗案例。但是,當那個緩慢的網站是我們的時會發生什麼?這就是WPO 或 Web 效能優化發揮作用的地方。
我們在這篇文章中告訴您更多關於他的資訊!
貼文內容:什麼是 WPO?如何衡量WPO和網站速度?
如何借助 WPO 提高網站的速度和效能?
您需要 WPO 來幫助您提高網站速度嗎?值得信賴!
什麼是 WPO?
WPO 或 Web 效能最佳化是一組旨在提高網頁速度和效能的技術。 WPO 並不是一個新概念,遠非如此,但自從 Google 在 2010 年決定將網站速度作為搜尋結果中的定位標準 1以來, 優化網站效能的工作就越來越重要了,
由於這種外觀成為網站出現在搜尋引擎之父中的決定性因素,
因此越來越多的工作來概念化效能不佳 哥斯大黎加 電話號碼庫 對網站可能產生的不同影響,同時開發人員也致力於研究調查最可能損害網路速度的因素。結果是:創建更輕、更精確、更快的頁面,使您的網站在搜尋引擎中排名更高,並改善用戶體驗。
然而,Google決定對 WPO 進行新的調整,為了便於衡量網路效能,宣佈在 2020 年底推出指標,以更準確地評估使用者體驗,並幫助 Maca 和擁有網站的公司了解什麼他們必須致力於的因素:核心網路生命力。
此外,谷歌還宣布,從 2021 年 6 月的核心更新開始,這些指標將成為一個重要的定位因素。會想到呢?
核心網路生命力衡量網站的不同方面,
並且必須在 Google 認為正 健數位行銷策略代理商如何 確的參數範圍內。
核心網路生命力(Core Web Vitals),也就是那些讓 Google 了解網站效能的 KPI,基本上分為三個:
LCP(最大內容繪製):測量 從使用者請求 URL 時起渲染視窗中可見的最大內容元素的時間量。最大的元素通常是圖像或視頻,或者可能是大的文字元素。這很重要,因為它告訴讀者該 URL 正在實際加載。
FID(首次輸入延遲):從使用者第一次與頁面互動(點擊連結、按下按鈕等)到瀏覽器回應該互動的時間。此測量值取 奢侈的交易 自使用者首次點選的互動元素。這對於使用者需要執行某些操作的頁面非常重要,因為此時頁面已變為互動式。
CLS(累積佈局偏移) :CLS 測量頁面整個生命
週期中發生的每個意外佈局變更的所有單獨佈局偏移分數的總和。分數範圍從零到任何正數,其中零表示不滾動,數字越高,頁面上的佈局滾動越多。這很重要,因為當用戶嘗試與其互動時頁面元素滾動是一種糟糕的用戶體驗。
美國超市Costco網站上的高LCP範例。
如何衡量WPO和網站速度?
現在我們對 WPO 的含義有了更多的了解,我們已經知道它對 Google 的重要性 – 因此任何想要出現在主要搜尋結果中的公司或品牌 – 決定性的問題之一是:你如何我的網站是這樣做的嗎?為了回答這個問題,有許多工具可以用來測量,但最著名的是PageSpeed Insights。
該工具統一了 Google 用於衡量網站效能的兩個主要報告。
一方面,它從 Google Chrome 用戶體驗報告中提取了對 Core Web Metrics(包括 Core Web Vitals)的評估。這些是真實的數據,因為它們是從數百萬個網站(桌面版和行動版)的使用者體驗中獲得的。
來自 Google 自己網站的核心網路指標評估範例,突出顯示了核心網路生命:LCP、CLS 和 FID。
如果我們分析我們的網站,我們可以在我們的Google Search Console 帳戶的「主要 Web 指標」部分中從該報告中提取更多數據,其中將顯示我們的URL 的狀態以及每個URL 呈現的事件(如果有)。
在 Google Search Console 中,我們可以根據 CrUX 報告查看有多少 URL 被認為是良好、一般和不良。
另一方面,我們在 PageSpeed Insights 中看到的大部分數據,
包括著名的效能分數,都源自於 Lighthouse 報告。這個開源工具為我們提供了更多關於我們的網路效能表現的數據,建立了 6 個主要參數,從中提取最終分數。Lighthouse 報告根據與網站效能相關的六個參數建立了評分。
該報告與 Chrome 用戶體驗報告(也稱為 CrUX 報告)之間的主要區別在於,該數據不是從真實用戶的體驗中提取的。Lighthouse 報告是負載模擬的結果,使用中低範圍行動電話(例如摩托羅拉 Moto G4)且具有較慢的 4G 限制。這解釋了為什麼我們在許多情況下發現該報告中的數據比 CrUX 報告更糟。
正如我們之前所說,
雖然 PageSpeed Insights 是衡量網站效能最常用的工具,但它並不是唯一的工具。其他工具(如Pingdom Tools、GTmetrix 或WebPageTest) 都是非常好的選擇,以便您隨時可以很好地控制您的網站。此外,如果您想要進行更完整的 SEO 審核,Radia 是分析您網站的絕佳選擇。
如何借助 WPO 提高網站的速度和效能?
透過對網站效能的充分衡量,我們已經知道網站的主要優勢在哪裡,我們還將發現最迫切需要解決的改進。這就是我們要重點關注的地方!
下面我們列出了可以在我們的網站上使用的主要元素。
減少 JavaScript
JavaScript 是卓越的客戶端技術,全球約 95% 的網站都在使用 它。幫助改善使用者體驗。然而,JavaScript 是一種在瀏覽器中消耗大量資源的程式碼(例如,如果我們將其與 HTML 進行比較)。這個問題在行動裝置上會增加,因為行動裝置的處理能力與桌面裝置不同。 JS資源的大量消耗影響網站的效能,所以我們可以使用的JavaScript越少越好。
在縮小 JavaScript 資源方面還有很多工作要做,因為我們需要精確地了解我們想要在網站上顯示的程式碼量。PageSpeed Insights 幫助我們發現消除未使用的 JavaScript 的主要機會,這些 JavaScript 會損害我們網站的效能。在頁面本身上,透過Chrome DevTools, 我們也可以知道消耗最多資源的 .js 元素。
我們使用它來提取未使用程式碼百分比最高的 JavaScript 元件。
如果我們想要執行更詳細的分析,我們可以將 Screaming Frog 連接到 PageSpeed Insights API,這樣就可以擷取每個 URL 的資料。
減少 CSS
與 JavaScript 一樣,如果我們想提高網站的效能,盡量減少可能對網站無用的 CSS 資源是另一個極其重要的因素。我們發現自己處於同樣的情況,CSS資源的 作用是為網站提供樣式,最終使其變得更加美觀。這很棒,並且將使頁面對使用者更有吸引力,但是 CSS 會消耗瀏覽器資源,儘管不像 JavaScript 那麼多。
在 PageSpeed Insights 中,特別是透過將 Screaming Frog 連接到其 API,我們可以提取網路上最重要的 CSS 片段,並評估是否應該消除它們以獲得更好的頁面效能。告訴我們應該消除哪些未使用的 CSS 資源以提高網站的效能啟用 GZIP 或 Brotli 壓縮
資料壓縮使網站和伺服器之間的通訊更快、更流暢。我們越能讓伺服器更輕鬆地將網站的資料傳輸到瀏覽器,資料部署的速度就會越快,因此網站的效能就會越好。
兩種主要的壓縮格式是 GZIP 和 Brotli。特別推薦第一個,因為Brotli 尚不相容某些伺服器。透過啟用這種壓縮,我們可以將網站和伺服器之間的檔案傳輸大小顯著減少多達 90%。
Brotli 壓縮的範例,可以減少近 80% 的總檔案傳輸大小。應用延遲載入或延遲載入延遲載入或延遲載入是一種可以讓 Web 內容的載入更加漸進的技術。這種做法通常旨在推遲圖像或影片的載入。
應用延遲載入的目的是在圖形資源出現在螢幕上時加載它們,從而推遲網站最重元素的加載並防止它們首先被處理,這將意味著很長的 LCP 時間。
透過使用延遲加載,可以避免加載可能不會使用的物件。例如,如果使用者沒有捲動到頁面末尾,則永遠會載入在頁面該區域中找到的物件。這樣就減少了網站的載入時間,節省了伺服器資源。
有許多資源可以讓您以簡單的方式在您的網站上應用延遲加載,無論您的 CMS 是什麼。例如, WordPress 的 WP Rocket 中的LazyLoad外掛程式或 Magento 的Lazy Load擴充 都是有效的解決方案,可以讓您省去麻煩。延遲載入僅允許載入我們在螢幕上看到的圖形元素將圖像上傳到 WebP
不言而喻,我們上傳到網站的所有圖像的重量必須盡可能小。建議小於100 kb 的圖片越多, 網站的效能就越好。現在,由於圖像很輕,我們必須保持一定的最低品質。到目前為止,PNG 以及最重要的是 JPG 格式由於其對所有瀏覽器的適應性而成為網站之王。然而,WebP 或 AVIF 等格式逐漸成為網站最推薦的格式。
我們建議使用 WebP,因為它是一種比 PNG 或 JPG 保持更高品質標準且重量更輕的格式。也就是說,我們可以壓縮網站上的圖像,而不會因圖像清晰度差而損害用戶體驗。
AVIF 格式的品質甚至有所提升。但是,由於瀏覽器相容性問題,我們不建議使用 AVIF。此格式僅支援 Chrome、Firefox 和 Opera 桌面版,而 Safari 則只能在從 16.0 版本開始保證的情況下查看。
預先載入字體並使用少量
在進行 WPO 分析時,這一因素並未得到充分考慮,但這並沒有降低它的重要性。小心來源!我們的建議是在同一頁上使用最多 3 種字體,同時考慮到同一系列的不同版本會被視為不同的字體。
避免將字元過多的字體上傳到網站。也就是說,如果您的網站沒有中文或阿拉伯語版本,為什麼要包含包含這些語言字元的字體?您可以使用Font Squirrel等工具編輯字體 並刪除不需要的內容。確保上傳字體的格式始終為 WOFF2。
除了使用較淺的字體之外,完全優化它們的最後一步是預先載入它們。這樣,您可以先顯示該資源,而不必封鎖頁面其餘部分的呈現。
您需要 WPO 來幫助您提高網站速度嗎?值得信賴!
現在您知道從哪裡開始提高網站速度,是時候開始工作了,等待結果到來,讓 Google 將放大鏡放在您的網站上。
但是,由於幾乎所有事情說起來容易做起來難,正如您所看到的,這是一個非常廣闊的領域,並且有許多因素發揮作用並且必須實施,因此,如果您在通往頂峰的艱難道路上需要協助,請記住Elogia 是您理想的SEO 代理機構,可以陪伴您完成這一切。
透過 WPO 來改善您的定位結果,您還在等什麼?聯絡我們!