今天由同事说起,PS导出PNG时,有个选项”交错“是干啥的,想起这也是个问题,所以特意搞了个测试页面:
引用网上”交错-就是类似旧式电视的隔行扫描,让图片只花50%的时间就可以看到图片全貌“,
另外JPG的”渐进“也有类似效果,可惜支持的浏览器不多
在测试各个浏览器(未说明都为最新版本)时发现:
Chrome对“渐进”和“交错”都支持良好
Safari(PC/MAC)对“渐进”不支持,“交错支持良好”
Fiefox对“渐进”和“交错”都支持良好
Opera对“渐进”和“交错”都支持良好
IE9对“渐进”和“交错”都不支持
测试地址:Interlace_test
从测试的加载情况可以很容易看出,在对于需要加载大图片的情况下,在导出图片时选择“交错”(PS里JPG选择“连续”),对于用户体验上有很大的改善
另外,在<img />标签有个lowsrc属性,可以指定图片的缩略图,用于避免,页面打开时一片空白;不过现在这个属性出现的概率貌似有点低;
引用某处关于“渐进”(Interlace)和“交错”(Progressive)的解释: