Question

为什么有的网页打开图片是从上到下逐行打开,有的则是先显示低分辨率图片再逐渐加入细节?

Answer

感谢@吴亚桐 回答给我找到线索,感谢提问者的好问题,我为这个问题曾经困惑了多年。这种渐进式载入方法容易和其他渐进式载入混淆。

我这里小总结一下几种渐进式载入办法。

下面是答案:


浏览器下载图片的时候渐进式载入,这样下载完一张图可以看到它的样子, 只不过只是不清楚的图,这样可以减少你等待看它的时间。

实际上有两种方式可以实现这种渐进式效果,一种是图像隔行扫描(Interlace), 中文可以成为交错,另外一种叫做图像渐进式扫描(Progressive)。

  1. 隔行扫描可以在gif/png中实现。隔行GIF是指图像文件是按照隔行的方式来显示的, 比如先出奇数行,再出偶数行,造成图像是逐渐变清楚的。将图像文件保存成隔行 GIF 格式的方法是,在 Photoshop中进行保存时,选择"Interlaced" (不要选择"Normal"),在Paint Shop Pro中进行保存时,点击"Option…"按钮, 选择"Interlaced"(不要选择"Non Interlaced")。
  2. 渐进式扫描在在jpg中实现。逐级JPG文件可以让图像先以比较模糊的形式显示, 随着图像文件数据不断从网上传过来,图像会逐渐变清晰。 这样做的好处是图像可以尽快地显示出来,虽然图像不很完美, 但是却让浏览者看到了希望,并且图像在不断地变好。将图像文件保存成逐级 JPG格式的方法是,在Photoshop中进行保存时,选择"Progressive",在 Paint Shop Pro 中进行保存时,点击"Option…"按钮,选择"Progressive encoding"。

参考


原文链接: https://blog.alswl.com/2011/09/interlace-progressive-image/
3a1ff193cee606bd1e2ea554a16353ee
欢迎关注我的微信公众号:窥豹

Comments

comments powered by Disqus