鲁达 效果图
喜欢老师的文章、关注专栏
步骤1：将您的图片制作成分层文件
在Photoshop中打开产品图片。最有可能的是JPG格式。在此示例中，我们将使用在白色背景下拍摄的手表图像。
打开“ 图层”面板。默认情况下，该面板位于图像窗口的右侧，但如果看不到它，则可以通过从应用程序窗口顶部的下拉菜单中单击“ 窗口”>“图层”来访问它。
在“ 层”面板中，双击“ 背景”层。一个新图层对话框，要求您重新命名层就会出现。您可以将其保留为默认的第0层，然后单击“ 确定”。
现在，您已经解锁了背景图层，从其中删除的任何内容都是透明的。
步骤2：建立选择
从应用程序窗口左侧的工具栏中选择魔术棒工具。然后，从屏幕顶部的选项栏中单击“ 选择主题”。无论背景如何，Photoshop都会尝试从照片中选择对象。您将在选择周围看到该选择作为“蚂蚁线”。
如果选择不完美，则可以使用魔术棒工具从选择中删除更多背景，或根据选择的方式向选择中添加更多产品。
在此示例中，Photoshop并未完全从选择中删除手表的阴影，因此我们将在选项栏中选择“ 从选择中减去”图标，然后使用魔术棒工具单击阴影的一部分，直到选择仅包含手表。
创建选择项时，请确保还选择产品图像中任何有“孔”的区域，例如示例图像中表盘与腕带相接的区域。
步骤3：删除背景
选择完产品后，通过键入SHIFT + CTRL + I（在Mac上为SHIFT + COMMAND + I）或从应用程序窗口顶部的下拉菜单中选择“ 选择”>“反选”来选择反选区域。
选择反（背景）后，键入BACKSPACE（在Mac上为Delete）。您的背景现在将是透明的。在Photoshop中，透明的背景用灰色和白色的棋盘图案表示。
键入CTRL + D（在Mac上为COMMAND + D）以取消选择。
步骤4：以适当的网络格式保存图像
在Photoshop中创建透明背景只是第一步。您需要确保以正确的格式保存产品图片，以便产品图片在电子商务网站上以透明背景显示。
保存图像的最佳格式是PNG-24。这种格式允许多层透明，这意味着当您将图像放置在不同颜色的背景上时，图像永远不会有像素化的“光晕”。较旧的透明文件格式（例如PNG-8和GIF）会产生这种不良的光晕效果，因此，请尽可能使用PNG-24。
要将文件另存为Photoshop CC中的PNG-24，请键入SHIFT + ALT + CTRL + W（在Mac上为SHIFT + OPTION + COMMAND + W），或从顶部菜单中选择“ 文件”>“导出”>“导出为... ”。应用程序窗口。
注意：如果您使用的是Photoshop的旧版本，并且没有看到“ 导出为...”选项，则可以选择“ 另存为Web”，然后从右侧的“ 预设”下拉菜单中选择“ PNG-24”。对话框。
在出现的对话框中，在框右侧的“ 文件设置”下，将“ 格式”设置为“ PNG”，并确保选中了“ 透明性”框。不要选检查文件较小（8位） -此转换文件为PNG-8
在图片的左侧，您会看到为PNG文件预测的文件大小。这一点非常重要，因为较大的文件大小会使网页加载速度变慢。我个人的喜好是将Web图片保持在200 KB或更小。
在对话框的右侧，在“ 图像大小”下，您可以选择调整图像的尺寸。较小的尺寸表示较小的文件大小。但是，您不想使图像的尺寸小于希望它们出现在网站上的尺寸。这样做会产生模糊或像素化的图像。
此外，由于许多客户在显示器上查看产品，因此，将产品图片保存为比您期望的尺寸大50％至100％的大小是一种很好的做法。这将帮助它在所有设备上看起来清晰。换句话说，如果您知道您的产品最大可以显示400像素宽，那么您需要在此处将其至少显示600像素宽。
因此，是的，您需要使用一些平衡来最大化图像大小，同时最小化文件大小。为了最大程度地减少加载时间，您只能选择将特色产品图片保存较大以用于视网膜显示，并允许将大部分产品图片保存为实际尺寸。
第5步：保存文件
将图像尺寸设置为适当的尺寸后，点击全部导出。
在“保存”对话框中，选择保存网络产品图像的文件夹。最好将优化的图像文件与原始图像文件分开，以免在将图像加载到站点时造成混淆。命名图像文件，并确保其扩展名设置为.png。