seo-image-gen

SEO Image Gen：用于 SEO 资源的 AI 图像生成（扩展）

共享数据缓存

步骤 0 —— 检查共享数据缓存：

开始收集之前，检查 .seo-cache/ 中是否有可复用的相关 SEO 技能上下文。 参考：../seo/references/shared-data-cache.md，了解架构和依赖关系图。

在以下缓存文件存在时检查它们：

• .seo-cache/site-meta.json，获取域名、业务类型、行业和爬取上下文

• .seo-cache/audit-scores.json，获取之前完整审计的优先事项

• .seo-cache/pages/{url-slug}/page-analysis.json，在提供 URL 时获取页面级上下文

• 如果找到：解析并使用明确有效的字段（注明“使用了来自 [date] 的缓存 [X]”）

• 如果缺失、损坏或不相关：继续收集新证据

• 如果用户说“refresh”或“re-run”：忽略缓存读取，并在写入时覆盖

通过 banana Creative Director 工作流，使用 Gemini 的图像生成功能，为 SEO 用例生成可用于生产环境的图像。 将 SEO 需求映射到优化的领域模式、宽高比和默认分辨率。

架构说明

此扩展基于 Banana 图像生成工作流构建， 用于 Codex 中特定于 SEO 的图像工作流。

此技能包含两个职责不同的组件：

• SKILL.md（此文件）：处理用于生成图像的交互式 /seo image-gen 命令
• Agent（agents/seo-image-gen.toml）：在 /seo audit 期间启动的仅审计分析器，用于评估现有 OG/社交图片并制定生成计划（绝不会自动生成）

前提条件

此技能要求安装 banana 扩展：

./extensions/banana/install.sh

检查是否可用： 使用任何图像生成工具之前，请检查 gemini_generate_image 或 set_aspect_ratio 工具是否可用，以确认 MCP 服务已连接。如果这些工具不可用，请告知用户尚未安装此扩展，并提供安装说明。

快速参考

命令	功能
/seo image-gen og <description>	生成 OG/社交预览图片（1200x630 的观感）
/seo image-gen hero <description>	博客主视觉图（宽屏、富有戏剧性）
/seo image-gen product <description>	产品摄影图（干净的白色背景）
/seo image-gen infographic <description>	信息图（纵向、信息密集）
/seo image-gen custom <description>	通过完整的 Creative Director 工作流生成自定义图像
/seo image-gen batch <description> [N]	生成 N 个变体（默认：3）

SEO 图像用例

每种用例都对应预先配置的 banana 参数：

用例	宽高比	分辨率	领域模式	备注
OG/社交预览	16:9	1K	Product 或 UI/Web	简洁、专业、便于放置文字
博客主视觉图	16:9	2K	Cinema 或 Editorial	富有戏剧性、氛围感和编辑品质
Schema 图片	4:3	1K	Product	简洁、描述性强，适用于 schema ImageObject
社交方图	1:1	1K	UI/Web	针对平台优化的方形图片
产品照片	4:3	2K	Product	白色背景、影棚灯光
信息图	2:3	4K	Infographic	信息密集、纵向布局
网站图标/图标	1:1	512	Logo	简约、易缩放、易识别
Pinterest Pin	2:3	2K	Editorial	高挑的纵向卡片

生成工作流

每次生成请求都执行以下步骤：

1. 识别用例：根据命令或上下文（og、hero、product 等）确定用例
2. 应用 SEO 默认值：使用上方用例表中的设置
3. 设置宽高比：通过 set_aspect_ratio MCP 工具设置
4. 构建推理简报：使用 banana Creative Director 工作流：
   • 加载 references/prompt-engineering.md，了解 6 个组成部分的系统
   • 强调相应领域模式（主体 30%、风格 25%、上下文 15% 等）
   • 务必具体、生动地描述镜头所见
5. 生成图像：通过 gemini_generate_image MCP 工具生成
6. 生成后的 SEO 检查清单（见下文）

检查预设

如果用户提到品牌或配置了 SEO 预设：

python3 scripts/presets.py list

加载匹配的预设并将其用作默认设置。另请检查 references/seo-image-presets.md 中的 SEO 专用预设模板。

生成后的 SEO 检查清单

每次成功生成后，都要指导用户完成以下事项：

