龍崗公司

    如何優化讓網站打開速度更快

    日期:2017/4/26 人氣:260970
    導讀: 前段時間,常常有人跟我說起為何有的網站翻開速度會很慢,等它加載完畢需要一分鐘左右,而有的翻開速度很快,刷的一下就出來了。在相同的帶寬下為何會出現這種景象呢?這與你的網站的服務器、網站主頁的體積等有很大聯絡。  一、優化圖像  幾乎沒有哪個頁面上是沒有圖像的。假設你經歷過56K貓的時代,你一定不會很喜歡有很多圖像的網站。因為加載那樣一個頁面會花費很多的時間。即使在現在,網絡帶寬有了很多的前進,56K

    前段時間,常常有人跟我說起為何有的網站翻開速度會很慢,等它加載完畢需要一分鐘左右,而有的翻開速度很快,刷的一下就出來了。在相同的帶寬下為何會出現這種景象呢?這與你的網站的服務器、網站主頁的體積等有很大聯絡。

      一、優化圖像

      幾乎沒有哪個頁面上是沒有圖像的。假設你經歷過56K貓的時代,你一定不會很喜歡有很多圖像的網站。因為加載那樣一個頁面會花費很多的時間。即使在現在,網絡帶寬有了很多的前進,56K貓逐漸淡

      出,優化圖像以加速頁面速度還是很有必要的。優化圖像包括減少圖像數、降低圖像質量、運用恰當的格式。

      1、減少圖像數:去掉不必要的圖像。

      2、降低圖像質量:假設不是很必要,檢驗降低圖像的質量,尤其是jpg格式,降低5%的質量看起來改動不是很大,但文件大小的改動是比照大的。

      3、運用恰當的格式:請參閱下一點。

      因此,在上載圖像之前,你需要對圖像進行修改,假設你覺得photoshop太費事,可以試試一些在線圖像修改東西。懶得修改而又想圖像有特其他效果?可以試試用過調用javascript來完結圖像特效。

      二、圖像格式的選擇

      通常在頁面上運用的圖像格式有三種,jpg、png、gif。三種格式的具體技術指標不是這篇文章評論的內容,我們只需要知道在啥時分應當運用啥格式,以減少頁面的加載時間。

      1、JPG:通常用于展示景色、人物、藝術照的拍攝著作。有時也用在電腦截屏上。

      2、GIF:供應的顏色較少,可用在一些對顏色央求不高的本地,比如網站logo、按鈕、表情等等。當然,gif的一個首要的應用是動畫圖像。就像用Lunapic制作的反照圖像。

      3、PNG:PNG格式能供應通明布景,是一種專為頁面展示而創造的圖像格式。通常用于需要布景通明閃現或對圖像質量央求較高的頁面上。

      三、優化CSS

      CSS疊層樣式表讓頁面加載起來更高效,閱覽領會也得到前進。有了CSS,表格計劃的方法可以退休了。

      但有時我們在寫CSS的時分會運用了一些比照羅嗦的句子,比如這句:margin-top: 10px; margin-right: 20px;margin-bottom: 10px;margin-left: 20px;你可以將它簡化為:margin: 10px 20px 10px

      20px;

      又或者這句:A paragraph of decorated text

      Second paragraph

      Third paragraph

      Forth paragraph

      可以用div來包括:

      A paragraph of decorated text

      Second paragraph

      Third paragraph

      Forth paragraph

      簡化CSS能去掉冗余的特點,前進工作功率。假設你寫好CSS后懶得去做簡化,你可以運用一些在線的簡化CSS東西,比如CleanCSS。

      四、網址后加斜杠

      有些網址,比如www.yizhannet.com/dnbc,當服務器收到這么一個地址央求的時分,它需要花費時間去判定這個地址的文件類型。假設sucai是一個目錄,無妨在網址后多加一個斜杠,讓其成為www.yizhannet.com/dnbc/,這么服務器就能一望而知地知道要訪問該目錄下的index或default文件,然后節省了加載時間。

      五、標明高度和寬度

      這點很首要,但很多人因為懶散或其它要素,老是將其疏忽。當你在頁面上增加圖像或表格時,你應當指定它們的高度和寬度,也便是height和width參數。假設閱覽器沒有找到這兩個參數,它需要一邊下載圖像一邊核算大小,假設圖像很多,閱覽器需要不斷地調整頁面。這不光影響速度,也影響閱覽領會。

      下面是一個比照友愛的圖像代碼:alt="moon image" /> 當閱覽器知道了高度和寬度參數后,即使圖像暫時無法閃現,頁面上也會騰出圖像的空位,然后持續加載后邊的內容。然后加載時間立刻,閱覽領會也更好了。

      六、減少http央求

      當閱覽者翻開某個頁面,閱覽器會宣布很多方針央求(圖像、腳本等等),視乎網絡延時情況,每個方針加載都會有所推延。假設頁面上方針很多,這可以需要花費很多的時間。

      因此,要為http央求減負。怎么減負?

      1、去掉一些不必要的方針。

      2、將挨近的兩張圖像構成一張。

      3、吞并CSS 。

      七、其它小竅門

      1、去掉不必要加載項。

      2、假設在頁面上嵌入了其它網站的widget,假設有選擇境地,一定要選擇速度快的。

      3、盡量用圖像代替flash,這對SEO也有優點。

      4、有些內容可以靜態化就將其靜態化,以減少服務器的負擔。

      5、核算代碼放在頁尾。

      我們在閱覽過程中,發現頁面翻開的速度不是很抱負,當然一個要素是服務器不穩定以及網絡速度較慢,另一個首要要素是我們在編列計劃時運用了大表格,雖然這么比照利于計劃,但是不利于頁面的翻開速度。對此,總結了一些切實可行的方法,這么在擬制作頁面時,可以令你的頁面翻開速度大大前進。

      一、不要將悉數頁面內容放到一個Table中

      在頁面計劃過程中,將悉數頁面用一個表格劃分為如下的形狀:

      這么,頭部導航,底部版權信息、聯絡方法,左邊導航友誼銜接都可以通過文件包括到頁面中,頁面計劃便當,也減少了相同頁面的重復制作,并且能做到一改全改,十分便當。但是,這種網站的

      閃現速度是必定慢的。因為Table要等里邊悉數的內容都加載完畢后才閃現出來的,假設某些內容無法訪問,就會推延悉數頁面的訪問速度。

      這個疑問其實在我們上WEB開發的課上,教師現已提到過,精確的做法是:將內容分割到幾個具有相同格式的Table中去,不要全都放到一個Table里。

      二、盡量運用靜態HTML頁面

      盡人皆知,ASP、PHP、JSP等程序完結了頁面信息的動態交互,工作起來確實十分便當,因為它們的數據交互性好,能很便本地存取、更改數據庫的內容,使網站“動”起來,如:論壇、留言板等。

      但是這類程序有必要先由服務器履行處理后,生成HTML頁面,然后再“送”往客戶端閱覽,這就不得不耗費一定的服務器資本。過多地運用這類程序,頁面閃現速度必定會慢,所以盡量運用靜態的HTML頁

      面。

      我們制作的網站,首要是向用戶供應信息,不需要和用戶很多交流,所以我們首要是選用靜態頁面。只要在進行文件包括時選用了后綴名為.shtnl的頁面。

      三、頁面盡量精簡

      我們閱覽頁面實際上是將服務器上的頁面內容下載到本地硬盤,再用閱覽器解說查看的。下載頁面的快慢在閃現速度上占了很大比重,所以,頁面本身所占的空間越小,那么閱覽速度就會越快。

      這就央求在做頁面的時分遵照悉數從簡的原則,如:刪去無用代碼,不要運用太大的Flash動畫、圖像格式盡量運用.gif等等。

      可以檢驗運用gif和Jpeg交互格式的圖象,因為交互格式的圖像是分級閃現出來的--首先以很低的分辨率閃現,然后逐漸前進分辨率,直至終究抵達正常閃現--這種方法有時分會使較大的圖像看起來好象

      裝載得快一些,實際上并非如此,但這是一種有益的幻覺。這么也便于讀者在圖像裝載的過程中看到它的容貌,假設他們不喜歡或不想看的話就有時機中止傳輸或轉向其他本地。

      四、留心友誼銜接

      網站之間相互做銜接可以增加網站的宣傳效果,一起也便當了網站的訪問者。一種方法是做LOGO圖像銜接,這么更能精確地描寫網站的主題和定位,宣傳效果會大大的增強,但圖像銜接做得太多,

      必然會影響頁面的閃現速度。

      所以,做友誼銜接時應盡量考慮做以下幾點:

      1、多做文字銜接:做文字銜接是不會推延頁面速度的。

      2、假設友誼銜接一定要呈現在主頁,請將銜接地址的悉數Table放到頁面的最下方,因為頁面是由上到下逐行閃現的,將其放到頁面的最下方,不會推延其他內容的閃現。

    文本來自采集文章 http://www.jreqjj.icu/25/185.html 如需轉載或刪除,請聯系管理員。

    1 2 3 4 5 6 7 8 9
    分享到:
龍崗網站建設
【龍崗本地網絡公司】——承諾3小時內上門服務!龍崗上門全國熱線:400-666-2014 粵ICP備12018349號 網站維護:深一深圳網站建設 【我要收藏此頁面】 網站地圖
全國龍崗注冊公司-服務網店
微信里卖什么最赚钱