如何才能精簡企業(yè)網站頁面大小

2022-08-04 分類：網站建設

怎樣才能才企業(yè)網站的“網頁減肥”，使之能有效的加快網頁加載速度。

1、用GZIP格式壓縮

gzip是GNUzip的縮寫，它是一個GNU自由軟件的文件壓縮程序。它是Jean-loupGailly和MarkAdler一起開發(fā)的，第一次公開發(fā)布版本是1992年10月31日發(fā)布的版本0.1，1993年2月發(fā)布了版本1.0。

我們在Linux中經常會用到后綴為.gz的文件，它們就是GZIP格式的，現(xiàn)今已經成為Internet上使用非常普遍的一種數(shù)據(jù)壓縮格式，或者說一種文件格式。

HTTP協(xié)議上的GZIP編碼是一種用來改進WEB應用程序性能的技術，大流量的WEB站點常常使用GZIP壓縮技術來讓用戶感受更快的速度。

這一般是指WWW服務器中安裝的一個功能，當有人來訪問這個服務器中的網站時，服務器中的這個功能就將網頁內容壓縮后傳輸?shù)絹碓L的電腦瀏覽器中顯示出來。

一般對純文本內容可壓縮到原大小的40%，這樣傳輸就快了，效果就是你點擊網址后會很快的顯示出來，當然這也會增加服務器的負載，一般服務器中都安裝有這個功能模塊的。

根據(jù)W3C組織調查，大部分的網站都沒有啟用壓縮功能。

2、支持瀏覽器緩存

如果瀏覽器支持緩存，我們就不用重復下載網頁資源，最簡單的設置緩存方法是在響應頭中添加相應的內容，包括：Expires header，Last-Modified等。

你可以可以通過配置服務器來自動添加這些屬性，比如你在Apache服務器中配置緩存所有的照片一個月:

3、使用內容分發(fā)網絡 (CDN)

CDN的全稱是Content Delivery Network，即內容分發(fā)網絡。其目的是通過在現(xiàn)有的Internet中增加一層新的網絡架構，將網站的內容發(fā)布到最接近用戶的網絡“邊緣”，使用戶可以就近取得所需的內容，提高用戶訪問網站的響應速度。

CDN有別于鏡像，因為它比鏡像更智能，或者可以做這樣一個比喻：CDN=更智能的鏡像+緩存+流量導流。

因而，CDN可以明顯提高Internet網絡中信息流動的效率，從技術上全面解決由于網絡帶寬小、用戶訪問量大、網點分布不均等問題，提高用戶訪問網站的響應速度。

為更好地理解CDN，讓我們看一下CDN的工作流程，當用戶訪問已經加入CDN服務的網站時，首先通過DNS重定向技術確定最接近用戶的好CDN節(jié)點，同時將用戶的請求指向該節(jié)點。

當用戶的請求到達指定節(jié)點時，CDN的服務器（節(jié)點上的高速緩存）負責將用戶請求的內容提供給用戶。

具體流程為: 用戶在自己的瀏覽器中輸入要訪問的網站的域名，瀏覽器向本地DNS請求對該域名的解析，本地DNS將請求發(fā)到網站的主DNS，主DNS根據(jù)一系列的策略確定當時最適當?shù)腃DN節(jié)點，并將解析的結果（IP地址）發(fā)給用戶，用戶向給定的CDN節(jié)點請求相——應網站的內容。

以上三個方法可以有效地加快頁面的訪問速度，現(xiàn)在我們將對你的代碼進行診斷，幫助我們給頁面減肥。

4、刪除不需要的資源

當你不再需要一個組件的時候，你應該刪掉它的CSS和JavaScript代碼，如果這些代碼都單獨放在一個文件中，那刪掉它們也不是難事，但如果已經沒有用的代碼和其它代碼在一個文件中，那你肯定要費不少精力去刪掉它們。

這個時候你就需要使用第三方的工具來幫你一鍵解決，比如JSLint，Dust-Me Selectors，CSS Usage或是像grunt-uncss一樣的構建工具。

5、style和font重復定義的沉余代碼

要充分利用好CSS代碼定義自己的顏色大小等，有些網站既用了CSS代碼定義了之后又去使用style或者是font這樣的代碼進行定義，這樣就無形中增加了無用代碼，容易造成代碼冗余，因此我們要對這樣的代碼進行壓縮，實現(xiàn)代碼精簡。

6、通用和最小化CSS

理想情況下，需要一個單獨的CSS文件，讓每個頁面都調用這一個布局，當然，如果你想要支持老版本的IE，你就得多弄一個CSS文件。

另外，我還要提醒大家一點：當你把它們構建到服務器上之前，你應該把代碼間所有不必要的格式都刪掉。

有很多預處理工具都可以幫你解決這件麻煩事，比如Sass，LESS和Stylus。

有一些方法可以幫助你直接合并多個CSS文件，在Windows上：

copy file1.css+file2.css file.css

在Mac或Linux上：

cat file1.css file2.css > file.css

你可以把得到的CSS文件再經過在線的CSS壓縮工具刪除格式化。

