文章內(nèi)容

提高網(wǎng)站打開速度的7大秘籍

發(fā)布時(shí)間: 2012/9/12 14:49:31

很多站長使用虛擬主機(jī)來做網(wǎng)站，網(wǎng)頁內(nèi)容一旦很多，網(wǎng)站打開速度就會特別慢，如果說服務(wù)器、帶寬、CDN這類硬指標(biāo)我們沒有經(jīng)濟(jì)實(shí)力去做，不妨通過網(wǎng)頁代碼優(yōu)化的方式來提高速度，盧松松總結(jié)了一些可行性的方法。1: 縮小Javascript和CSS文件如果你的網(wǎng)站大約有50-60%的用戶是第一次訪客，那么這些人會下載Javascript和CSS，如果這些文件很大瀏覽器會下載很長時(shí)間。使用壓縮工具可以減少Javascript和CSS盡一半的文件大小，如果你有信心使用“命令行”我強(qiáng)烈推薦使用雅虎的YUI壓縮，至少能提高40%到60%的壓縮率，如果你是在不懂可以用站長之家的CSS\JS壓縮工具。2：減少HTTP請求瀏覽器會花費(fèi)80%的時(shí)間獲取外部元件，包括腳本、樣式表、圖像等，只有20%的時(shí)間用來加載內(nèi)容，每個網(wǎng)站都會有許多HTTP請求，由于只有2個HTTP請求可以在同一時(shí)間傳送，所以請求一旦過多就會造成延遲。

通過Yslow可以看出我博客的HTTP請求數(shù)，可以看到JS、CSS和CSS引用的圖片文件過多，導(dǎo)致HTTP請求過多。3：緩存圖片、CSS和Javascript每當(dāng)一個新用戶訪問你的網(wǎng)站，圖片、CSS和Javascript應(yīng)該在其瀏覽器緩存，這樣他們下一次訪問就特別快。絕大多數(shù)windows主機(jī)已經(jīng)默認(rèn)啟用了，只需要在控制面板中設(shè)定過期時(shí)間和文件類型那個就可以了，我建議圖片、CSS和Javascript時(shí)間可設(shè)置為一個月。而對于Apache Web服務(wù)器，使用mod_cache模塊開啟緩存。:4：合并CSS引用圖片如圖一所示，很多網(wǎng)站的圖片都是切成小塊的，這樣下來就會有大量CSS引用圖片，如盧松松博客的CSS就引用了14張圖片，cssimages也是影響網(wǎng)站速度的一種重要因素。如果我們把CSS圖片合并成一個，14個HTTP請求變成1個，想想會是什么效果？它的原理就是通過CSS坐標(biāo)的方式取得圖片徑路，每個CSS標(biāo)簽引用不同坐標(biāo)就會得到不同圖片。我們看到很多網(wǎng)站的CSS圖片只有一張，用的就是這個原理。不懂也沒有關(guān)系，CSS圖片合并生成器這個網(wǎng)站能幫助你合并CSS圖片，并且能得到相應(yīng)代碼。5：只加載<head>部分的基本腳本這個最簡單，不花時(shí)間，點(diǎn)擊自己網(wǎng)站右鍵“查看源文件”找到<head>與</head>之間的區(qū)域，看看那些不重要好的JS文件，把它仍到頁面底部，也就是讓它最后加載�；蛘咧苯觿h除。例如盧松松博客引用的jiathis（社會化分享按鈕）和util.js（回頂部、寫評論快捷標(biāo)簽），讓它最后加載，這樣能提升內(nèi)容打開速度，而且它們也不太重要。6：對圖像進(jìn)行壓縮除非你加載視頻，那么影響網(wǎng)站速度罪魁禍?zhǔn)讘?yīng)該就是圖片了，如果是jpeg、png圖片，保證不失品質(zhì)的前提下，讓他們盡量壓縮，F(xiàn)ireworks軟件“導(dǎo)出向?qū)?rdquo;功能，它提供了一個很好的方式來預(yù)覽保存的圖像，讓圖片大小與質(zhì)量之間平衡，大多數(shù)其他圖像編輯軟件都有類似的功能。例如我的每篇博文配圖都用了“導(dǎo)出向?qū)?rdquo;功能，我盡量把圖片都壓縮在30K以內(nèi)，在一定程度上加快了瀏覽速度，但也有部分圖片失真，看不清楚。7：開啟gzip模塊gzip壓縮是非常流行的一種數(shù)據(jù)壓縮格式，一般網(wǎng)站啟用gzip后，壓縮率都會有70%-80%的提升，效果是立竿見影的。部分虛擬主機(jī)默認(rèn)有g(shù)zip功能，但大部分沒有，獨(dú)立主機(jī)、VPS一般可以設(shè)置，開啟gzip會加重服務(wù)器負(fù)擔(dān)，而且要修改服務(wù)器配置，強(qiáng)烈建議大家開啟gzip，如果不清楚可以問問所在空間商，讓他們幫忙開啟。

本文出自：億恩科技【www.yaz797.com】

服務(wù)器租用/服務(wù)器托管中國五強(qiáng)！虛擬主機(jī)域名注冊頂級提供商！15年品質(zhì)保障！--億恩科技[ENKJ.COM]