問某人是否希望自己的網(wǎng)站成為用戶友好的，你肯定會收到一個肯定的答案。其中的一個用戶友好的網(wǎng)站的方面是快速加載所有游客，不管設(shè)備他們使用的是在那個時候。不幸的是，任何人誰最近網(wǎng)上沖浪隨時隨地都有證明，快速載入的網(wǎng)站不一定是常態(tài)。今天的網(wǎng)站是大-太大了，其實。一…
問某人是否希望自己的網(wǎng)站成為用戶友好的，你肯定會收到一個肯定的答案。其中的一個用戶友好的網(wǎng)站的方面是快速加載所有游客，不管設(shè)備他們使用的是在那個時候。不幸的是，任何人誰最近網(wǎng)上沖浪隨時隨地都有證明，快速載入的網(wǎng)站不一定是常態(tài)。
今天的網(wǎng)站是大-太大了，其實。一個網(wǎng)站的平均規(guī)模現(xiàn)在超過2MB的重量在大小。相比之下，回到2012網(wǎng)站的規(guī)模平均為1MB，在當(dāng)時人們認(rèn)為這是一個巨大的交易，并在需要網(wǎng)站有縮小。然而，我們在這里4年之后，并相反的事情發(fā)生。
該頁面臃腫，我們今天看到的原因是多種多樣的 – 這是不正常的畫面，上增加額外重量的網(wǎng)頁腳本和框架，從社交網(wǎng)站重質(zhì)原料的依賴優(yōu)化的巨大圖像，更全部加起來造成大的頁面。
為了解決這個問題，網(wǎng)頁設(shè)計師需要做性能網(wǎng)站交付的核心組成部分。這是可以做到的一種方式是通過建立他們創(chuàng)建的位點的性能預(yù)算。
如同任何預(yù)算，績效預(yù)算決定多少可以在某些項目中度過。想想你建立你的家庭財務(wù)預(yù)算。這項預(yù)算可能將不得不為你的房租或抵押貸款，水電費，餐飲，娛樂，以及是否有其他費用行項目。你只能買得起這么多，所以你需要確定你的預(yù)算是如何被分解。你可以花更多的在一個地區(qū)，只要你削減開支，在其他方面，這樣，到最后，你留下你的預(yù)先確定的消費限額之內(nèi)。這同樣適用于網(wǎng)站和您建立對它們的性能預(yù)算如此。
一個網(wǎng)站的預(yù)算將包括組成這些頁面上的各種元素，包括HTML文件，CSS樣式表的圖像（這是最大的一個，占當(dāng)今網(wǎng)頁大小的65％以上），腳本，字體，以及更多。就像一個財務(wù)預(yù)算，必須通過建立自己的網(wǎng)站的大小整體限制開始。從那里，你可以向后工作，以確定有多少可以在單個項目中度過。
因此，有多少你能負(fù)擔(dān)得起在網(wǎng)頁上的文件大小“花”？作為一般規(guī)則，我盡量600K之間的所有頁面保持1MB大小的。該區(qū)間的較高端仍然是一個相當(dāng)大的有點下載，所以我的目標(biāo)顯然是要獲得一個頁面朝著該范圍的較低端 – 甚至更低！然而事實是，不是在一個網(wǎng)站的所有頁面將重量相同。某些頁面會比別人更重，所以我用這個范圍作為一個準(zhǔn)則。我一直試圖做一個網(wǎng)頁盡可能輕，但我也是在這一努力中的現(xiàn)實。
例如，在一個網(wǎng)站一個頁面，顯示的是一些基本的文本內(nèi)容，如“聯(lián)系我們”頁面，將是更容易下降擠壓到較低的范圍我不是一個產(chǎn)品頁的預(yù)算目標(biāo)，在電子商務(wù)網(wǎng)站。這是因為跟頁面不太可能有一些產(chǎn)品頁面將需要的頁面元素-這有助于建立一個大的頁面元素。為了最有效地顯示產(chǎn)品，它的頁面可能包含某種圖像畫廊。這不僅會需要若干圖像的下載，但該功能也可能使用一些JavaScript，將需要該網(wǎng)頁上加載。也可能有視頻或音頻內(nèi)容或必須送入頁面，就會出現(xiàn)功能碼方面動力的網(wǎng)站的購物車，等等。所有這些項目加起來比簡單的“聯(lián)系我們”更大的下載要求頁面會有。嘗試這兩種類型頁擠入相同的預(yù)設(shè)置文件的大小限制是愚蠢。你需要有你不會超過（再次，對我來說這是1MB甚至我最大的網(wǎng)頁）的臨界值，但你也必須是靈活和現(xiàn)實中的這些網(wǎng)頁的評估。
考慮到你的整體預(yù)算，你現(xiàn)在就可以開始打破這一預(yù)算分解成單個的項目。在您的網(wǎng)站的預(yù)算類別將包括：
與圖像開始，因為該類別將彌補大部分的網(wǎng)頁的體重，我試圖在這里分配一個頁面大小的60％左右。所以，如果我的目標(biāo)是600MB，我可以在圖像上“花”360MB。這是非?？尚械?，即使是網(wǎng)頁大特色，屏幕圖像跨越。當(dāng)然，這些圖像必須正確地優(yōu)化和壓縮為Web交付，并且會有時候，你必須做出一些必要的削減來實現(xiàn)這一目標(biāo)。由于頁面膨脹的最大貢獻(xiàn)者是太沉重的圖像，以接替在這里，你會過半實現(xiàn)你的整體頁面權(quán)重的目標(biāo)。
圖像后，接下來的兩個領(lǐng)域有可能吃進(jìn)您的預(yù)算大部分都是腳本和字體。如果你的網(wǎng)頁在很大程度上依賴于JavaScript，例如，如果它有社會化媒體的飼料或使用Javascript的沉重的框架，這絕對是一個因素。我的目標(biāo)是讓我的腳本下載到我的頁面權(quán)重或更小的約10％。
字體是下一個類別來考慮，并創(chuàng)建一個預(yù)算時，他們可以是一個具有挑戰(zhàn)性的組成部分。根據(jù)網(wǎng)頁字體加載的數(shù)量，以及有多大的個人文件，這是一個頁面組件，在尺寸方面變化真的。我通常的目標(biāo)是15％左右或更少我的網(wǎng)頁的權(quán)重的字體。最終，上使用的字體較大比例將需要一些別的地方削減，我們很快就會覆蓋。
最后，你必須衡量一個網(wǎng)頁的HTML和CSS，這兩者應(yīng)該是相當(dāng)渺茫，還有一個“其他”類別，其中包括我作為一個包羅萬象的段。在許多情況下，您的網(wǎng)站可能沒有任何屬于這個“其他”一節(jié)。對于HTML和CSS，我通常要找的頁面的重量任何地方從5％至15％。通常情況下，我的CSS文件會比HTML較大，但因為我的整個網(wǎng)站將使用一個CSS頁面，該文件將被緩存的游客，他們將其加載在第一頁之后。這將有助于他們在網(wǎng)站上瀏覽后續(xù)頁面的速度。
那么到底，這里是一個樣本預(yù)算：
為您打造您的網(wǎng)頁，你將要測試它的下載速度和總體性能。還有一些功能強大的工具，可在網(wǎng)上，可以幫助你測試你的網(wǎng)頁，并確定你可以進(jìn)行改進(jìn)，以幫助加快速度。許多這類工具將打破頁面的下載分成上面列出的類別，所以你可以看到你可能已經(jīng)在你的預(yù)算，并在那里的一些變化可能必須作出。這給我們帶來了我們的過程的“切割”階段。
如同任何預(yù)算，將有次，當(dāng)你超過你的號碼，你必須作出一些削減。在某些情況下，你可能會做出犧牲在一個區(qū)域，這樣就可以花更多的在另一個。例如，如果您的網(wǎng)站使用多個網(wǎng)頁字體，你可能會超過該類別你的目標(biāo)數(shù)字。您可以減少您正在使用的Web字體的數(shù)量和使用一些系統(tǒng)字體代替，也可以從其他線路在您的預(yù)算削減，以騰出文件大小使用的網(wǎng)站的排版。這里是你的選擇，你將不得不作出一個項目，通過項目這個決定，甚至是頁面逐頁，基礎(chǔ)。
有時候，你會削減對現(xiàn)有文件。這可能意味著壓縮和優(yōu)化的圖像，或者它可以與縮小的CSS或JavaScript文件以除去不必要的空白，這也將減小文件大小。
一旦你取得了你的削減，你可以重新測試你的網(wǎng)頁，看看有什么影響了。從那里，你將決定你是否都設(shè)置或是否需要額外的削減。再次，請記住，不是所有的頁面將重量是一樣的！我的主頁很可能要權(quán)衡比大多數(shù)網(wǎng)站其他頁面越多，這是確定。我們?nèi)匀豢赡軟Q定削減了該網(wǎng)頁的某些方面，比如動畫旋轉(zhuǎn)木馬，需要多個圖像和JavaScript文件進(jìn)行顯示（以我的經(jīng)驗，刪除網(wǎng)頁旋轉(zhuǎn)木馬是來顯著減少頁面的大小而不影響的最佳途徑之一該頁面的成功）。
最后，一旦你取得盡可能多的削減，您可以和減少了頁面文件的大小盡可能多的，你必須接受你的績效預(yù)算是一個指南，你必須在你如何遵循您的網(wǎng)站，指導(dǎo)現(xiàn)實。
一旦一個網(wǎng)站開始運行性能測試還沒有結(jié)束。被添加到該網(wǎng)站的隨著時間的推移將增加其文件大小和影響其性能，所以項目該網(wǎng)站必須繼續(xù)進(jìn)行評估和改進(jìn)通過其整個生命周期。正如你建立了績效預(yù)算為網(wǎng)站的發(fā)展，所以應(yīng)該在現(xiàn)場堅持這一預(yù)算在未來。任何時候都添加到頁面制作，測試應(yīng)該運行。此外，任何人負(fù)責(zé)更新網(wǎng)站使用一個CMS或其他工具應(yīng)了解該網(wǎng)站的績效目標(biāo)，并優(yōu)化和測試他們的工作流程的一部分。
咨詢電話
15050695302
13771112364
咨詢QQ
1309844028