Mac 调整图片像素尺寸：3 种方法

博客模板在 CSS 中显示的 Hero 区域宽度为 960 px，但设计导出的图片往往达到 2880 px。读者看不到这些多余的像素，但每次页面加载都会下载它们。在压缩或转换格式前，先调整到实际显示尺寸。

显示尺寸规则

针对高 DPI 屏幕，导出宽度约为 CSS 宽度的 2 倍，而非显示器或相机的原始捕获尺寸。像素尺寸与 DPI 元数据不同。一张标记为 72 或 300 DPI 的 1920 px 宽图片，在布局使用像素宽度时，仍占据 1920 px 的空间。

批量处理前，检查 Figma 中的帧、CMS 模板或邮件构建器。关于尺寸确定后的格式选择，请参阅 Mac 压缩图片指南 。

方法 1：GetCompress

适用场景： 混合文件夹、可复用宽度，以及单次操作完成转换和缩放。

1. 将单张图片或文件夹拖入 GetCompress 。
2. 设置最大宽度或最大高度（例如博客 Hero 区域设为 1920 px）。
3. 如果 CMS 要求 JPEG 或 WebP，请选择输出格式。
4. 预览新宽度下的 UI 截图，然后导出到原始文件旁边。
5. 保存预设（如“博客 1920px”），以便下次复用。

处理过程在 Mac 本地完成。如需批量文件夹工作流，请参阅 Mac 批量调整图片尺寸 。

方法 2：在预览程序中调整大小

适用场景： 使用内置工具处理单张或少数文件。

1. 在 预览程序 中打开图片。
2. 选择 工具 → 调整大小…。
3. 设置像素单位的 宽度 或 高度。除非有意裁剪，否则保持 按比例缩放 勾选。
4. 选择 文件 → 导出…，选择 JPEG、PNG 或保留当前格式。
5. 另存为新文件，并通过 工具 → 显示检查器 确认尺寸。

调整大小后放大查看文字和细线。将截图缩小至低于其显示宽度会导致文字难以阅读。

限制： 无法在数十个文件间保存预设。

方法 3：使用 sips 批量处理

适用场景： 对包含 JPEG 或 PNG 的文件夹进行终端循环处理。

mkdir out
for f in *.jpg; do sips -Z 1920 "$f" --out "out/$f"; done

精确宽度（高度按比例缩放）：

sips --resampleWidth 1920 input.jpg --out output.jpg

限制： 包含混合 PNG、JPEG 和 HEIC 的文件夹仍需单独命令或专用应用。在线调整大小工具会上传您的资产。对于未发布的样机图，请保持处理在本地进行。请参阅 在线文件压缩器安全吗 。

纵横比与放大

不要放大 JPEG 并重新压缩以期望获得更清晰的细节。您会增加伪影，但无法恢复文件中原本不存在的信息。

何时预览程序已足够

当新宽度已匹配布局时，预览程序可完成单张资产的处理。

当同一宽度在数十个文件中重复出现，或您需要在同一操作中转换格式时，GetCompress 也能提供帮助。在项目 README 中记录所选的像素宽度，以便下一个人不会重新引入 4000 px 的导出。调整大小后交付 WebP，请参阅 Mac 上 PNG 转 WebP 。