導(dǎo)語 一個好的網(wǎng)站是如何煉成的？在這個時代，每一個網(wǎng)站、甚至每一款產(chǎn)品都在打著“重視用戶體驗”的旗號 那么，用戶真實的想法到底如何呢？Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

 Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

別讓我等Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

曾有很多研究表明 用戶滿意的打開網(wǎng)頁時間是2-5秒，如果等待超過10秒，99%的用戶會關(guān)閉這個網(wǎng)頁 也許這樣講，各位還不會有太多感觸，接下來，我列舉一組數(shù)據(jù) Google網(wǎng)站訪問速度每慢400ms就導(dǎo)致用戶搜索請求下降0.59%;Amazon每增加100ms網(wǎng)站延遲將導(dǎo)致收入下降 1%;雅虎如果有400ms延遲會導(dǎo)致流量下降5-9%Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

怎么樣?現(xiàn)在感受如何?是不是該馬上去做測試工作呢Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

這時候你也許會問 什么原因會導(dǎo)致網(wǎng)站打開慢?有什么辦法解決呢?別急，我一一道來 以下內(nèi)容有些偏技術(shù)層面，各位需要耐心閱讀Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

1、減少HTTP請求數(shù)Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

用戶在打開一個網(wǎng)頁的時候，后臺程序響應(yīng)用戶所需的時間并不多，用戶等待的時間主要花費在下載網(wǎng)頁元素上了，即HTML、CSS、Javascript、Flash、圖片等，統(tǒng)計顯示，每增加一個元素，網(wǎng)頁載入的時間就增加25-40毫秒(取決于用戶的帶寬情況)Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

所以，想要提高網(wǎng)頁打開速度，就要減少HTTP請求數(shù)，方法有3種Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

1)減少不必要的HTTP請求，例如用CSS圓角代替圓角圖片，減少圖片的使用Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

2)合并文件，對于文本文件，可以直接合并內(nèi)容 例如將多個JS(Javascript的簡稱)文件合并成一個，將多個CSS文件合并成一個Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

3)優(yōu)化緩存，對于沒有變化的網(wǎng)頁元素(如頁頭、頁尾等)，用戶再次訪問的時候沒有必要重新下載，直接從瀏覽器緩存里讀取就可以了Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

2、使用CDN(Content Delivery Network，內(nèi)容分發(fā)網(wǎng)絡(luò))Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

CDN由一系列分散到各個不同地理位置上的Web服務(wù)器組成，它根據(jù)和用戶在網(wǎng)絡(luò)上的靠近程度來指定某臺服務(wù)器響應(yīng)用戶的請求 當(dāng)你的網(wǎng)站圖片很多事，就一樣要使用CDN了，比如現(xiàn)在的電商網(wǎng)站，幾乎都在使用CDNSa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

3、壓縮網(wǎng)頁元素Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

網(wǎng)頁中的每個元素越小，下載所需的時間就越少，這個很好理解 現(xiàn)在比較成熟和流程的壓縮網(wǎng)頁的方式，是通過Gzip，我自己的實操經(jīng)驗來看，一般可以將網(wǎng)頁文本內(nèi)容減少70%以上Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

4、樣式表放在網(wǎng)頁Head部分Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

這也是我實際操作過的案例，把樣式表(CSS文件)移到網(wǎng)頁的Head部分，可以提高頁面的加載速度，讓頁面元素順序顯示Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

5、把JS文件放到網(wǎng)頁底部Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

網(wǎng)頁打開時，所有元素是順序顯示的 由于JS文件的特殊性，其相比其他元素來說，會加載的很慢，在JS文件下載完成之前，其他后面元素的順序顯示將被阻塞，因此把JS文件盡量放在底部，意味著內(nèi)容能被快速顯示Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

6、把樣式表和JS腳本放到外部文件中Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

盡管將樣式表和JS腳本直接寫入網(wǎng)頁HTML中，可以減少外部文件調(diào)用數(shù)量，但是，這樣做會增加網(wǎng)頁的文件大小 綜合來看，將樣式表和JS腳本放到外部文件中，也許用戶首次訪問時會有點慢，但是后續(xù)在訪問網(wǎng)站時，用戶直接通過瀏覽器緩存就可以用，從而達(dá)到減少HTTP請求數(shù)的目的，為優(yōu)的做法Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

寫在后的話 Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

在提升網(wǎng)頁打開速度經(jīng)常被忽視的一個問題是響應(yīng) 對于用戶來說，每次的操作，不管返回結(jié)果是慢，還是快，都要及時予以響應(yīng)，典型的例子就是 當(dāng)用戶點擊打開一張圖片時，是否有百分比數(shù)字顯示的進度條，就是一個典型的響應(yīng)設(shè)計Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

一流的網(wǎng)站用戶體驗絕對不是一蹴而就的，要進行充分的可用性測試，收集用戶的反饋，持續(xù)改進Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

別讓我想Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

用戶不會使用一個網(wǎng)站絕對不是用戶的錯，他會打開電腦，會使用鍵盤和鼠標(biāo)，會打開瀏覽器上網(wǎng)，經(jīng)過這么步驟終到達(dá)了你的網(wǎng)站，然后發(fā)現(xiàn)網(wǎng)站上一團糟，搞不懂這是什么，那是什么，也懶得學(xué)習(xí)如何使用，于是就會眼都不眨一下就關(guān)閉你的網(wǎng)站 這是很現(xiàn)實的一個用戶行為Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

在網(wǎng)站能夠快速觸達(dá)用戶之后，網(wǎng)站運營人員面臨的下一個重要問題就是 如何留住用戶?Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)

Sa2北京網(wǎng)站設(shè)計開發(fā),小程序開發(fā),公眾號,微信開發(fā)-云智互聯(lián)