1. 替代文本：为生成的图像编写描述性强且包含丰富关键词的替代文本
2. 文件命名：重命名为适合 SEO 的格式：keyword-description-widthxheight.webp
3. WebP 转换：转换为 WebP 格式，以优化页面加载速度：

   magick output.png -quality 85 output.webp
   

4. 文件大小：主视觉图目标小于 200KB，缩略图目标小于 100KB
5. Schema 标记：建议为生成的图像添加 ImageObject schema：

   {
     "@type": "ImageObject",
     "url": "https://example.com/images/keyword-description.webp",
     "width": 1200,
     "height": 630,
     "caption": "Descriptive caption with target keyword"
   }
   

6. OG 元标签：对于社交预览图，请提醒用户注意：

   <meta property="og:image" content="https://example.com/images/og-image.webp" />
   <meta property="og:image:width" content="1200" />
   <meta property="og:image:height" content="630" />
   <meta property="og:image:alt" content="Descriptive alt text" />
   

成本注意事项

图像生成需要付费。请如实说明：

• 生成前显示预估费用（尤其是批量生成时）
• 记录每次生成：python3 scripts/cost_tracker.py log --model MODEL --resolution RES --prompt "brief"
• 用户询问用量时，运行 cost_tracker.py summary

大致费用（gemini-3.1-flash）：

• 512：约 $0.02/张图像
• 1K 分辨率：约 $0.04/张图像
• 2K 分辨率：约 $0.08/张图像
• 4K 分辨率：约 $0.16/张图像

模型路由

场景	模型	原因
OG 图像、社交预览	gemini-3.1-flash-image-preview @ 1K	速度快、成本效益高
主视觉图、产品照片	gemini-3.1-flash-image-preview @ 2K	兼顾质量与细节
含文字的信息图	gemini-3.1-flash-image-preview @ 2K, thinking: high	文字渲染效果更好
快速草稿	gemini-2.5-flash-image @ 512	快速迭代

错误处理

错误	解决方法
未配置 MCP	运行 ./extensions/banana/install.sh
API 密钥无效	前往 https://aistudio.google.com/apikey 获取新密钥
触发速率限制（429）	等待 60 秒后重试。免费套餐：约 10 RPM / 约 500 RPD
IMAGE_SAFETY	改写提示词——参见 references/prompt-engineering.md 中的 Safety 部分
MCP 不可用	改用：python3 scripts/generate.py --prompt "..." --aspect-ratio "16:9"
未安装扩展	显示安装说明：./extensions/banana/install.sh

跨技能集成

• seo-images（分析）为 seo-image-gen（生成）提供输入：/seo images 的审计结果会指出缺失或质量低下的图像；利用这些发现指导 /seo image-gen 命令
• seo-audit 会调用 seo-image-gen Agent（而非此技能），分析整个网站的 OG/社交图像，并生成按优先级排序的生成计划
• seo-schema 可以使用生成的图像：生成后，建议添加指向新资源的 ImageObject schema 标记

参考文档

按需加载。启动时请勿全部加载：

• references/prompt-engineering.md：6 组件系统、领域模式、模板
• references/gemini-models.md：模型规格、速率限制、功能
• references/mcp-tools.md：MCP 工具参数和响应
• references/post-processing.md：ImageMagick/FFmpeg 流程配方
• references/cost-tracking.md：定价、用量跟踪
• references/presets.md：品牌预设管理
• references/seo-image-presets.md：SEO 专用预设模板

响应格式

生成后，始终提供：

1. 图像路径：保存位置
2. 撰写的提示词：展示发送给 API 的内容（供用户了解）
3. 设置：模型、宽高比、分辨率
4. SEO 检查清单：替代文本建议、文件命名、WebP 转换
5. Schema 片段：适用时提供 ImageObject 或 og:image 标记

写入共享数据缓存

完成所有工作后，如果工作流产生了可长期使用的发现，请将简洁的 JSON 摘要写入 .seo-cache/。 使用 ../seo/references/shared-data-cache.md 中的 schema 和命名规则；至少包含 cache_type、analyzed_at、源 URL/域名、关键发现、问题、建议和工具限制。如果 .gitignore 中没有 .seo-cache/，请将其添加进去。