每個(gè)進(jìn)行網(wǎng)站設(shè)計(jì)的人總是提出與網(wǎng)站速度有關(guān)的問(wèn)題?？焖偌虞d的網(wǎng)站瀏覽起來(lái)更有趣，它們?yōu)槠胀ㄔL問(wèn)者提供了更好的整體體驗(yàn)。

本文設(shè)計(jì)將介紹網(wǎng)站設(shè)計(jì)的標(biāo)準(zhǔn)措施，以幫助您的網(wǎng)站更快地加載而不是爬網(wǎng)速度，以及如何改進(jìn)它的技巧。

1) 發(fā)出小的 HTTP 請(qǐng)求

減少頁(yè)面上的組件數(shù)量會(huì)減少創(chuàng)建或翻頁(yè)所需的 HTTP 請(qǐng)求數(shù)量，從而加快頁(yè)面加載速度。減少組件數(shù)量的一些有效方法包括：

合并文件，

將多個(gè)腳本合并為一個(gè)腳本，

將多個(gè) CSS 文件合并到一個(gè)樣式表中，以及

使用 CSS Sprites 和圖像映射。

2) 盡早根除緩沖區(qū)

通常，當(dāng)服務(wù)器完成對(duì) HTML 輸出的處理時(shí)，您會(huì)獲得 HTTP 請(qǐng)求的結(jié)果。因此，延遲會(huì)根據(jù)服務(wù)器準(zhǔn)備請(qǐng)求的 HTML 頁(yè)面的時(shí)間而有所不同。有一種按需方法可以獲取當(dāng)時(shí)準(zhǔn)備好的內(nèi)容，即flush。在 PHP 中，您有一個(gè) color() 函數(shù)，它發(fā)送瀏覽器的部分就緒 HTML 輸出。

思考沖洗的好地方就在 HEAD 之后。

3) 將 CSS 調(diào)用放在頁(yè)面頂部

將樣式表移動(dòng)到文檔 HEAD 元素支持更快地輸出頁(yè)面，因?yàn)檫@使頁(yè)面可以輕松工作。

4）將JS放在頁(yè)面底部

JavaScript 腳本可以很好地阻止網(wǎng)頁(yè)設(shè)計(jì)中的并行下載；下載腳本時(shí)，瀏覽器不會(huì)開(kāi)始任何其他下載。為了幫助更快地加載頁(yè)面，如果可以延遲，請(qǐng)將手移到頁(yè)面底部。

5）避免空的Href或Src

遇到空的圖片 src 時(shí)，您可能會(huì)發(fā)現(xiàn)瀏覽器什么也不做。但是，在大多數(shù)瀏覽器中，這是不可能的。IE 生成對(duì)頁(yè)面目錄的請(qǐng)求；Chrome、Firefox 3、Safari 等。這種行為可能會(huì)破壞用戶(hù)數(shù)據(jù)，浪費(fèi)服務(wù)器計(jì)算周期，并創(chuàng)建一個(gè)永遠(yuǎn)不會(huì)被查看的頁(yè)面。在最令人困惑的情況下，通過(guò)提供大量意外流量來(lái)削弱您的服務(wù)器。

6) 添加過(guò)期標(biāo)題

網(wǎng)頁(yè)越來(lái)越復(fù)雜，包含更多的腳本、樣式表、圖像和 Flash。首次訪問(wèn)頁(yè)面可能需要多個(gè) HTTP 請(qǐng)求來(lái)加載所有組件。使用 Expires 標(biāo)頭，這些組件變得可緩存，避免在后續(xù)頁(yè)面視圖中使用過(guò)多的 HTTP 請(qǐng)求。過(guò)期標(biāo)頭最常與圖像相關(guān)聯(lián)。不過(guò)，它們可以而且應(yīng)該用于所有頁(yè)面組件，包括腳本、樣式表和 Flash。

7) 避免 CSS 表達(dá)式

CSS 表達(dá)式是一種在網(wǎng)頁(yè)設(shè)計(jì)中動(dòng)態(tài)設(shè)置 CSS 屬性的強(qiáng)大方法。這些表達(dá)式經(jīng)常被考慮：

當(dāng)頁(yè)面調(diào)整大小時(shí)，

當(dāng)頁(yè)面被下拉時(shí)，

當(dāng)用戶(hù)在頁(yè)面上滾動(dòng)鼠標(biāo)時(shí)。

這些頻繁的評(píng)估降低了用戶(hù)體驗(yàn)。

8) CSS 和 JS 元素不應(yīng)該包含在 HTML 頁(yè)面中，并且應(yīng)該有單獨(dú)的頁(yè)面

