TOC
网页图片格式选择
在网页上，选择合适的图片格式可以有效降低图片体积并保持较高清晰度。以下是几种常见的图片格式及其适用场景：
1. WebP
优点:
- 由 Google 开发，支持有损和无损压缩。
- 通常比 JPEG 和 PNG 更小，同时保持较高的清晰度。
- 支持透明度和动画。
缺点:
- 不完全支持所有浏览器（尤其是旧版 IE）。
适用场景: 现代浏览器中替代 JPEG 和 PNG 的理想选择。
2. JPEG
优点:
- 广泛支持，兼容性好。
- 有损压缩，适合照片和复杂图像。
缺点:
- 不支持透明度。
- 压缩过多会导致质量下降。
适用场景: 照片、复杂图像。
3. PNG
优点:
- 无损压缩，适合需要高清晰度的图像。
- 支持透明度。
缺点:
- 文件体积通常较大。
适用场景: 需要透明度的图像、图标、简单图形。
4. SVG
优点:
- 矢量格式，适合图标和简单图形。
- 文件体积小，缩放不失真。
缺点:
- 不适合复杂图像和照片。
适用场景: 图标、简单图形、Logo。
5. AVIF
优点:
- 最新的图像格式，压缩效率高。
- 支持有损和无损压缩，透明度和动画。
缺点:
- 浏览器支持仍在逐步增加。
适用场景: 现代浏览器中替代 WebP 和 JPEG 的新选择。
6. 总结
WebP: 现代浏览器中的最佳选择，兼顾体积和清晰度。
JPEG: 适合照片和复杂图像，兼容性好。
PNG: 适合需要透明度的图像。
SVG: 适合图标和简单图形。
AVIF: 未来的趋势，但目前支持有限。
图片格式转换工具
图形界面工具
Preview（预览）
缺点：支持的格式有限
使用: 打开图片后，选择 文件 -> 导出，然后选择所需的格式并保存。
XnConvert
官网：XnConvert
优点: 支持批量转换和多种格式，操作简单。
缺点：我是用的版本是：XnConvert Version 1.100.1 - ARM64 (Feb 25 2024) - Libformat version 7.172, 我选择将文件导出为avif失败了。
开始于: 13/3/2025 12:25 PM
/Users/xdl/Documents/github/blog/static/image/icon-500.svg 48x48x32 : 已加载
/Users/xdl/Desktop/image/icon-500.avif : 不是图像
---------
保存错误：
/Users/xdl/Desktop/image/icon-500.avif
---------
已输入文件： 1
已提取页： 1
新文件： 1
总持续时间： 0 秒
完成于: 13/3/2025 12:25 PM
不知道后续版本有没有修复这个问题，不过其他格式可以正常转。并且因为图形界面操作，所以如其他：变形，大小，水印等等也挺方便操作的。
命令行工具
imagemagick
Tools and libraries to manipulate images in many formats.
官网：imagemagick
优点：支持的图片格式丰富，转换质量可以
缺点：需要安装
安装：homebrew:
brew install imagemagick使用：
这是最直接的使用方法 - 单个图片：
magick input.svg output.avif可以加入一个质量参数（范围是 0-100，数值越高质量越好）：
magick input.svg -quality 90 output.avif根据deepseek的说明：
由于 ImageMagick 依赖 libheif 来处理 AVIF 格式，你可以查阅 libheif 的文档或源码。根据 libheif 的官方文档，默认质量是 75。
如果 SVG 文件中有透明度，magick 会自动保留透明度信息
这里可以看到png –> avif 的实例（需要往下滑动一段才能看到图片）
如果是批量转换，比如要转换一个文件夹下的某个格式的所有图片：
cd /Users/xdl/Documents/github/blog/static/image for file in *.svg; do magick "$file" -quality 90 "${file%.svg}.avif" done这样如果原文件夹下的内容是：
icon-16.svg icon-192.svg icon-24.svg icon-500.svg icon-180.svg icon-194.svg icon-32.svg现在就会在同样的文件夹下新增以下图片：
icon-16.avif icon-192.avif icon-24.avif icon-500.avif icon-180.avif icon-194.avif icon-32.avif
ffmpeg
Play, record, convert, and stream audio and video
虽然它的介绍写的是有关音视频的功能，但它也可以转换图片格式。
有关用ffmpeg处理音视频的方法，后边单独写一章。
官网：ffmpeg
优点：支持的图片格式丰富
缺点：
- 需要安装；
- 转换质量不是很好，至少我用它转svg –> avif 的时候，透明部分给转成黑色了，但其他格式还行。我只测试了一次，不具有什么代表性。
安装：homebrew:
brew install ffmpeg使用：
ffmpeg -i image.png image.jpg
sips
scriptable image processing system
sips 是 macOS 自带的命令行工具，支持格式转换。
sips 工具目前不支持 AVIF 格式。sips 支持的格式包括 JPEG、PNG、TIFF、GIF 等，但不包括 AVIF。
这是目前我看到的，只有可写才代表能够转换。
xdl@192 image % sips --version
sips-311
xdl@192 image % sips --formats
Supported Formats:
-------------------------------------------
com.adobe.pdf pdf Writable
com.adobe.photoshop-image psd Writable
com.adobe.raw-image dng
com.apple.atx -- Writable
com.apple.icns icns Writable
com.apple.pict pict
com.canon.cr2-raw-image cr2
com.canon.cr3-raw-image cr3
com.canon.crw-raw-image crw
com.canon.tif-raw-image tif
com.compuserve.gif gif Writable
com.dxo.raw-image dxo
com.epson.raw-image erf
com.fuji.raw-image raf
com.hasselblad.3fr-raw-image 3fr
com.hasselblad.fff-raw-image fff
com.ilm.openexr-image exr Writable
com.kodak.raw-image dcr
com.konicaminolta.raw-image mrw
com.leafamerica.raw-image mos
com.leica.raw-image raw
com.leica.rwl-raw-image rwl
com.microsoft.bmp bmp Writable
com.microsoft.cur --
com.microsoft.dds dds Writable
com.microsoft.ico ico Writable
com.nikon.nrw-raw-image nrw
com.nikon.raw-image nef
com.olympus.or-raw-image orf
com.olympus.raw-image orf
com.olympus.sr-raw-image orf
com.panasonic.raw-image raw
com.panasonic.rw2-raw-image rw2
com.pentax.raw-image pef
com.phaseone.raw-image iiq
com.samsung.raw-image srw
com.sgi.sgi-image sgi
com.sony.arw-raw-image arw
com.sony.axr-raw-image axr
com.sony.raw-image srf
com.sony.sr2-raw-image sr2
com.truevision.tga-image tga Writable
org.khronos.astc astc Writable
org.khronos.ktx ktx Writable
org.khronos.ktx2 -- Writable
org.webmproject.webp webp
public.avci avci
public.avif avif
public.avis --
public.heic heic Writable
public.heics heics Writable
public.heif heif
public.jpeg jpeg Writable
public.jpeg-2000 jp2 Writable
public.jpeg-xl jxl
public.mpo-image mpo
public.pbm pbm Writable
public.png png Writable
public.pvr pvr Writable
public.radiance pic
public.svg-image svg
public.tiff tiff Writable
第三列的Writable表示可读写，也就是说可以从所有可读的图片格式转成这个格式;
第三列的空格表示可读，也就是sips可以读取这种图片格式，但不能将图片从从所有可读的图片格式转成这种格式。
xdl@192 image % sips -s format png icon-500.svg --out icon-500.png
/Users/xdl/Documents/github/blog/static/image/icon-500.svg
/Users/xdl/Documents/github/blog/static/image/icon-500.png
这样就完成了将一个图片从 svg 转成 png 格式了。