极致压图
截图与教程

文档、教程和代码截图怎么压缩才清楚?

文档截图里最重要的是小字:代码里的分号、菜单名、按钮上的一行提示。这些细节一旦被压糊,读者就无法照着操作。

先让截图本身可读

截图前增大编辑器字号、隐藏无关面板并使用清晰主题。压缩不会把原本只有几像素宽的文字笔画变清楚。

  • 只保留读者完成步骤需要的区域。
  • 用标注指向操作点,不要堆太多界面。
  • 避免把敏感账号或密钥截入图片。

裁剪与显示尺寸优先

一张包含整个 4K 桌面的截图塞进 700px 宽的正文时,小字必然被缩得难读。裁成局部步骤图,或把复杂界面拆成多张,既能减小体积也能提高理解速度。

高分屏截图的像素是显示尺寸的 2 倍或 3 倍。如果文档页面不需要高清屏的锐度,“缩小到 1/2”就能把像素数减到四分之一;如果读者多用高分屏,保留原尺寸、只做格式上的压缩更稳。

三种处理方式对截图的影响

处理方式对应设置画质体积适合
PNG 无损优化高质量档(oxipng 级别 2,不量化)像素完全不变通常只省一点带渐变、阴影或照片的截图
PNG 调色板量化均衡档(质量 80)或智能自动颜色数减少,纯色界面几乎看不出通常省得多纯界面、代码、终端截图
JPEG统一转为 JPEG + 高质量(质量 90)文字边缘可能出现杂色照片类内容最小大面积照片背景的截图

在不缩放、保持原格式的情况下,如果 PNG 怎么压都不比原图小,工具会把原图交还给你,而不是给一个更大的文件。截图工具导出的 PNG 有时已经很紧凑,这很正常。

检查清单

  • 用最终网页的显示比例查看,而不是只在图片查看器里放大。
  • 逐字看代码里的标点、下划线和缩进。
  • 透明边缘在浅色和深色主题下各看一次。
  • 不要反复复制粘贴、重新保存 JPEG,每次保存都会再损失一点。

文档更新与可访问性

产品界面变化后,旧截图会产生错误指导。文件名包含功能和步骤而非临时序号,界面更新后把新截图整个文件夹拖进来重新处理即可。

参考资料

现在处理你的文件

文件只在当前浏览器中处理,不会作为文章示例上传到服务器。

打开图片压缩工具