通常，通過(guò)使用外部 JavaScript 和 CSS 文件，您可以輕松地生成更快的頁(yè)面，因?yàn)槲募粸g覽器緩存。每次請(qǐng)求 HTML 文檔時(shí)，都會(huì)下載嵌入在 HTML 文檔中的 JavaScript 和 CSS。這會(huì)減少 HTTP 請(qǐng)求的數(shù)量，但會(huì)增加 HTML 文檔的大小。

另一方面，如果 JavaScript 和 CSS 位于瀏覽器緩存的外部文件中，則 HTML 文檔大小會(huì)減小，而不會(huì)增加 HTTP 請(qǐng)求的數(shù)量。

9) 減少 DNS 查找

域名系統(tǒng) (DNS) 將網(wǎng)站名稱(chēng)放入 IP 地址以訪問(wèn)這些網(wǎng)站。就像郵政局長(zhǎng)如何使用您提供的地址來(lái)識(shí)別您的房子一樣。瀏覽器聯(lián)系一個(gè) DNS 解析器，該解析器返回服務(wù)器的 IP 地址。DNS通常有價(jià)格；查找 IP 地址需要 20 到 120 毫秒。

10) 盡可能使用內(nèi)部域/IP

程序員在編寫(xiě)代碼時(shí)總是使用站點(diǎn)名稱(chēng)來(lái)為郵件或其他任何東西設(shè)置新的出站連接。情況不應(yīng)該如此。您應(yīng)該在可訪問(wèn)時(shí)使用 IP 或內(nèi)部域。

例如，如果您想通過(guò) SMTP 發(fā)送電子郵件，請(qǐng)將 \"localhost\" 寫(xiě)為 SMTP 主機(jī)；郵件服務(wù)器存在于 Web 服務(wù)器所在的同一物理服務(wù)器上。假設(shè)郵件服務(wù)器托管在內(nèi)部網(wǎng)絡(luò)中的遠(yuǎn)程機(jī)器上。在這種情況下，您需要提及指向郵件服務(wù)器的內(nèi)部（私有）IP 的域名，而不是指向公共 IP 的域名。

11) 刪除舊的或不需要的頁(yè)面

如果程序員對(duì)文件進(jìn)行大量更改，他們通常更喜歡將舊頁(yè)面的副本保留為“page.old”。確保在網(wǎng)站在線(xiàn)發(fā)布之前刪除這些舊文件。盡管網(wǎng)絡(luò)服務(wù)器上有舊的或不受歡迎的頁(yè)面可能不會(huì)直接影響網(wǎng)站的性能，但它們可能會(huì)間接影響它?？赡軙?huì)忘記更新某些文件中的頁(yè)面更改。這些文件仍然會(huì)調(diào)用舊頁(yè)面，從而導(dǎo)致各種問(wèn)題，而不僅僅是與性能相關(guān)的問(wèn)題。

12）從所有頁(yè)面中刪除重復(fù)條目

有時(shí)，程序員會(huì)無(wú)意中將相同的代碼放在文件的不同位置。在發(fā)布網(wǎng)站之前，檢查代碼并找出是否有任何代碼重復(fù)出現(xiàn)并在發(fā)現(xiàn)時(shí)將其刪除是很重要的。

13) 確保沒(méi)有額外的不存在頁(yè)面導(dǎo)致 404 錯(cuò)誤

發(fā)出 HTTP 請(qǐng)求并收到 404（未找到）錯(cuò)誤的成本更高，并且會(huì)降低用戶(hù)體驗(yàn)。

14) 不要在 HTML 中縮放圖像

Web 設(shè)計(jì)人員有時(shí)通過(guò)使用 HTML 圖像元素的寬度和高度特性來(lái)設(shè)置圖像大小。避免這樣做，因?yàn)樗赡軙?huì)導(dǎo)致比需要更多值得注意的圖像。例如，假設(shè)您的頁(yè)面需要尺寸為 240X720 的圖像，但使用寬度和高度屬性以尺寸 120X360 顯示它。在這種情況下，瀏覽器將下載比所需范圍更廣的圖像。

15) 有一個(gè)自定義的 404 頁(yè)面

設(shè)置一個(gè)自定義的 404 頁(yè)面來(lái)幫助用戶(hù)找到“未找到”頁(yè)面，最好是一個(gè)搜索按鈕。

設(shè)計(jì)是深圳最好的公司之一深圳的網(wǎng)頁(yè)設(shè)計(jì). 獲取最有效的網(wǎng)頁(yè)設(shè)計(jì)服務(wù)，以制作更快、更用戶(hù)友好的網(wǎng)站。