Photoshop 更新了“存储为 Web 所用格式”导出功能

Photoshop 更新了“存储为 Web 所用格式”导出功能

文章目录
文章目录
  1. 为什么叫“Web 所用格式”?
  2. Photoshop 27.7 的变化
  3. 如何打开“存储为 Web 所用格式”
  4. 支持导出哪些格式?
  5. 切片工具依然还在
  6. 吸管工具有什么作用?
  7. 质量与大小控制
  8. 为什么很多人还是坚持用它?

如题,在最新的 Adobe Photoshop 27.7 正式版中,Adobe 终于对经典的“存储为 Web 所用格式(Save for Web)”进行了更新。对于很多老用户来说,这个窗口已经十几年没什么大变化了,甚至一度被认为会被“导出为”功能彻底取代。但没想到,在新版 Photoshop 中,它不仅没有被删除,反而迎来了 UI 与功能层面的现代化升级。

尤其是对于做网站、UI、摄影后期、贴图输出、博客配图的人来说,这次更新其实相当重要。你甚至会发现:“存储为 Web 所用格式”,依然是目前 Photoshop 里最好用、最直观的图片压缩导出工具之一。

为什么叫“Web 所用格式”?

这个名字其实带着非常明显的时代印记。早期互联网带宽很低,网页图片加载速度非常关键,所以 Photoshop 很早就加入了专门面向网页优化的导出功能:

  • 尽量压缩图片体积
  • 平衡画质与文件大小
  • 兼容浏览器显示
  • 控制透明背景
  • 降低 GIF 动画大小
  • 减少网页加载时间

所以它并不是普通“另存为”,而是:“为了网页显示而专门优化的导出方式”。直到今天,它依然是:很多设计师、站长、自媒体作者最常用的图片输出方式。

Photoshop 27.7 的变化

这次更新后,最大的变化其实是:旧版那个“上古时代风格”的导出窗口,终于变得现代化了。新版界面:

  • 字体与 UI 更清晰
  • 缩放与预览更流畅
  • 高 DPI 显示更正常
  • 支持更现代的导出格式
  • 参数布局更加合理
  • 预览体验更舒服
Photoshop 更新了“存储为 Web 所用格式”导出功能
Photoshop 更新了“存储为 Web 所用格式”导出功能

如何打开“存储为 Web 所用格式”

在 Photoshop 中依次点击:文件 → 导出 → 存储为 Web 所用格式,快捷键:Ctrl + Shift + Alt + S / Command + Shift + Option + S。这组快捷键应该是变过,我记得最开始推“导出”时,一度把这组快捷键做的很复杂。

你会发现新版依然保留了很多经典功能,例如顶部的:

  • 原稿
  • 优化
  • 双联
  • 四联

双联 / 四联预览有什么意义?这其是“存储为 Web”最核心的功能之一。它允许你:同时对比不同压缩参数下的图片效果。比如:

  • 左边是最高规格的 PNG-24
  • 右边是 PNG-8
  • 第三个是 JPEG 30
  • 第四个是 WBMP

然后实时查看:

  • 清晰度
  • 色彩损失
  • 文件大小
  • 压缩瑕疵

对于网站图片优化来说非常直观。尤其做博客、摄影网站、Banner 图的时候,非常好用~

存储为 Web 所用格式四联预览
存储为 Web 所用格式四联预览

支持导出哪些格式?

目前新版“存储为 Web 所用格式”中,依然保留了几个经典网页格式,包括:PNG-24、PNG-8、GIF、JPEG,以及 WBMP。这里很多人第一眼会看错,以为是现在非常流行的 WebP,但实际上 Adobe 这里写的是 WBMP,并不是 WebP。WBMP 是一种非常古老的无线位图格式,早年主要用于功能机和移动设备,现在几乎已经没人使用了,所以这次更新里没有加入 WebP,反而保留了 WBMP,实在是让人遗憾。

  • JPEG
    最经典的网页图片格式之一,属于有损压缩
    优点是体积小、兼容性极强,非常适合照片类图片
    缺点是不支持透明背景,并且高压缩下容易出现涂抹感和马赛克
  • PNG-8
    8 位 PNG 格式,颜色数量有限
    支持简单透明,文件体积通常比 PNG-24 更小
    适合图标、小元素、简单 UI、纯色插画等场景
  • PNG-24
    高质量无损 PNG
    支持完整 Alpha 透明通道,边缘过渡效果非常优秀
    非常适合需要透明背景的高质量素材,但文件体积通常较大
  • GIF
    经典动画格式
    最大特点是支持帧动画,但仅支持 256 色
    现在虽然很多场景已被视频或现代格式替代,但表情包、小动画、加载动画等依然大量使用 GIF
  • WBMP
    全称 Wireless Bitmap
    属于非常早期的移动设备位图格式,主要用于功能机时代
    黑白单色、功能极其有限,如今几乎没有实际使用场景,更多像是 Photoshop 里遗留下来的“时代化石”