最后，在head標簽中加載所有的CSS，這樣瀏覽器就知道你的頁面樣式不用多次重繪了。

7、通用和最小化的JavaScript

利用外部文件，我們可以用Javascript代碼和CSS代碼放在外部文件里面，在我們的HTML代碼里面加上調用代碼進行調用即可，如果打開一個網站去檢查它的源文件，前面如果有大量的Javascript代碼和CSS代碼就容易使得網站有用的內容文字部分推到后面去了，是不利于搜索引擎抓取的。

據(jù)我博客收集的數(shù)據(jù)顯示：平均每個頁面加載了18個javascript文件，雖然把像jQuery這樣的庫文件單獨分開非常實用，但是你自己的JavaScript代碼應該保持通用和最小化。

同樣很多第三方的工具可以幫你解決這樣事情，比如YUI Compressor，Closure Compiler和我最喜歡用的The JavaScript CompressorRater，簡化的JavaScript代碼會加快網頁的訪問速度，減少HTTP請求次數(shù)。

最后，好在HTML的body標簽后放置JavaScript引用代碼，這樣能保證JavaScript代碼不影響到其它內容的加載。

8、減少頁面嵌套的表格

對于表格要盡量少使用，尤其是嵌套的表格部分，雖然CSS排版使得我們編寫代碼更加的精簡容易，但往往也是少不了表格的使用的，我們可以不去避免，但一定要減少使用多層嵌套的表格，不要產生沒有用的代碼。

9、網站圖片的優(yōu)化

對于一些圖片站來說，加載錯誤的圖片格式會對你的網頁造成很大影響，所以，我建議圖片站的站長一定要多對圖片做些優(yōu)化。

（1）、圖片優(yōu)化原則

一般來說選取圖片我們應用遵循如下原則：

①、照片使用JPG格式。

②、其它所有的圖片都使用PNG格式。

（2）、調整大圖的大小

目前智能機所拍出的照片越來越大，你不可能把原照片直接展示在頁面中，普通的編輯器都會直接上傳原圖，這樣會讓頁面的加載速度慢到另一個級別，在正常的照片處理中，一般都沒有必要給用戶高質量的圖片展示，所以，你需要一個自動調整圖片大小的工具。

需要注意的是，圖片的尺寸是不能超過容量的大小的，這樣一來頁面加載了全圖，卻無法展示出來，現(xiàn)在照片的尺寸基本上都超過電腦顯示屏的尺寸了。

圖片的大小在網頁總大小中占很大的比重，圖片減小50%會導致整體頁面大小減少75%，所以你應該認真解決一下圖片的加載。

（3）、進一步壓縮圖片

僅僅調優(yōu)圖片的大小是不夠的，你應該通過第三方工具對圖片進行分析，進一步壓縮圖片。

比較好用的工具有OptiPNG，PNGOUT，jpegtran和jpegoptim，這些工具大都能安裝成獨立的工具或是整合到開發(fā)過程中，另外像Smush這樣的工具，還可以直接在云端處理。

10、刪除不必要的字體和注釋

Web fonts已經徹底改變了字體的設計，它減少了很多不必要的文本，然而，目前的字體仍然會給你的網頁帶來多余的字節(jié)。

如果你使用超過兩種字體，這就已經開始對性能造成影響了。

網頁代碼盡量少用注釋，我們知道一段程序里面加上注釋能夠便于我們快速找到和理解具體代碼對應的功能，對于編程人員修改網頁是有幫助的，但是這樣的代碼對于搜索引擎來說是沒有任何的意義的，只能說是噪聲，因此我們要減少網頁代碼里面出現(xiàn)的注釋部分。

我相信大部分網站都可以通過以上的優(yōu)化減小大概30%-50%的重量，但是身為一個好主義的開發(fā)者這是遠遠不夠的，我們在接下來的系列文章中會繼續(xù)對網站瘦身進行深入研究。

文章標題：如何才能精簡企業(yè)網站頁面大小
標題網址：http://aaarwkj.com/news26/184926.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供服務器托管、網站設計公司、網站收錄、ChatGPT、定制開發(fā)、外貿建站

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內容

設計網頁公司應該如何推動成都企業(yè)發(fā)展？ 2022-08-04
香港空間+獨立ip要多少錢 2022-08-04
通過網絡整合營銷做品牌推廣需要什么 2022-08-04
為什么說注冊老域名并不一定好？ 2022-08-04
張禹喬: 網絡整合營銷公司怎么做 2022-08-04
建設網站過程中有哪些常見的服務內容 2022-08-04
除了IDC，80%的人可能都不知道還有其它幾類數(shù)據(jù)中心 2022-08-04
新域名新站被無故降權該怎么解決呢？ 2022-08-04
網站優(yōu)化必知：網站鏈接的優(yōu)化技巧！ 2022-08-04

欧美一级特黄大片做受成人-亚洲成人一区二区电影-激情熟女一区二区三区-日韩专区欧美专区国产专区

如何才能精簡企業(yè)網站頁面大小