品牌在建立自己的官網(wǎng)前,除了視覺化的網(wǎng)頁設(shè)計、網(wǎng)頁排版之外,也要將「網(wǎng)站速度」這點(diǎn)考量進(jìn)去,因為網(wǎng)站速度跟使用者體驗有高度關(guān)聯(lián)。
設(shè)想一下,當(dāng)品牌好不容易藉由數(shù)位行銷將客人帶進(jìn)官網(wǎng),結(jié)果發(fā)現(xiàn)只要在品牌官網(wǎng)執(zhí)行一個動作就要Loading 很久,想必對這個網(wǎng)站不會留下什么好印象,最終的結(jié)果就是造成客戶的流失,因此,提升網(wǎng)站速度就成為經(jīng)營網(wǎng)站必須做的功課之一,而以下就用Google Page Speed Insights這個工具教學(xué)如何優(yōu)化網(wǎng)站速度,增加網(wǎng)頁運(yùn)轉(zhuǎn)效能,進(jìn)而提供客戶良好的使用體驗
Google Page Speed Insights 是什么?
?Google Page Speed Insights是一款常用于檢測網(wǎng)站速度的工具,是由Google開發(fā)團(tuán)隊所制作,只要將網(wǎng)址放入測試軟體中,系統(tǒng)就會針對該網(wǎng)址分別在「電腦」以及「行動裝置」提供?網(wǎng)站速度?相關(guān)資訊,包含「網(wǎng)站體驗核心指標(biāo)」以及「效能診斷」。
網(wǎng)站擁有者可以透過這兩項檢測網(wǎng)站速度指標(biāo),利用實(shí)際數(shù)據(jù)去檢測自身的網(wǎng)站到底快或慢,具體知道網(wǎng)站速度改如何優(yōu)化。
Google Page Speed Insights 指標(biāo)
網(wǎng)站體驗核心指標(biāo)(Core Web Vitals)
網(wǎng)站體驗核心指標(biāo)會搜集網(wǎng)站在過去28天內(nèi)的三組數(shù)據(jù)(LCP、FID、CLS),進(jìn)而評估該網(wǎng)址劃分不同的等級:「優(yōu)良的網(wǎng)址」、「待改善的網(wǎng)址」、「不良的網(wǎng)址」
LCP(Largest Contentful Paint):計算網(wǎng)頁中最大元件載入時花費(fèi)的時間,例如一個網(wǎng)址中有一張尺寸較大的圖片,這個圖片也是需要載入時間最久的元件,LCP就會計算載完這張圖所需要的時間。
FID(First Input Delay):當(dāng)使用者進(jìn)入網(wǎng)頁,并在該網(wǎng)頁進(jìn)行的第一個互動中,可能是點(diǎn)了連結(jié)、按鈕、上傳資料…等,網(wǎng)頁需要花多久的時間才能反應(yīng)使用者的互動,簡單來說,這是一個Google衡量網(wǎng)頁跟用戶「互動性」的指標(biāo)。
CLS(Cumulative Layout Shift):又稱為「累計版面配置轉(zhuǎn)移」,當(dāng)網(wǎng)頁中的元素載入時,很容易因為網(wǎng)頁速度不穩(wěn)造成畫面跳動,為了視覺的「穩(wěn)定性」并且提供給使用者良好的網(wǎng)站體驗,CLS越低越好。
優(yōu)良網(wǎng)址待改善網(wǎng)址不良網(wǎng)址
優(yōu)良網(wǎng)址 | 待改善網(wǎng)址 | 不良網(wǎng)址 | |
LCP | <2.5sec | 2.5-4.0sec | >4.0sec |
FID | <100ms | 100-300ms | >300ms |
CLS | <0.1 | 0.1-0.25 | >0.25 |
效能診斷(Performance diagnostics)
?Google Page Speed Insights結(jié)合Lighthouse分析模擬網(wǎng)站在FCP、LCP、CLS…等指標(biāo)權(quán)重后,給予檢測的網(wǎng)址一個分?jǐn)?shù),如果計算出來的分?jǐn)?shù)介于0-50分,則會顯示「紅色」,代表網(wǎng)頁還有多處需要加強(qiáng);分?jǐn)?shù)介于5-89分,則會顯示「橘色」;分?jǐn)?shù)超過90分,則會顯示「綠色」,代表是優(yōu)良的網(wǎng)址。
雖然效能診斷是透過「模擬」的環(huán)境進(jìn)行測試,但是仍然網(wǎng)站擁有者然仍可以根據(jù)提供的指標(biāo)項目進(jìn)行優(yōu)化,讓網(wǎng)頁更符合Google網(wǎng)頁速度的標(biāo)準(zhǔn)。
Google Page Speed Insights 教學(xué)
1. 至Google Page Speed Insights填入網(wǎng)址
2. 查看該網(wǎng)址在「電腦」以及「行動裝置」的成效
3. 查看網(wǎng)站體驗核心指標(biāo)
4. 查看效能診斷分?jǐn)?shù)
5. 針對優(yōu)化建議做網(wǎng)址改善
Google Page Speed Insights 整體結(jié)論
網(wǎng)站速度是每一個經(jīng)營網(wǎng)站者本身必須考量的問題,除了用「體感」的方式感受網(wǎng)頁速度之外,?Google Page Speed Insights提供了數(shù)據(jù)、指標(biāo)來評估網(wǎng)頁快與慢,讓網(wǎng)頁經(jīng)營者在優(yōu)化上可以更有方向。
一個對于Google 來說使用者體驗優(yōu)良、網(wǎng)頁速度快,也會有助于在SEO 上的排名,Google也會更愿意推薦該網(wǎng)站在指定搜尋結(jié)果中,不過即便如此,也要提醒Google Page Speed Insights只是一個參考的數(shù)據(jù)指標(biāo),在進(jìn)行網(wǎng)頁速度優(yōu)化時,也要搭配其他網(wǎng)站速度監(jiān)測的軟體同步進(jìn)行,讓網(wǎng)頁速度的優(yōu)化效果更加全面。
如果對于網(wǎng)站速度或是自家網(wǎng)站在Google Page Speed Insights?數(shù)字有任何疑問,都?xì)g迎與我們?展曜網(wǎng)頁設(shè)計?聊聊,我們將提供您最完整的?網(wǎng)頁速度優(yōu)化?建議。
如果您能訪問,你點(diǎn)擊試試。https://pagespeed.web.dev/?utm_source=psi&utm_medium=redirect