免費參與·100+跨境活動 
免費下載·4000+跨境資料 
免費學習·2000+直播課程 
免費加入·15萬+賣家交流群 
2020-06-04 18:22
內容導讀：
頁面加載速度的重要性，大家都是深有體會的：
如果一個網站加載速度慢，造成頁面打開的太慢，一般我們會心里鄙視一下這個網站，然后離開它。
本文系統的講解了：頁面加載速度的重要性，及如何判斷加載速度的快慢、如何優化頁面速度。
什么是頁面加載速度？
頁面加載速度是：一個網頁加載完畢所花費的時間。頁面的加載速度取決于幾個不同的因素，包括站點的服務器、頁面文件大小和圖像壓縮。
但“頁面加載速度”并不像聽起來那樣簡單。
因為有很多不同的方法來衡量頁面速度。以下是最常見的三個：
完全加載頁面： 這是加載頁面上100％的資源需要花費的時間。這是確定頁面加載速度的最直接的方法。
縮短服務器響應用時(TTFB)： 發出頁面請求到接收到應答數據第一個字節所花費的毫秒數。它包含了DNS解析時間、 TCP連接時間、發送HTTP請求時間和獲得響應消息第一個字節的時間。
如果您打開一個頁面，看到頁面出現幾秒的白屏，這就是TTFB在工作。
首次有效繪制時間/首次內容繪制時間(First Meaningful Paint/First Contextual Paint)： 是當頁面的主要內容出現在屏幕上花的時間。
例如，假設您有一篇博客文章，它需要10秒鐘才能完全加載。
如果看整個頁面加載完畢所需要的時間……這可是很長的一段時間。
但是實際上，關注“首次有效渲染”可以更好地理解：當頁面加載時，用戶是如何與頁面交互的。
例如：我們再看看那個需要10秒，才能全部加載完的頁面：
雖然全部加載完需要10秒，但是用戶在1.5秒后，會看到主要內容。
這意味著他們可以很快與您的頁面進行互動。因此，對于用戶而言，您的頁面速度很快。
重點是什么？
有很多不同的方法來檢測頁面加載速度。但是沒有哪個“正確”的方法，有壓倒性的優勢。每種方法，都有優點和缺點。
而我們應當專注于：提高所有的、能找到的頁面速度指標。
為什么頁面速加載度對SEO很重要？
自2010年以來，谷歌就一直將頁面速度作為排名因素。
在2018年，Google 通過更新“網站速度”通告，提升了頁面速度的重要性。
簡而言之：
網站加載緩慢會損害您的Google排名。
問題是：Google如何確定您網站的加載速度？他們是否查看頁面完全加載需要多長時間？還是TTFB（縮短服務器響應用時）？
他們尚未對此發表任何正式聲明。但是可以從他們的PageSpeed Insights工具中可以了發現：他們可能結合了各種不同測量方法。
下面，哥就來和大家談談：如何提高網站的加載速度。
最佳實踐
壓縮圖像
我之所以把它放在第一位，是因為解決了這個問題，就可以說解決了大部分問題。
畢竟，圖像通常占據頁面大小的50-90％。
例如：查看我的網站上的頁面速度報告：
您可以看到：圖片的大小占據整個頁面大小的86.2%。
因此，您可以壓縮的圖像越多，頁面加載的速度就越快！
如何做呢？
如果您使用WordPress建站，我強烈建議您使用一個名為WP Smush的插件：
它會自動壓縮您上傳到WordPress媒體庫的所有圖像。插件的作者說，這可以將圖像文件的大小減少14.2％。
您使用的不是WordPress？還是有很多圖像壓縮工具，例如Cesium和Mass Image Compressor。
與以往不同，現在的圖片壓縮技術使用無損壓縮，或者是降低圖片的質量（但對視覺效果影響極小）。
例如，我們對backlinko的所有圖像都進行了壓縮。但是它們依然看起來很清晰。
清理并壓縮您的代碼：
也就是說：縮減資源的大小。
這包括：HTMLCSSJavaScript以及您頁面上找到的所有其他代碼第一步是清除頁面上臃腫的代碼。這些額外的代碼，可能來自網站上不再需要的功能，也可能來自蹩腳的程序員的工作。
也就是：代碼越干凈，加載的速度就越快。
然后，使用GZip之類的程序壓縮代碼。
升級主機
這是一個很少人討論的技巧。
您可以整天清理代碼并壓縮圖像。但是，如果您每月在主機上僅花費4.99美元，那么您的網站很難快速加載。
那是因為您與其他數百萬個網站共享服務器。
因為市面上有非常多主機服務商，所以我不能特別推薦某個服務商。
在這方面，有一個通用的規則：在服務器托管方面，一分錢，一分貨。
所以，如果您真想提高網站的加載速度，可能要升級到高級主機或專用服務器。
激活瀏覽器緩存
這使用戶可以將頁面的一部分存儲在他們的瀏覽器緩存中。
當他們下次訪問您的網站時，加載速度會很快。
但是，當用戶首次訪問您的網站時，這不起作用。但是當用戶再次訪問時，可以顯著的提高加載速度。
您可以在.htaccess文件中設置瀏覽器緩存。或使用WordPress插件。
內容分發網絡（CDN）是提高網站加載速度的最簡單方法之一。
CDN通過確定訪問者的實際位置，從離訪問者最近的服務器，為訪問者提供資源。
使用網頁速度測試工具進行測試
到這一步，您已經對網頁加載速度進行了優化。現在要看看效果如何。
我建議使用兩種不同的工具測試您的頁面速度。
首先是Google PageSpeed Insights。
Google的工具會掃描您頁面的代碼中是否存在問題…
并且發現機會：
最近還增加了一項功能：可以知道從網站加載，到實際用戶使用，一共需要多少時間（使用Google Chrome瀏覽器數據）。
這是超級有用的。
注意：您有時可能會發現，該工具對您網站的建議，實際沒啥卵用。
例如，Google的工具建議我“使用下一代的圖片格式”。
但是，大多數瀏覽器（包括Safari和Firefox）不支持這些“下一代”格式。因此，如果您切換到這些“下一代”格式，則您網站的用戶體驗將很糟糕。
但是：這款工具還是有很多有用的地方。所以要盡可能多的去執行它的建議。
接下來，還有一個工具：WebPageTest.org。
這款工具很酷的地方是：它將頁面加載到實際的瀏覽器中。您可以直觀地看到：哪一部分加載的時候，消耗的時間比較長。
注：
發現它還有一個重要功能，可以選擇 測試國家。 比如說，您的主要受眾是在歐洲。可以選擇歐洲的測試點，進行測試。
（來源：葉賽文）
以上內容屬作者個人觀點，不代表雨果網立場！本文經原作者授權轉載，轉載需經原作者授權同意。
