网店视觉设计中图片尺寸与分辨率调整方法.pdfVIP

调整质量

在网店装修中使用的设计图的尺寸只要能够满足显示设备的显示与网络快速传输的要求即可，而我们通

过商品拍摄所获得的的尺寸往往会超出网店装修的需要，此时，按照网店装修的需求来调整商品的

质量就显得很有必要了。

5.1.1

改变商品的尺寸

我们通过商品摄影得到的原始的宽度和高度基本都是像素以上，这样的大尺寸并不能直

接用于网店装修，因为过大的不仅会降低网页加载的速度，还会在合成、加工和制作网店装修的过

程中，使软件的处理速度变慢，大大降低了工作效率。当然还有一个关键的是，尺寸过大的不能匹

配网店页面的宽度规格。因此，商品后期处理往往都需要改变的尺寸。

在中可以通过“图像大小”命令来快速更改商品的尺寸，在改变尺寸的同时，

文件的大小也会随之改变，具体如下图所示。

以25%比例显示原始的商品照

片，能够占满整个图像窗

口。

缩小的尺寸后，仍以25%

比例显示时，占据的窗口

面积明显变小。

从如上所示的操作过程可以看到，“宽度”和“高度”选项等比例减小，的文件大小随

之变小，也就达到了我们之前所期望的结果，即通过缩小的尺寸来减小文件占用的空间，这样

的便于我们进行快速编辑，并且更适合用于网店装修。

5.1.2

更改商品的分辨率

一张商品的质量好坏与图像分辨率和尺寸大小息息相关。同样尺寸的，其分辨率越高，图像

越清晰。决定分辨率的主要因素是每单位尺寸含有的像素数目，因此像素数目与分辨率之间也是相关的。

分辨率很高的虽然也可加载在网页中显示，但其清晰度并没有明显提高，体积反而大大增加，从而导

致网页加载缓慢，给服务器等网络设备带来多余的负担。而的分辨率太低，则会导致视觉可见的

清晰度下降。因此，在制作网店装修的之前必须先确定图像的分辨率。由于网店装修实际上就是网页

设计与制作，而网页是显示在电子设备的显示屏中的。综合考虑显示屏的显示原理和显示效果，以及网页

显示技术规范的要求，72像素/英寸的分辨率可以在保证显示清晰度的前提下，最度地减小

体积，达到显示效果和网页加载速度的最佳平衡。

在中使用“图像大小”命令不仅可以更改商品的大小，还能通过设置“分辨率”选

项来将商品原本较高的分辨率更改为更适合网页显示的像素英寸的分辨率，如下页图所示。

更改分辨率后，的像素和尺寸并没有发生任何改变。

想要确认商品的分辨率是

否更改成功，可以将设置后的

进行“另存为”操作，接

着利用右键菜单打开文件

的“属性”框，在其中的

“详细信息”的“图像”

选项组中，可以通过查看“水更改前更改后

平分辨率”和“垂直分辨率”

这两个参数的数值来了解当前

商品的分辨率，具体操作

如右图所示。

5.1.3

巧用“另存为”命令减小文

件占用空间

设计图或商品占用的计算机空间大小和网店页面加载所用时间的长短是由的文件大小决定

的。虽然通常像素越多意味着文件越大，但是的文件格式，如或，与文件大小的关系更为

密切。同一张保存成格式，将比保存成格式大得多。这是因为格式适当压缩了，这使

得文件更小，但以略微降低视觉质量为代价。根据电子商务对设计图和商品的格式要求，我们

在大部分情况下都会使用格式的。

将其他格式的文件转换为格式，通常可以节省相当大的空间