2022-05-21 分類: 網站設計
你可能在想,網站速度有什么大驚小怪?平均網頁加載速度有什么重要?據Aberdeen Group介紹,頁面加載時間延遲1秒,結果如下:
? 頁面瀏覽量減少11%
? 客戶滿意度下降16%
? 轉化次數減少7%
亞馬遜報告,網站速度每100毫秒改善,而沃爾瑪則增加了1%的收益,同時發現每一個頁面速度每增加一秒就會增加2%的轉化。
您的網站的速度還會影響您的自然搜索排名,因為Google 自2010年以來已將網站速度作為其排名算法的信號。基本上,您的網頁加載速度非常重要,并確定您是否將在SERP中排名。
以下是通過修改您的網站設計立即提高網頁速度的 6種簡單但非常有效的方式:
#1優化圖像和延遲加載的所有內容
網絡上的一些最常見的占帶寬的便是圖像。根據HTTP存檔,圖像現在占頁面權重的63%。“截至2015年5月,平均網頁超過了2 MB的標記。這幾乎是三年前平均頁面大小的兩倍。
“圖表顯示了消耗最多千字節的細目。實際上所有的資產類型都在增長,最顯著的是圖像。
當創建內容時,有些人會使用大圖像,然后使用CSS來縮放它們。然而,他們不知道,瀏覽器仍然以全尺寸加載它們。例如,如果將800 x 800的圖像縮小到80 x 80,瀏覽器將加載十倍以上。
優化圖像的好方法是將其壓縮成更小的尺寸,同時保持質量。使用諸如TinyJPG和Compressor.io之類的工具,或諸如WP Smush It(WordPress)和Imgen(Joomla)之類的CMS插件來壓縮圖像將保證您的網站加載速度更快,從而為網站訪問者提供更好的體驗并提高轉化率。
另一種選擇是“延遲加載”圖像和網頁內容。實質上,您可以使用一些JavaScript來查找哪些圖像位于或靠近視口,并且僅下載用戶可能會看到的圖像。
根據Stackpath總結的延遲加載的好處包括:
延遲加載在優化內容交付和簡化最終用戶體驗之間取得平衡。
用戶更快地連接到內容,因為只有一部分網站需要在用戶首次打開時下載。
隨著內容持續供給用戶,企業看到更高的客戶保留率,減少了用戶離開網站的機會。
企業看到資源成本在降低,因為內容只有在用戶需要的時候才能傳遞,而不是一次性的傳遞。
#2使用瀏覽器緩存
設置瀏覽器緩存可以讓你暫時的數據存儲在網站訪問者的計算機上。這確保了他們每次訪問您的網站時不必等待您的網頁(標志,CSS文件和其他資源)加載。
您的服務器端緩存及其瀏覽配置可確定存儲數據的時間。在您的服務器上設置瀏覽器緩存可以通過聯系您的托管公司或通過查看以下資源來完成:
? Apache緩存
? IIS緩存
? Nginx緩存
利用瀏覽器緩存來指定Web瀏覽器保存CSS,JS和圖像存儲的時間。對于回訪客戶讓您的網頁加載速度更快,導致了流暢的體驗,同時在導航和在搜索結果頁面(SERP)上更好的排名。
另外,安裝緩存插件會對您的頁面加載時間產生巨大的影響。緩存插件通過生成內容的靜態副本并將其傳遞給站點訪問者來處理此問題。這可以大大減少您的頁面加載時間。
緩存插件可以幫助你看到你的網站的整體性能10倍左右的改善。緩存插件的示例包括W3 Total Cache。
#3壓縮網頁內容
Google將壓縮定義為使用較少位編碼信息的過程。盡管最新的網絡瀏覽器都支持內容壓縮功能,許多網站仍然沒有釋放壓縮內容。
訪問這些網站的訪問者與網頁的互動速度緩慢。 這些不利的網站行為的主要原因包括舊的或錯誤的瀏覽器,網絡代理,配置錯誤的主機服務器和防病毒軟件。
未壓縮的內容使得對于具有有限帶寬的用戶,接收到Web內容和頁面加載時間非常慢。為了有效的壓縮策略提供高效的網站內容,Google建議如下:
1)Minify,HTML,CSS和JavaScript
2)在CSS和HTML中使用一致的代碼,方法如下:
? 使用一致的規格 - 大多是小寫的。
? 確保引用HTML標簽屬性。
? 以相同的順序顯示HTML屬性。
? 使用Adobe DreamWeaver和MAMP等工具分別在PC上本地創建/編輯CSS并測試運行網站,按照相同的順序來指示CSS鍵-值對(KVP)。
3)啟用Gzip壓縮
Gzip找到類似的字符串和代碼實例,并用較短的字符臨時替換它們。根據Google說法:“啟用Gzip壓縮可以將傳輸響應的大小減少高達90%,這可以顯著減少下載資源的時間量,減少客戶端的數據使用量,并改善首次渲染頁面的時間”
#4優化CSS代碼和傳遞
CSS的引入是一個關鍵的改進,幾乎沒有任何缺點。 但是,必須考慮CSS腳本對頁面速度的影響,特別是它涉及到一個網頁的表現時。
當CSS交付不當時,導致瀏覽器在下載和處理樣式數據時延遲,在它可以徹底完成呈現,以顯示給你網頁的訪問者之前。這就是為什么至關重要的是優化CSS交付,并確定可能減慢您的網頁的陷阱。
CSS可以通過網頁以多種方式使用,并且仍然可以工作。鑒于有各種方法可以使用它,有幾種不同的CSS設置。無論您如何在網頁上進行設置,您的CSS應該幫助您的網頁呈現更快的速度,而不會減慢速度。
您可以利用不同的在線工具來壓縮,優化和清理CSS交付。另外,您可以參考Google關于優化CSS交付的建議。
#5使用非常快的服務器托管公司
有一段時間,我更換了我的托管公司,我的網站的平均速度在其他任何不改變情況下顯著增加。當時我意識到,當涉及到網站的加載速度托管公司并不都是平等的。
在瀏覽網站或打開網頁時,您將從遠程計算機(即托管公司的Web服務器)打開文件。遠程計算機越快,您的網頁可以打開的速度越快。
有各種各樣的托管公司在那里供您使用。只要確保您進行適當的研究,并閱讀足夠的評論,然后再決定用任何一個主辦來托管您的網站。
在研究可靠的網絡托管公司時,您應該注意的最重要的因素包括速度/加載時間,正常運行時間/可靠性,客戶支持和價格/價值。
#6停用不使用的插件
插件通常是減慢WordPress托管網站速度的主要原因。刪除您不再使用或不是必需的插件。您可以通過選擇性地禁用插件和衡量服務器性能來識別可能損害您速度的插件。
另外,為了加快您的WordPress網站在手機上的體驗,請查看我們的指南,盡快在您的WordPress網站上實施Google AMP。
結論
用戶將繼續要求更豐富的在線體驗,并且會有更快更清晰的JavaScript,更多的CSS竅門和其他第三方分析工具,以增加您的網頁的大小和衡量您的網站。
作為一個在線營銷人員,你不能讓這個讓你迷惑。 您必須定期努力擴展您的網頁設計,以提高您的網頁加載速度。一點點持續關注你的網站加載速度會走很長的路。記住:只需在您的網站加載速度一秒鐘的延遲就是失去。
譯者:李振喃、審校:袁帥
新聞名稱:6種簡單且有效的網站設計方式提高網頁加載速度
文章起源:http://newbst.com/news14/155664.html
網站建設、網絡推廣公司-創新互聯,是專注品牌與效果的網站制作,網絡營銷seo公司;服務項目有網站設計等
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯
猜你還喜歡下面的內容