切片工具依然还在

很多人可能已经忘了:Photoshop 当年甚至是网页设计工具,所以“存储为 Web”里其实保留着大量 Web Design 时代遗产。例如:切片选择工具、切片导出、单独输出区域、HTML 导出逻辑....虽然现在真正用切片的人已经很少了。

设置的格式以 HTML 形式发送到浏览器预览
点击预览,会将你设置的格式以 HTML 形式发送到浏览器预览

吸管工具有什么作用?

很多人第一次打开“存储为 Web 所用格式”窗口时,可能都不会注意左侧那个小小的吸管工具。在 Web 导出场景里,它最大的意义,是方便用户观察图片在压缩后的颜色变化。例如 JPEG 高压缩时,经常会出现偏色、色带、暗部脏污、肤色失真等问题,而吸管工具可以直接查看当前像素的 RGB 数值,从而对比压缩前后的颜色差异。

尤其对于 UI 设计、品牌色、产品展示图来说,有时候并不是“肉眼差不多”就够了,而是需要尽量保证颜色准确。这时候吸管工具其实非常实用。

另外在 GIF、PNG-8 这类限制颜色数量的格式中,吸管也能帮助观察调色板变化。对于老网页设计师来说,这几乎算是一个非常经典的工作流工具了。

质量与大小控制

“存储为 Web 所用格式”之所以一直没有被淘汰,很大一个原因,就是它对图片质量和文件大小的控制,直到现在依然非常直观。你可以一边调整 JPEG 质量,一边实时查看图片体积变化,同时还能立即看到压缩后的实际效果。例如从 JPEG 100 调整到 JPEG 60,可能文件体积会直接减少一大半,但画面肉眼却几乎没有明显变化。

这种“边调边看”的体验,其实比很多一键导出工具更专业。因为它真正把选择权交给了用户,而不是让软件自动决定。对于做网站、博客、自媒体的人来说,这一点非常重要。因为网页图片并不是越高清越好,而是需要在“清晰度”和“加载速度”之间找到平衡点。

很多时候,一张原图可能有 5MB,但经过合理压缩后,只剩几百 KB,网页打开速度却能明显提升。这也是为什么直到今天,大量站长依然还在使用这个功能。

为什么很多人还是坚持用它?

因为它真的太直观了!现在很多软件虽然也支持导出图片,但大多数都偏向“傻瓜式”处理:点一下导出,然后软件自动帮你压缩。问题在于,你往往并不知道它到底牺牲了多少画质。

而“存储为 Web 所用格式”最大的优势,就是它能让你实时看到变化。你可以直接观察:

  • 压缩后是否变糊
  • 暗部有没有脏污
  • 文字是否发虚
  • 边缘有没有锯齿
  • 文件体积缩小了多少

这种可视化对比,直到今天依然非常好用。尤其对于摄影师、网站运营、自媒体作者来说,他们真正需要的并不是“自动导出”,而是:“我自己决定,画质和体积之间该怎么平衡。”

所以,你还会用这个功能吗?

发表评论

Photoshop 账号租赁购买,支持 AI 创成式填充
Photoshop 账号租赁购买,支持 AI 创成式填充
提示词:把摩托车换成山地自称车
Photoshop 账号租赁购买,支持 AI 创成式填充
提示词:一只橘猫看着镜头
Photoshop 账号租赁购买,支持 AI 创成式填充
提示词:一只往下的小狗和回家的小学生

即刻体验 Adobe Firefly(PS AI)生成式填充,包含最新 Adobe 正版全家桶软件(PS / LR / PR / AE / AI….),实现一键干扰人物移除、元素补充等功能,大大提高修图效率!

看一看左侧杂乱的原始图像和 AI 处理后的效果。这不是魔法,是 Adobe Firefly!完成左边这些图,全部只需要点点鼠标,AI 自动搞定,无需复杂操作、无需找素材。

👉 想体验这种神级修图快感? 立即查看「Adobe Creative Cloud 正版账号体验」获取账号,解锁 Photoshop AI 超能力!


相关阅读:

请输入关键词…