記憶盒子

把記憶裝進灰色的盒子,封裝起來,那年那月,重新拾起。

首頁搜索目錄
search
當前主題: 互聯(lián)網(wǎng)絡(luò)

JPG圖片保存時慎用“漸進式瀏覽器顯示”格式

作者:Kaka    時間:2013-10-22 15:50:40    瀏覽:    評論:3

      JPEG文件類型在保存時有個自定義壓縮編碼格式的選項,F(xiàn)ireworks里叫“漸進式瀏覽器顯示”,在Photoshop里叫“連續(xù)”(以多條路徑下載)。

Fireworks“漸進式瀏覽器顯示”

Fireworks“漸進式瀏覽器顯示”

Photoshop“連續(xù)”(以多條路徑下載)

Photoshop“連續(xù)”(以多條路徑下載)

      何為“漸進式”圖像?

      這個比較容易理解,我們多數(shù)看到的圖片顯示模式,都是從上到下逐漸顯示的,這是“標準式”圖像;而有的圖片是先出現(xiàn)一個很低分辨率的圖像輪廓,類似加了馬賽克的模糊樣子,當圖片完全加載完畢時,圖片就由模糊變得清晰了,這就是“漸進式”圖像。

      “漸進式”圖像有什么好處?

      一些人認為,先給用戶顯示圖像輪廓,可以解決在網(wǎng)絡(luò)網(wǎng)速不好的情況下圖像顯示緩慢的問題,但也有人認為這樣會影響用戶UI體驗,仁者見仁吧。

      “標準式”圖像和“漸進式”圖像的演示效果

      通過對“漸進式”和“標準式”圖像的多種環(huán)境下多次試驗,我覺得“標準式”的效果更佳,而“漸進式”效果并不是十分理想。

      演示效果看這里:“標準式”圖像 “漸進式”圖像

      如果你使用的是非IE瀏覽器,那么以上兩種圖片加載的效果區(qū)別是明顯的,“標準式”圖片是從上到下逐漸顯示,“漸進式”圖片是先顯示圖片輪廓,,由模糊變清晰。

“標準式”圖像加載效果

“標準式”圖像加載效果

“漸進式”圖像加載效果

“漸進式”圖像加載效果

      “漸進式”圖像在IE里的糟糕表現(xiàn)

      但是如果用戶使用的是IE瀏覽器,那么杯具的事情發(fā)生了,對于“漸進式”圖像,IE瀏覽器根本不預(yù)先顯示低分辨率的模糊圖片輪廓,而是一片空白!只有當圖片完全加載完后,才唰的一下顯示整張圖片。這給用戶的體驗是最壞的。

      因此,本文告誡使用“漸進式”圖像模式的童鞋,如果你非要使用“漸進式”,那么最好準備兩種圖片,在網(wǎng)頁上加上瀏覽器判斷,如果是IE瀏覽器,則采用“標準式”圖片,否則才采用“漸進式”圖片。

x

標簽: Image  

※ 網(wǎng)站速度慢?試試網(wǎng)站自動優(yōu)化工具 ※

上一篇: 使用延遲加載圖片插件 提高網(wǎng)頁打開速度
下一篇: 域名被人非法泛解析 網(wǎng)站嚴重降權(quán)如何補救
  • 3.繽*
  • 這個效果看過,還真沒有注意這是通過技術(shù)實現(xiàn) 的功能啊
  • 2013/10/24 10:26:35 回復(fù)該留言
  • 1.西*******
  • 漲了見識了,以前經(jīng)常見到這兩種情況,從來沒有注意過,圖片的不同打開方法和用戶體驗都有關(guān)系
  • 2013/10/22 19:48:38 回復(fù)該留言

發(fā)表評論:

◎歡迎參與討論,請在這里發(fā)表您的看法、交流您的觀點。

訂閱博客                   QQ交流群(312716741)

  • 通過Google訂閱本站 通過鮮果訂閱本站 通過抓蝦訂閱本站
  • 通過QQ郵箱訂閱本站 通過Yahoo訂閱本站 通過有道訂閱本站

Search

最新評論及回復(fù)

最近留言

網(wǎng)站分類

Powered By Z-Blog 1.8 Walle Build 91204 Designed by Han'space

Copyright @2009-2024 All Rights Reserved. 粵ICP備14028160號-1

Powered By Z-Blog 1.8 Walle Build 91204
Copyright @2009-2024 All Rights Reserved.