Skip to content

让图片更适合你的博客

ImageMagick处理图片大小

ImageMagick 是一个跨平台的开源图像处理引擎和工具集。它的核心功能很强,重点是“批处理”和“格式兼容”。官方说明它支持 200+ 图像格式,可做格式转换、缩放、裁剪、旋转、模糊、锐化、阈值处理、颜色管理、图像合成、文字/图形绘制、GIF/多帧动画处理、图像差异比较、拼图 montage、元数据识别,以及面向大图的流式像素处理。命令行这块尤其成熟,magick、mogrify、compare、montage、identify、stream 这些工具基本覆盖了日常服务端图像流水线需求。

它的优点主要有这几类:

  • 成熟度高:仓库提交历史很长,生态和文档都比较完整。
  • 自动化强:非常适合脚本、批量处理、CI/CD、后端图片服务。
  • API 分层清楚:想简单接入可以用 MagickWand,想深度控制可以用 MagickCore,C++ 项目可以用 Magick++。
  • 跨平台:Linux、Windows、macOS 都支持。
  • 大图和性能能力不错:官方架构文档提到它有 pixel cache、streaming、部分 OpenCL 加速、分布式 pixel cache 等机制。
  • 安全治理相对完善:官方明确建议配置 security policy,仓库里也包含 oss-fuzz 相关内容

安装

macOS,官方推荐 Homebrew:

shell
brew install imagemagick

安装完成后,可以先确认版本:

shell
magick identify -version

常用命令

先看一眼图片的基本信息:

shell
magick identify /Users/xxx/Downloads/avatar.png

把正文配图缩放到更适合博客的尺寸,同时保留比例:

shell
magick /Users/xxx/Downloads/input.jpg -resize '1600x1600>' /Users/xxx/Downloads/output.jpg

上面这个命令里的 > 很实用,它表示“只缩小,不放大”。如果原图本来就不大,就不会被强行拉伸。

在缩放的同时去掉元数据、设置压缩质量:

shell
magick /Users/xxx/Downloads/input.jpg -auto-orient -resize '1600x1600>' -strip -quality 82 /Users/xxx/Downloads/output.jpg

如果是博客封面,通常更适合固定比例裁剪,比如 1600x900

shell
magick /Users/xxx/Downloads/cover.jpg \
  -auto-orient \
  -resize '1600x900^' \
  -gravity center \
  -crop 1600x900+0+0 +repage \
  -strip \
  -quality 82 \
  /Users/xxx/Downloads/cover-optimized.jpg

如果只是想把一张 PNG 快速转成 WebP,也可以直接用 magick

shell
magick /Users/xxx/Downloads/avatar.png -strip -quality 82 /Users/xxx/Downloads/avatar.webp

博客里更实用的尺寸建议

尺寸不需要追求统一答案,但可以先有一组够用的基线:

  • 文章封面:1600x9001200x630
  • 正文配图:宽度控制在 12001600 像素通常就够了
  • 头像:400x400512x512
  • 截图类图片:按实际展示宽度来,避免原尺寸直传

一个很常见的误区是:页面里显示 900 像素宽的图片,却上传了 5000 像素宽的原图。浏览器确实能帮你缩小显示,但下载成本并不会自动变小。

cwebp

安装 cwebp

cwebp 来自 libwebp 工具集。在 macOS 下同样可以直接通过 Homebrew 安装:

shell
brew install webp

安装完成后,验证一下:

shell
cwebp -version

常用命令

最基础的 JPEG 转 WebP:

shell
cwebp -q 80 -mt /Users/xxx/Downloads/input.jpg -o /Users/xxx/Downloads/output.webp

PNG 转 WebP:

shell
cwebp -q 85 -mt /Users/xxx/Downloads/input.png -o /Users/xxx/Downloads/output.webp

如果你想明确不保留元数据:

shell
cwebp -q 80 -mt -metadata none /Users/xxx/Downloads/input.jpg -o /Users/xxx/Downloads/output.webp

