适用场景

当主要交付物为图像文件或视觉资产时使用本指南，尤其在以下方面有明确要求时：格式选择、缩放、裁剪、压缩、元数据、透明度、色彩配置文件、响应式交付、社交平台规范、应用市场要求，或印刷就绪性。

若任务具有明确的交付目标（destination-specific），请先加载对应专用文档，再做决策：

• web.md：适用于响应式交付、LCP/CLS 优化、srcset、懒加载、SVG 及现代 Web 图像格式。
• social.md：适用于各平台尺寸要求、安全区域（safe zones）、信息流/故事/横幅导出。
• ecommerce.md：适用于应用市场商品图规范、纯白背景、缩放支持、目录一致性。
• photography.md：适用于 RAW 文件处理、ICC 色彩配置文件、印刷导出、EXIF 元数据及非破坏性编辑流程。
• branding.md：适用于 Logo、图标、favicon、App 图标、SVG 一致性，以及小尺寸下的可读性。
• screenshots.md：适用于 UI 截图、文档配图、标注、打码（redaction）及带设备边框的营销视觉素材。
• accessibility.md：适用于替代文本（alt text）、装饰性 vs 信息性图像判断、图中嵌入文字、图表、对比度感知型图像交付。
• commands.md：当用户需要具体的 ImageMagick 或 Pillow 命令示例时使用。

将主工作流保留在本文件中，再根据实际交付上下文引入对应的专业文档，而非依赖泛化的图像建议进行猜测。

速查表

高效工作流

1. 识别资产类型：照片、截图、UI 截图、Logo、示意图、社交卡片、商品图，或印刷源文件。
2. 明确交付目标：网页、社交平台上传、应用市场图库、印刷交付、内部归档，或后续编辑流水线。
3. 判断源文件是否应保持矢量、图层化或 RAW 格式，避免过早扁平化。
4. 编辑前检查文件：尺寸、宽高比、朝向、透明度、色彩配置文件、元数据，以及当前压缩损伤程度。
5. 若任务属于 Web、社交、电商、摄影/印刷、品牌、截图、无障碍或命令密集型场景，请加载对应的目标专用文档。
6. 执行最小且安全的变换集：裁剪、缩放、格式转换、压缩、元数据剥离或保留、导出。
7. 在真实交付环境中验证导出结果，而不仅限于编辑器内预览。

按资产类型推荐默认方案

核心准则

1. 按交付目标选择工作流，而非习惯

• Web 交付、社交导出、电商准备、印刷输出与归档保存，是截然不同的图像任务。
• 截图、商品照片、Logo、信息图与印刷资产，不应默认采用相同格式或压缩策略。
• 图像生成（image generation）与图像处理（image processing）属不同工作流；将 AI 生成资产视为仍需检验与规范导出的输入源。
• 若交付目标高度专业化，请在锁定格式、裁剪、质量或元数据策略前，先阅读对应文档。
• 若该文件后续还需编辑，请在制作轻量级交付版本前，先保留一份母版级源文件。

2. 按内容选格式，而非跟风趋势

• 照片类内容面向现代 Web 交付时，通常首选 AVIF 或 WebP，兼容性关键时回退至 JPEG。
• 截图、UI 截图、示意图及文字密集型图形，常需 PNG 或无损 WebP，以避免边缘模糊。
• Logo、图标及简单插画，在目标平台支持前提下，应始终保留矢量格式（.svg）。
• 透明度影响格式选择：JPEG 不支持 Alpha 通道，而 PNG、WebP 和 AVIF 均可保留。
• 动图 GIF 很少是最优输出；动画 WebP、MP4 或 WebM 通常体积更小、质量更佳。
• TIFF、PSD、图层化格式及 RAW 文件属于工作中间态或母版，非常规交付产物。
• 若平台对上传图像进行激进重编码，请优先适配其二次压缩行为，而非追求本地理想观感。
• 含锐利边缘的截图、示意图和图表，即使照片无需无损输出，也往往受益于无损导出。

3. 主动保护色彩、透明度与细节

• Web 资产通常应最终输出为 sRGB，除非交付目标明确要求其他色彩空间。
• 剥离或更改 ICC 配置文件可能导致色彩偏移，即使像素值本身未变。
• 含透明度的资产需使用支持 Alpha 的格式，并在明/暗两种背景下均做验证。
• 重复有损保存会累积损伤，因此务必保留干净源文件，并尽量减少重压缩循环。
• 放大、降噪、锐化、背景去除等操作属于可见编辑，而非无害的导出步骤。

4. 缩放、裁剪与压缩须遵循正确顺序

• 先确定宽高比，其次裁剪，再次缩放，最后压缩。
• 默认不执行上采样（upscale）；额外像素无法凭空重建缺失细节。
• Retina 或 HiDPI 导出应为显式决策，而非自动过度渲染。
• 起始建议：2x 为常规 Retina 导出，3x 应为有意为之，而非默认设置。
• 社交卡片、电商展位与应用市场图库常激进裁剪，务必保护真实焦点区域及所有关键文字。
• 即使像素尺寸完全匹配规格，若裁剪切掉人脸、商品主体、标签或 UI 可交互元素，仍属失败。
• 若图像内嵌文字，请在最小合理预览尺寸下验证可读性，而不仅限于全分辨率。

5. 将元数据与朝向视为真实交付要素

