B2B网店系统的图片格式如何选择提升用户体验!

　　对于B2B网店系统平台运营的人员来说，比较烦躁的就是为啥要出这么多的图片格式呢?在笔者看来这些的图片格式各有所长，下面笔者就拿最常见的gif、png、jpeg三种格式来说说。首先我们看一下这三种格式的对比。

　　以上是对于三种常见格式的对比，其实还有bmp等格式，但是对于我们在做设计的时候这种格式其实应用不是特别多，所以暂就不怎么讲了，不过坦率的说这个格式还是不错的，因为这玩意它不压缩文件，但是比同样的一张图其他格式的大很多，所以在页面上其实用的比较少的。而jpeg格式还有一种jpg的写法，很多人都以为这是一回事，不过如果从单纯使用角度也算是一回事，实际上jpg是使用jpeg文件交换格式存储的编码图像文件扩展名。而jpeg是一种压缩标准。

　　那么明白了这三种格式的定义、优点、缺点，我们什么时候该使用这三种格式的图片呢?

　　笔者建议如果你的图片色彩较为单一、只是由色块或者文字组成的时候可以考虑使用gif，因为这样可以减少很大的体积。但是反过来说png可以说是gif格式的替代品，而且着实表现很优秀。同样的表现，png的更小。所以这种情况下你还是能用png就别用gif了。有人说了，你说这么多废话就直接说让我们用png好了。但是要考虑一点，如果你设计的产品面对的用户他们通常采用的浏览器比较老套或者一些旧的移动设备，比如非智能机等。或者说图像质量较差的机器。那你还是得用gif，因为这些老物件不支持png。gif最多不会多于256种颜色。如果你的图片有很多过渡色、渐变色等依然得选择png。

　　那jpeg和png对比呢?

　　jpeg适合储存有很多颜色的图片，因为通过压缩后可以在网络上较快地加载。那么图片要是含有图形或者文字的话可以考虑用png，反之亦然。否则jpg压缩以后就会变得比较模糊。对于jpeg其实咱得单独拿出来说说，有些同学可能知道可能不知道，这玩意其实有两种保存方式，一种是标准型，用鸟语讲就是Baseline JPEG，还有一种是渐进型也就是Progressive JPEG。这是一对双胞胎，什么都一样，但是纵使是我们生活中的双胞胎，很多都一样也必然有不一样的地方，这哥俩不一样的地方就是他们的显示方式不同。

　　标准型的jpeg文件存储方式是按照从上到下的扫描方式存储的。每一行顺序的保存在文件中。打开这个文件的时候，就按照存储时候的顺序从上到下一行一行的显示。直到所有的都打开。所以如果你的文件很大或者用户网络一般、去想象一下效果吧。其实这种显示方式没啥太大的有点。所以推荐后者。

　　而渐进型的是多次扫描。在你打开的时候会先显示整个图片的轮廓。然后多次扫描，图片主见清晰。这个好处无需多言，同时用户在使用的时候可以根据轮廓大致知道这个图片是什么。如果你的图片很大，可以考虑用这种。

　　对比两种方式，看看后者，这样你的用户体验不就提升很多了么?其实只是你保存的时候一个小动作是不是?但是对于用户来讲，那个体验是什么?前者：什么破玩意啊，半天出不来，要不就是一条条的，关掉关掉关掉!后者：哎，出来个框了，等一下，越来越清晰，激动啊!而这个，是不是也和我们在研究用户体验时，跟进度条的道理差不多呢?

　　当然如果你的图片是JPEG的标准型的话，你想转化成渐进型，可以这样做：在ps中打开图片后，【存储为web所用格式】，然后勾选【连续】就是渐进型了。

　　写在最后，笔者想说的是这篇文章对B2B网店系统平台的设计师还是产品运营经理都会有一定的帮助，因为你的图片如何使用会对你的产品的用户体验产生很大的影响。

(扫码加入hishop官方微信群)