核心关键词： Photoshop WebP、PS导出WebP、WebP插件、设计转WebP、设计师工具
设计师在Photoshop中完成设计后，如果直接保存为JPEG或PNG，再转到在线工具转换WebP，多了一步操作。其实Photoshop从CC 2019版本开始已经原生支持导出WebP格式。本文将教你如何在Photoshop中直接导出WebP，提高设计到上线的效率。
一、检查你的Photoshop版本是否支持WebP
Adobe从Photoshop CC 2019（版本20.0）开始原生支持WebP格式。如果你的版本是CC 2019或更新，直接可以使用。如果版本较旧，可以安装免费的WebP插件。检查方法：打开Photoshop，点击菜单栏的“帮助”->“关于Photoshop”，查看版本号。
二、原生导出WebP的步骤
完成设计后，点击“文件”->“导出”->“导出为”（或使用快捷键Ctrl+Shift+Alt+W）。在弹出的窗口中，格式下拉菜单中选择WebP。你可以调整图片尺寸、质量参数（0-100）。界面左侧可以预览画质效果，右侧实时显示文件大小。调整到满意后，点击“导出”保存。
三、批量处理多张图片导出WebP
如果你有多张图片需要转换，可以使用Photoshop的动作功能。先录制一个动作：打开一张图片，执行“导出为”并设置WebP格式，保存到指定文件夹，关闭图片。然后选择“文件”->“自动”->“批处理”，选择刚才录制的动作，指定源文件夹，Photoshop会自动处理所有图片。
四、使用WebP插件（旧版Photoshop）
如果你使用的是CS6或CC 2018等旧版本，可以安装免费插件WebP Format。下载插件后，复制到Photoshop的Plug-ins文件夹，重启Photoshop。之后就可以通过“文件”->“存储为”选择WebP格式了。
五、设计师的最佳实践建议
设计时尽量保留原始PSD文件，用于后续修改。导出时建议同时保存一份PNG（用于存档）和一份WebP（用于上线）。对于需要透明背景的设计，WebP是比PNG更好的选择，体积小得多。质量参数建议设置在80-85之间，这是画质和体积的最佳平衡点。
六、从设计源头优化网站速度
设计师直接输出WebP格式，可以避免后续转换的麻烦，确保上线图片就是最优格式。现在就用一页共享的图片转WebP工具验证你的WebP导出效果，或者直接在Photoshop中导出WebP，为网站加速做出贡献。
相关文章