• EXIF 朝向信息可能导致图像在某查看器中正立，在另一查看器中旋转——导出后亦如此。
• 公开 Web 资产通常应剥离 GPS 及不必要的相机元数据。
• 版权、作者、来源等元数据，可能因编辑、法律或归档用途而需保留。
• 元数据决策是工作流组成部分，而非事后补救。
• 当下游系统依赖精确文件名或 SKU 模式映射资产时，请保持文件命名规范一致。
• 若工作流依赖作者信息、权利数据、时间戳或朝向信息，请勿盲目剥离元数据。

6. 使用切实可行的预算与交付默认值

• Web 工作中，预算应作为强制约束机制，而非装饰性参考。
• 实用默认起点建议：首屏大图（hero image）＜200 KB，正文图（content image）＜100 KB，缩略图（thumbnail）＜30 KB，栅格图标（raster icon）＜5 KB。
• Web 环境中交付图像时，应通过显式宽高或宽高比预留布局空间。
• 勿对首屏大图（primary hero）或潜在 LCP 图像启用懒加载。
• “本地看起来正常”的文件，若在真实页面中引发 CLS、LCP 或响应式交付问题，则仍未完成。
• 小体积不等于高质量——若细节丢失、文字不可读、商品边缘崩坏或渐变失真，则仍属失败。
• 若平台必然二次压缩，请预留足够余量，确保第二次压缩不会摧毁成果。

7. 在真实交付环境中验证

• 平台规范不可互换：Web 首屏图、社交预览图、App Store 封面、应用市场图库、印刷广告，各有不同约束。
• 电商图像需关注背景一致性、边缘洁净度、方形安全裁剪及缩放友好型细节。
• 社交图像需安全构图，因各平台信息流对预览图的裁剪逻辑各异。
• 印刷资产关注物理尺寸、出血（bleed）与色彩处理方式——这些 Web 导出完全不涉及。
• 若资产部署于 Web，请同步考虑周边交付要素：宽高、alt 文本，以及图像是否应承载文字语义。
• 若资产将上传至第三方平台，请检查上传后的实际效果——多数流水线会再次缩放、剥离配置文件、扁平化元数据或二次压缩。
• 若图像承载语义，请同步验证其无障碍性：alt 文本策略、文字可读性、装饰性 vs 信息性角色，以及该语义是否本应由 HTML 或周边文案承载。

8. 安全批量处理，并确保原始可逆

• 始终基于原始文件或干净母版操作，而非已有优化版本。
• 批量处理应统一规则，但正式运行前务必抽样检查代表性文件。
• 一个错误的裁剪预设、色彩转换或有损导出，可能迅速损坏整批文件。
• 请将按目标导出的版本与母版严格分离，避免下次编辑误从已降质副本开始。

值得单独加载的特殊场景

• 当资产为 Logo、App 图标、favicon、社交头像、徽章或可复用图标集时，请加载 branding.md。
• 当资产为 UI 截图、Bug 报告图、教程截图、发布说明配图或带设备边框的营销视觉图时，请加载 screenshots.md。
• 当图像需添加 alt 文本、含嵌入文字、承载图表/示意图语义，或可能为装饰性而非信息性时，请加载 accessibility.md。

优质交付的标准

• 所选格式匹配内容本质与交付目标，而非一刀切偏好。
• 导出文件准确保留焦点区域、文字可读性、透明度及色彩意图。
• 元数据被有意识地保留或剥离。
• 文件体积高效，且无明显视觉损伤。
• 资产在真实上传、嵌入或平台预览环节中仍能正常工作。
• 智能体未过早将矢量、图层化或 RAW 源文件扁平化。
• 资产在其真实使用上下文中仍具可理解性，而不仅孤立状态下视觉美观。

常见陷阱

• 将含透明度图像保存为 JPEG，无声丢失 Alpha 通道。
• 对截图或 UI 截图使用 JPEG，导致锐利文字糊成一团。
• 交付的文件虽满足尺寸要求，却存在错误宽高比或不安全裁剪。
• 反复对同一 JPEG 进行有损重保存，却归咎于工具而非工作流缺陷。
• 盲目剥离元数据，意外破坏图像朝向、授权上下文或来源追溯需求。
• 忽略 sRGB 设置，困惑于图像在不同编辑工具、浏览器及应用市场间色彩偏移。
• 在目标平台会剥离、劣质栅格化或完全屏蔽 SVG 的场景下强行使用 SVG。
• 假设 AVIF 或 WebP 处处兼容，而某些平台、邮件客户端或上传流水线仍强制转为 JPEG 或 PNG。
• 将关键文字嵌入图像，而本应由 HTML 或原生 UI 文字承载语义。
• 达成文件体积预算，却因不当缩放、裁剪或锐化牺牲视觉质量。
• 过早将 Logo 栅格化，此后永远受困于模糊导出。
• 交付的截图仍可见敏感信息、个人数据或不稳定时间戳。
• 图像像素“看起来不错”后，便将 alt 文本、标题或图表摘要视作他人职责。

相关技能

若用户确认，可通过 clawhub install 安装：

• image-edit —— 遮罩、清理、修复（inpainting）及定向视觉编辑。
• image-generation —— 跨主流模型提供商的 AI 图像生成与编辑能力。
• photography —— 面向拍摄、色彩管理与印刷输出的摄影工作流。
• svg —— 当栅格文件并非合适输出时的矢量图形工作流。
• ecommerce —— 应用市场与商品列表要求，常对图像交付构成强约束。

反馈

• 若本指南有用：clawhub star image
• 保持更新：clawhub sync