seo-image-gen

SEO图像生成：用于SEO资产的AI图像生成（扩展）

使用Gemini的图像生成功能，通过banana Creative Director流水线生成可用于SEO场景的生产级图像。将SEO需求映射到优化的领域模式、宽高比和分辨率默认值。

架构说明

本扩展基于Claude Banana，这是Claude Code的独立AI图像生成技能。

该技能包含两个组件，角色不同：

• SKILL.md（本文件）：处理交互式/seo image-gen命令，用于生成图像
• Agent（agents/seo-image-gen.md）：仅在/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	产品或UI/Web	干净、专业、适合文字
博客头图	16:9	2K	电影或编辑	戏剧性、氛围感、编辑质量
Schema图像	4:3	1K	产品	干净、描述性、Schema ImageObject
社交方形	1:1	1K	UI/Web	平台优化的方形
产品照片	4:3	2K	产品	白色背景、影棚灯光
信息图	2:3	4K	信息图	数据密集、垂直布局
Favicon/图标	1:1	512	Logo	极简、可缩放、易识别
Pinterest图钉	2:3	2K	编辑	高垂直卡片

生成流水线

对于每个生成请求：

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预设：

# 使用已安装的Banana MCP/工具配置列出预设。

加载匹配的预设并应用为默认值。同时检查references/seo-image-presets.md获取SEO特定的预设模板。

生成后SEO检查清单

每次成功生成后，指导用户：

1. Alt文本：为生成的图像编写描述性、关键词丰富的alt文本
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": "包含目标关键词的描述性标题"
   }
   

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="描述性alt文本" />
   

成本意识

图像生成需要付费。保持透明：

• 在生成前显示预估成本（尤其是批量生成）
• 在已安装的Banana MCP/工具账本中记录每次生成（如果可用）
• 如果用户询问使用情况，使用已安装的Banana MCP/工具使用摘要

大致成本：

• 在报价前，请验证已安装的MCP/工具配置中的当前定价

模型路由

场景	模型	原因
OG图像、社交预览	已安装的MCP/工具默认 @ 1K	快速、经济高效
头图、产品照片	已安装的MCP/工具质量模型 @ 2K	质量+细节
含文字的信息图	已安装的MCP/工具文字能力模型 @ 2K，思考：高（如果支持）	更好的文字渲染
快速草稿	已安装的MCP/工具草稿模型 @ 512	快速迭代

错误处理

错误	解决方法
MCP未配置	运行./extensions/banana/install.sh
API密钥无效	在https://aistudio.google.com/apikey获取新密钥
速率限制（429）	等待60秒后重试。免费层：约10 RPM / 约500 RPD
IMAGE_SAFETY	重新措辞提示 - 参见references/prompt-engineering.md安全部分
MCP不可用	使用./extensions/banana/install.sh配置MCP；claude-seo不提供本地生成回退脚本
扩展未安装	显示安装说明：./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检查清单：alt文本建议、文件命名、WebP转换
5. Schema片段：ImageObject或og:image标记（如适用）