創新易聯歡迎您!13年專注深圳網站建設

網站制作做好這幾點有效提升速讀

日期:2017-03-10 | 來源:易聯網站建設公司 | 閱讀:

網站做完了,并非萬事大吉了,我們知道用戶都喜歡瀏覽速度快的網站,不喜歡花費太多的時間等待網頁的打開,等待的時間過長,會讓用戶失去耐心,甚至煩躁時會直接關閉網頁,這樣就會失去一些潛在的客戶了,今天深圳網站制作公司創新易聯的小編就和大家詳細介紹:



1、合并Js文件和CSS
將JS代碼和CSS樣式分別合并到一個共享的文件,這樣不僅能簡化代碼,而且在執行JS文件的時候,如果JS文件比較多,就需要進行多次“Get”請求,延長加載速度,將JS文件合并在一起后,自然就減少了Get請求次數,提高了加載速度(具體可查看馬海祥博客的《提高網站速度的6種網站前端優化方法》相關介紹)。
用戶打開用css設計的網頁,css一般被下載用戶本地計算機,不像html元素表現標簽,每次網站的網頁都要調用一次,使用css,只需要一次就好了!另外,css在某些地方可以替代圖片,這就是為什么現在提倡div+css的原因!
2、Sprites圖片技術
Spriting是一種網頁圖片應用處理方式,它是將一個頁面涉及到的所有零星圖片都包含到一張大圖中去,然后利用CSS技術展現出來。這樣一來,當訪問該頁面時,載入的圖片就不會像以前那樣一幅一幅地慢慢顯示出來了,可以減少了整個網頁的圖片大小,并且利用CSSSprites能很好地減少網頁的http請求,從而大大的提高頁面的性能。
CSSSprites在國內很多人叫css精靈,很早就有了,在很多大型網站都有用到,特別是一些所有頁面都存在的圖標用得比較多,很好的提升加載速度。

3、壓縮文本和圖片
壓縮技術如gzip可以有效減少頁面加載的時間。包括HTML,XML,JSON(JavaScript對象符號),JavaScript和CSS等,壓縮率都可以在大小70%左右。
一般文本壓縮用得比較多,通常都是直接在空間開啟就行,而圖片的壓縮就比較隨意,很多都是直接上傳,其實還有很大的壓縮空間。
4、延遲顯示可見區域外的內容
為了確保用戶可以更快地看見可見區域的網頁可以延遲加載或展現可見區域外的內容,為了避免頁面變形,可以使用占位符標簽制定正確的高度和寬度。
比如:WP的jQueryImage LazyLoad插件就可以在用戶停留在第一屏的時候,不加載任何第一屏以下的圖片信息,只有當用戶把鼠標往下滾動的時候,這些圖片才開始加載。這樣很明顯提升可見區域的加載速度,提高用戶體驗。
5、確保功能圖片優先加載
網站主要考慮可用性的重要性,一個功能按鈕要提前加載出來,用戶進入下載頁,一個只需要8s時間的下載花了5s在等待、尋找下載按鈕圖片,誰能忍受(對于其解決方法,大家可通過馬海祥博客的《實現網頁圖片預加載效果的3種技術方法》相關介紹來詳細的了解)?
還有個問題需要注意的是:一些人經常忘記寫圖片的長和寬了,這些標記是告訴瀏覽器打開圖片之前的尺寸,如果能提前設置好圖片的height和width,瀏覽器加載網頁時就會保留一塊區域,加快整個網頁顯示速度。
6、重新布置Call-to-Action按鈕
其實這個和上面一條是差不多的,都是從用戶體驗速度著手,跳過了網頁的整體加載速度。速度沒變,只是讓一些行為按鈕提前,Call-to-Action按鈕一般習慣設計在頁面底部,這樣的習慣對于用戶來說并不總是好的,購買用戶需要等到最下面加載出來才能點擊下一步操作。
可以調整CTA按鈕的位置或使用滑動的圖片按鈕,很多大型購物網站的加入購物車就是這種類型。
—— 微信公眾號 ——

熱門標簽

急速赛车单机版