網(wǎng)站的打開速度是一個(gè)非常重要的用戶體驗(yàn)考核標(biāo)準(zhǔn)，當(dāng)然，影響網(wǎng)站打開速度的原因有很多，比如服務(wù)器的問題，比如程序的問題等等，本文和大家主要分析的不是外部因素，主要是大家在網(wǎng)站設(shè)計(jì)過程當(dāng)中，把內(nèi)部因素做到極致，加快網(wǎng)站的打開速度就是這么簡(jiǎn)單!

一、如何判斷一個(gè)網(wǎng)頁(yè)的打開速度

1、網(wǎng)頁(yè)內(nèi)容的大小

搜索引擎優(yōu)化網(wǎng)頁(yè)打開的最佳 速度：2秒!網(wǎng)頁(yè)內(nèi)容所包括的文本、產(chǎn)品的圖片、視頻、Flash文件等。 我們有一個(gè)網(wǎng)頁(yè)訪問的時(shí)間計(jì)算公式：網(wǎng)頁(yè)打開時(shí)間=網(wǎng)頁(yè)內(nèi)容大小/最小帶寬+解析次數(shù)*每次解析時(shí)間+服務(wù)器處理時(shí)間+客戶端解析時(shí)間。用戶最滿意的打開網(wǎng)頁(yè)時(shí)間，是在2秒以下。用戶能夠忍受的最長(zhǎng)等待時(shí)間的中位數(shù)，在 6-8秒之間。這就是說，8秒是個(gè)臨界值，如果你的網(wǎng)站打開速度在8秒以上，那么很可能，大部分訪問者最終都會(huì)離你而去。

2、控制頁(yè)面的總規(guī)模

要想把網(wǎng)頁(yè)做得精彩，內(nèi)容必須豐富，但不要把所有的內(nèi)容都放在一個(gè)頁(yè)面上，應(yīng)控制頁(yè)面的總規(guī)模。首先統(tǒng)計(jì)頁(yè)面中的每個(gè)元素，如文字、圖像、ActiveX或Java代碼 以及HTML文本的大小，頁(yè)面容量最好在50K以下。

二、網(wǎng)頁(yè)設(shè)計(jì)優(yōu)化

網(wǎng)頁(yè)優(yōu)化是指在設(shè)計(jì)，使用網(wǎng)頁(yè)各元素時(shí)，能夠盡量減少網(wǎng)頁(yè)元素對(duì)下載速度所產(chǎn)生的影響。這些細(xì)節(jié)我們了解后，是能在日常網(wǎng)頁(yè)制作中可以進(jìn)行避免的。

1、讓網(wǎng)頁(yè)符合W3C標(biāo)準(zhǔn)

(1)在網(wǎng)頁(yè)制作中使 用結(jié)構(gòu)層同表現(xiàn)層完全分離。也就 是布局使用用CSS而不用TABLE。這樣做不僅能替換掉專業(yè)的表現(xiàn)層的垃圾代碼如標(biāo)簽。而且也能讓你的網(wǎng)站在重構(gòu)方而能夠輕松實(shí)現(xiàn)。幾年來的多項(xiàng)研宄已證實(shí)，如果對(duì)一個(gè)網(wǎng)站進(jìn)行重寫，使用DIV+CSS布局取代表格布局，那么可以砍掉原XHMTL文檔大小的一半。

(2)讓HTML標(biāo)記有始有終。不管是我們自己寫或是查看他人的HTML代碼時(shí)，會(huì)發(fā)現(xiàn)HTML代碼標(biāo)簽寫得不規(guī)范。有的標(biāo)記有頭無尾，如標(biāo)簽li，標(biāo)簽p。它并沒有妨礙代碼的正確執(zhí)行。但瀏覽器卻會(huì)花費(fèi)時(shí)間來判斷和計(jì)算段落或者列表項(xiàng)目在哪里結(jié)束。所以，我們一定要讓標(biāo)記有始有終，這樣做不僅使HTML代碼格式規(guī)范，更可以加速頁(yè)面的顯示速度。

2、優(yōu)化層疊樣式表

(1)層疊樣式表css是HTML的裝扮器，一個(gè)漂亮的Web頁(yè)面不可能沒有它。一般來說，我們要合并精減CSS代碼，移除無用多余代碼;圖片盡量不要使用CSS的濾鏡來渲染; CSS的選擇器盡量簡(jiǎn)單定義。

(2)HTML頁(yè)面中有多種引用CSS的方法，不同的方法導(dǎo)致的效率也不一樣。通常，我們可以將定義于 

3、優(yōu)化圖片

圖片可以說是影響網(wǎng)頁(yè)加載速度最大的因素，不管是使用圖片優(yōu)化工具，還是減小圖片大小。在質(zhì)量和文件大小之間必須找到一個(gè)合適的均衡點(diǎn)。主要有以下幾個(gè)需了解的方面。

（1）一般在網(wǎng)頁(yè)上使用的圖片格式有三種，jpg、png、gif。我們只 需要知道在什么時(shí)候應(yīng)該使用什么格式，以減少網(wǎng)頁(yè)的加載時(shí)間。

（2）圖片的使用顯示。需要顯示圖片時(shí)，盡量使用背景圖片，而不是直接加載。也需要注意的是盡量不要用一個(gè)很小的圖片當(dāng)背景，這樣做會(huì)加大客戶端CPU處理時(shí)間。比如說預(yù)載入下一頁(yè)的主要內(nèi)容時(shí)。在用戶看到大圖之前先把小圖展開，讓用戶不至于在等待的過程中太焦慮。

（3）圖片在HTML代碼里要標(biāo)明大小。這樣瀏覽器就能事先留好空。當(dāng)你在網(wǎng)頁(yè)上添加圖片或表格時(shí)，你應(yīng)該指定它們的高度和 度，也就是參數(shù)。如果瀏覽器沒有 找到height和width這兩個(gè)參數(shù)， 它需要一邊下載圖片一邊計(jì)算大小，如果圖片很多，瀏覽器需要不斷地調(diào)整頁(yè)面。這不但影響速度， 也影響瀏覽體驗(yàn)。

標(biāo)簽： 網(wǎng)站加載速度 代碼優(yōu)化 用戶體驗(yàn) 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請(qǐng)與原作者聯(lián)系。