如果图片本身是图标、线稿或透明 UI 资源,希望尽量保真,可以试试无损模式:

shell
cwebp -lossless -z 6 -mt /Users/xxx/Downloads/input.png -o /Users/xxx/Downloads/output.webp

ImageMagick 和 cwebp 怎么选

如果只是日常写博客,我的建议很简单:

  • 想一步完成缩放、裁剪、去元数据、转格式,用 ImageMagick
  • 想对 WebP 压缩效果做更细的控制,用 cwebp

也就是说,ImageMagick 更像一个通用处理流水线,cwebp 更像一个专门针对 WebP 的编码器。

下面这个命令就很适合博客封面:

shell
magick /Users/xxx/Downloads/cover.jpg \
  -auto-orient \
  -resize '1600x900^' \
  -gravity center \
  -crop 1600x900+0+0 +repage \
  -strip \
  -quality 82 \
  -define webp:method=6 \
  /Users/xxx/Downloads/cover.webp

参数解释速查表

前面这些命令看起来不长,但里面有几个参数非常高频。理解它们之后,后面你自己组合命令会轻松很多。

ImageMagick 常用参数

以这条命令为例:

shell
magick input.jpg -auto-orient -resize '1600x1600>' -strip -quality 82 output.jpg
  • magick:ImageMagick 7 的统一命令入口。
  • input.jpg:输入文件。
  • output.jpg:输出文件。
  • -auto-orient:根据图片 EXIF 方向信息自动旋转,常用于手机照片。
  • -resize '1600x1600>':按比例缩放到不超过 1600x1600 的范围。
  • >:只缩小,不放大,避免小图被强行拉伸。
  • -strip:移除 EXIF、ICC profile、注释等元数据,通常能进一步减小体积。
  • -quality 82:设置输出质量,数值越高通常画质越高、体积也越大。

封面裁剪参数

以这条封面图命令为例:

shell
magick cover.jpg \
  -auto-orient \
  -resize '1600x900^' \
  -gravity center \
  -crop 1600x900+0+0 +repage \
  -strip \
  -quality 82 \
  cover-optimized.jpg
  • -resize '1600x900^':先按比例把图片缩放到足以铺满 1600x900 这个区域。
  • ^:表示“铺满目标区域”,不是“完整放进目标区域”,所以一般会配合裁剪。
  • -gravity center:把后续裁剪的参考点设为中心。
  • -crop 1600x900+0+0:从当前参考点裁出 1600x900 的画面。
  • +0+0:表示不再额外偏移。
  • +repage:清除裁剪后保留下来的虚拟画布和偏移信息,避免输出图带错误坐标。

这一组参数可以简单理解成:先铺满,再居中裁掉多余部分。

WebP 相关参数

以这条命令为例:

shell
magick avatar.png -strip -quality 82 -define webp:method=6 avatar.webp
  • -define webp:method=6:设置 WebP 编码方法。
  • webp:method 的常见范围是 06
  • 数值越高,编码通常越慢,但压缩效果一般更好。

cwebp 常用参数

以这条命令为例:

shell
cwebp -q 80 -mt -metadata none input.jpg -o output.webp
  • cwebp:Google 提供的 WebP 编码工具。
  • -q 80:有损压缩质量,范围通常是 0100
  • -mt:开启多线程,提高编码效率。
  • -metadata none:不保留元数据。
  • -o output.webp:指定输出文件路径。

如果你使用无损压缩:

shell
cwebp -lossless -z 6 -mt input.png -o output.webp
  • -lossless:启用无损压缩。
  • -z 6:无损模式下的压缩等级,数值越高通常越慢,但文件体积一般更小。

这几个符号最容易混淆

  • >:只缩小,不放大。
  • <:只放大,不缩小。
  • !:强制拉伸到指定宽高,不再保持原始比例。
  • ^:先铺满目标区域,通常搭配 -crop 使用。
  • \:只是命令换行续写符,不是 ImageMagick 参数。

Last updated: