

CLS提分小技巧大放送
CLS對網(wǎng)頁體驗有什么影響?
累計布局偏移Cumulative Layout Shift(CLS)是Core Web Vitals用來權(quán)衡網(wǎng)站視覺穩(wěn)固性的三個指標(biāo)之一。簡而言之,如果頁面的重要內(nèi)容加載到頁面上,然后由其他內(nèi)容(比如圖片)驅(qū)動,那么布局就會產(chǎn)生變更。
很多時候,當(dāng)訪客點擊按鈕或鏈接(如“瀏覽更多內(nèi)容”按鈕)時,版式產(chǎn)生轉(zhuǎn)變,可能鏈接轉(zhuǎn)移,拜訪者最后點擊了其他內(nèi)容或廣告。這無疑會損壞用戶體驗。
谷歌認(rèn)可的更佳CLS尺度<0.1?
Google把影響評分描寫為受手機內(nèi)容影響的部分。若將一半(50%)屏幕內(nèi)容移至一半(25%),則屏幕受到75%的影響。它表現(xiàn)后果分?jǐn)?shù)是0.75,而且距離分?jǐn)?shù)是0.25,因為內(nèi)容移動了視口的25%。最后的成果是0.75*0.25=0.1875。
依照谷歌官方的說法,超過0.1的CLS分?jǐn)?shù)將影響用戶體驗,應(yīng)當(dāng)下降。也就是說,當(dāng)CLS指標(biāo)小于0.1時,有助于確保頁面具有用戶體驗。
CLS提分小技能大放送:
1、創(chuàng)立硬編碼的單一尺碼廣告
宣布者可以在頁面頂部創(chuàng)立單一大小的廣告地位,只實用于硬編碼的廣告。應(yīng)用這種占位符可以確保布局沒有轉(zhuǎn)變,但是以每個廣告地位都只有一個大小為代價。
2、推遲宣布加載廣告
一個宣布者應(yīng)當(dāng)斟酌一個更佳做法,那就是延遲加載廣告,在實際須要之前不要載入廣告。舉例來說,如果一個頁面有三個視窗,那么第三個視窗上的廣告將不會被載入,直到訪客達(dá)到第二個視窗。
但是這個缺陷是沒有斟酌到用戶的行動,如果滾動速度比擬快,超過占位符,則廣告載入太遲,延遲加載的廣告仍然會導(dǎo)致布局偏差。另外,要注意延遲加載會損壞可視性。
3、應(yīng)用實時數(shù)據(jù)優(yōu)化用戶體驗
應(yīng)用實時數(shù)據(jù)為每一個訪客優(yōu)化個性化廣告體驗。有了數(shù)以百計的匿名數(shù)據(jù)點,宣布者可以個性化應(yīng)當(dāng)放置什么樣的廣告,以及在頁面上的時光和地點。這樣做不僅可以進(jìn)步CLS得分而不會影響用戶體驗,而且還能改良站點延遲。
特別聲明:以上文章內(nèi)容僅代表作者本人觀點,不代表ESG跨境電商觀點或立場。如有關(guān)于作品內(nèi)容、版權(quán)或其它問題請于作品發(fā)表后的30日內(nèi)與ESG跨境電商聯(lián)系。
二維碼加載中...
使用微信掃一掃登錄
使用賬號密碼登錄
平臺顧問
微信掃一掃
馬上聯(lián)系在線顧問
小程序
ESG跨境小程序
手機入駐更便捷
返回頂部