SuperAPI AI 工具集

image-alt-text

设计与创作

查看项目

更新于 10-16 00:29

技能介绍

用途:在创建、审查或审计含图片的页面时,为每处图片使用确定合适的替代文本(alt),满足 WCAG 2.2 SC 1.1.1 非文本内容(A 级)。仅当项目含 <img>、作为内容的内联 SVG 或可能传达含义的 CSS 背景图时加载。

主要能力:提供按顺序判断的决策流程——图片是否为链接/按钮/控件的唯一内容;是否含重要文字;是否增加信息、含义、身份、状态或指令;相关信息是否已在附近提供;是否纯装饰。据此区分信息性、功能性、装饰性/冗余、复杂图片、图片文字等类型,并给出严重度分级(Critical/Serious/Moderate/Minor)与常见错误模式及修复方式。

必要用法:信息性图片描述含义而非外观,如 alt="Bar chart showing 23% revenue growth in Q3 2024";装饰性图片用 alt="",不要省略 alt,也不要写 alt="decorative";功能性图片描述动作或目的地,如 <a href="/"><img src="acme-logo.svg" alt="Acme home"></a>;图标按钮把名称放在控件上,如 <button type="button" aria-label="Close dialog"><img src="close.svg" alt=""></button>;复杂图片用简短 alt 加可见的详细等价内容(数据表、步骤等);图片文字优先改用真实 HTML 文本。响应式图片的 alt 放在 <picture> 内的回退 <img> 上,不要放在 <source>。图片地图给 <img> 整体 alt,给每个 <area> 各自 alt。

适用场景:网页图片、图标、图表、地图、信息图、徽标、扫描通知、CSS 背景图等无障碍处理,以及 CMS 作者流程与 AI 辅助 alt 草稿的审核。

限制:自动化工具只能发现结构问题(如缺失 alt),替代文本是否有意义、准确、符合语境必须人工判断。不得从外观推断人物身份、种族、性别、残障、宗教、年龄或情绪。CSS 背景图无 alt 支持,不能承载必要信息。AI 生成的描述必须经人工在渲染语境中复核。资料未提供具体安装命令、收费或平台信息。