網頁幾秒鐘就能打開，比留住用戶早了一步。解讀手機白皮書4.0。通過研究發現，大部分網頁加載緩慢是由于其他網頁資源耗時過多，圖片尺寸過大造成的。首屏加載時間要在1.5秒內完成，會導致用戶流失。

據百度搜索用戶大數據了解，用戶對于網頁打開速度的要求越來越高，主屏幕的加載時間最好能在1.5秒內完成，加載時間過長會導致用戶流失。

通過研究發現，大部分網頁加載慢是由于網頁其它資源耗時過多及圖片體積過大造成，下面總結了部分網頁速度優化方法給大家參考。

福利環節

如果你想要學習更多的SEO優化技巧，可以從我的專欄中找到更多的干貨文章，想免費領取資料的朋友請看下文

獲取資料方式：

渠道1：微信 seobst

渠道2：公眾號 愛學SEO

網頁其它資源耗時過多的的優化方案

1、刪除無用資源及JS/CSS文件

現如今很多網頁都包含一些無用的文件資源，不但影響網頁加載速度，而且還不能給用戶帶去價值，因此建議定期清除網頁中一些無用的資源，避免給網頁加載速度帶去影響。

2、利用代碼拆分減少JS負載

將首屏中必要的JS代碼先拆分出來，便于提前加載，達到縮減首屏加載時間的目的，其它的JS代碼則按照按需加載或置后加載的方式，建議將首屏JS代碼放在首屏渲染之后，body標簽關閉之前。

3、優化阻塞渲染JS及JS使用方式

JS文件在允許修改的同時，也會阻止DOM構建，阻塞頁面渲染，可考慮使用defer方式或async方式讓JS文件可以異步執行加載，刪除關鍵渲染路徑中一些不必要的JS文件。
默認情況下，JS文件會阻塞網頁解析時間，延長網頁首屏加載時間，異步JS資源執行方式不會阻塞網頁解析時間，可考慮選擇在首屏渲染后異步加載腳本。

4、優化阻塞渲染的CSS及CSS使用方式

網頁CSS資源會阻塞網頁內核渲染，大兵建議精簡網頁CSS資源，讓網頁首屏可在最短時間完成CSS加載，把重要的CSS資源放在網頁head標簽內，達到縮短首屏渲染時間的目的。
CSS資源是渲染網頁的必備文件，在渲染網頁時，應確保將非必要CSS資源都標記為非關鍵資源，并盡可能減少網頁網頁CSS資源的數量。

圖片體積過大優化方案

1、控制圖片大小

1）針對本地圖片

本地圖片體積過大會導致小程序包體積過，延長首屏加載時間，因此建議盡可能將圖片體積縮小：
（1）對于不需要透明背景的圖片，建議用jpeg格式來代替png格式；
（2）安卓移動端圖片格式建議選擇webp格式，webp格式在有損壓縮的情況下，不會察覺圖片壓縮前后有變化，但圖片體積卻大大縮小了；
（3）確保小程序包中沒有無用的圖片資源；
（4）設置延遲加載不重要的圖片文件，在小程序必要圖片加載完成后再加載不重要的圖片；
（5）使用第三方工具對圖片進行有損壓縮。

2）針對網絡圖片

（1）對于部署cdn加速服務器上的圖片，也建議壓縮；
（2）通過cdn服務器獲取的圖片資源，建議添加圖片壓縮規則;
（3）使用第三方壓縮工具對于壓縮后，再上傳至cdn服務器。

3、謹慎使用image組件的mode屬性

圖片image組件的mode屬性向開發者提供了13種模式，widthFix模式就屬于其中一種，由于widthFix模式需要動態計算圖片寬度，導致網頁尺寸重繪，因此建議大家謹慎使用mode屬性的widthFix模式。

4、使用漸進式JPEG來優化用戶體驗

JPEG圖片格式先展示圖片模糊輪廓，隨著加載掃描次數的增加，圖片越來越清晰，對于擁堵的網絡環境作用比較大，也在一定程度上提升了用戶體驗。

百度搜索“閃電算法”的支持

為了保障良好的用戶體驗，給予優質站點更多的展現機會，百度搜索于2017年上線了“閃電算法”。

百度“閃電算法”具體內容如下：

要求移動端網頁可在2秒時間內完成加載，在此時間內完成加載的站點將會獲得流量傾斜，同時網頁首屏加載時間超過3秒鐘，將會被懲罰。
首屏是用戶打網頁的第一屏，重要性肯定是不言而喻的，根據《百度移動搜索白皮書4.0》提出，要求首屏要在1.5秒內完成加載，百度搜索“閃電算法”可參考拓展閱讀第2條。
在移動互聯網時代，用戶越來越沒有耐心，對于網頁加載速度也是越來越高，根據相關數據表明，頁面放棄率和頁面加載時間關系如下圖所示：

總結，網頁加載打開速度對于用戶體驗有著很大的影響，提高網頁加載速度才是開發者要追求的目標，例如可以使用加速方案如 MIP、AMP），對于整體網頁進行加速。

拓展閱讀：
1、wordpress加載速度很慢,wordpress優化速度教程
2、解讀百度閃電算法打擊了什么網站