什么是替代文本助手?
选择图片类型,根据对应的提示编写替代文本,然后用无障碍检查清单验证。包含各类型的技巧和示例,帮你写出屏幕阅读器友好的描述。
从六种图片类型(照片、图标、图表、装饰、信息、图片链接)里选一种,输入框会自动切到对应的提示,引导你写出屏幕阅读器用户真正需要的描述。字符计数实时显示,超过 125 字符会提醒;旁边的六项清单帮你检查描述是否具体、简洁、考虑上下文、避免「image of」之类的废词、把最重要的信息放在最前面,并且没有出现逗号堆砌或关键词重复。装饰类图片会提示用 alt="" 让辅助技术直接跳过。
使用方法
- 选择您要描述的图片类型:照片、图标、图表、装饰性图片、信息性图片或图片链接。
- 根据图片类型的提示,写一段简洁的描述。
- 根据无障碍检查清单审核您的替代文本,然后复制并用于 HTML 或内容管理系统。
何时使用
- 在 Shopify 或 WordPress 商品图库上线前批量补齐 alt 属性。
- 为季度报告里的图表写 alt 文本,让屏幕阅读器用户也能拿到关键数字。
- 在无障碍审计前对照 WCAG 1.1.1 检查现有网站。
结果
对于展示第一季度销售额的柱状图:不要写“chart.png”,而应写“柱状图显示2024年第一季度各地区销售额:北美210万美元,欧洲180万美元,亚洲140万美元”。
常见问题
- 为什么 alt 文本被视为最重要的无障碍属性?
- 它是 WCAG 第一条(1.1.1 非文本内容,A 级)的核心要求,也是失明用户在每个页面都会立刻遇到的唯一硬性指标。缺失它不仅影响可访问性,搜索引擎和链接预览爬虫也会拿它当图片说明。
- alt 文本要多短?125 字符是硬性上限吗?
- 技术上不是。浏览器和屏幕阅读器都能处理更长的字符串。125 字符这条经验来自旧版 JAWS 的截断行为,新版屏幕阅读器已经修复;但短描述听起来仍然更不累。
- 纯装饰图(分割线、背景花纹之类)该怎么写?
- 用 alt=""(空字符串),而不是干脆不写 alt 属性。空 alt 会告诉屏幕阅读器跳过这张图。完全省略 alt,有些屏幕阅读器会去读文件名,反而更糟。
- 复杂图表怎么在 125 字符里说清楚?
- 先说图表类型和最关键的结论,而不是逐条罗列数据。「折线图,移动用户在 2024 Q3 超过桌面」比一长串月度数字有用。完整数据可以放在同一页其它位置的长文描述里。
- 要不要在开头加「图片」「照片」这种字眼?
- 不要。屏幕阅读器本身就会先念「图片」,你再写一遍就变成「图片,图片:一只猫」。直接从主体开始,比如「灰色猫坐在蓝色沙发上」。本工具的清单也会自动检查这一项。