图片
这不仅仅是向图像添加替代文本；远不止这些。
装饰图像
如果图像没有添加额外的上下文或信息（装饰图像）来让用户更好地理解上下文，那么它应该对辅助技术 (at) 隐藏，例如屏幕阅读器。
使用以下任何一种方法来隐藏 at 中的图像：
空文本替代 (alt)应用 aria添加图像作为 css 背景
@@##@@@@##@@@@##@@
如有疑问，请为图像添加描述。
空或 null alt
不要将图像 alt 属性设置为“”，除非图像纯粹是装饰性的。
alt=”” (empty) @@##@@ ignores the image completely decorative or non-informative images missing alt @@##@@ may read the filename/url not recommended; implies negligence
信息丰富的图像
如果图像传达概念、想法或情感，您应该包含描述图像用途的程序化替代文本。
尽可能添加非常详细的图像描述。
例如
@@##@@
如果图像是（内联），请添加 role=”img”。
由于元素不支持 alt 属性，请使用替代编码方法来提供描述。
功能图像
任何具有功能性目的的图像（例如，链接到主页的徽标、用作搜索按钮的放大镜图标）都应包含适当的替代文本。
替代文本应描述图像的操作，而不是其视觉方面。
如果图像既提供信息又具有可操作性，您可以为每个元素添加替代描述 – 但这不是必需的。例如
复杂图像
如果图像需要比装饰性、信息性或功能性图像更多的解释（包括信息图表、地图、图形/图表和复杂插图），请使用这些方法中的任何一种来添加替代描述
链接到资源或提供跳转链接到页面稍后的较长说明。例如
将 aria-scribedby 属性附加到 元素，然后将图像链接到包含较长描述的 id。例如
@@##@@in this course, you will learn more about the anatomy of a ladybug, including the head, antenna, eye, pronotum, elytra, leg, abdomen, and wing.
将简短的替代描述与较长的描述分组是使用
替代文本最佳实践
建议将替代文本限制在 150 个字符或更少，以避免读者疲劳。
避免在说明中使用 “图像” 或 “照片” 等词语，因为屏幕阅读器会识别这些文件类型。
命名图像时，尽可能保持一致和准确。当替代文本丢失或被忽略时，图像名称是后备。
避免使用非字母字符（例如 #、9、&）
在图像名称或替代文本中使用单词之间的破折号，而不是下划线。
尽可能使用正确的标点符号。如果没有它，图像描述听起来就像是一个漫长的、永无休止的连续句子。
像人类而不是机器人一样编写替代文本。关键字堆砌对任何人都没有好处——使用屏幕阅读器的人会感到恼火，搜索引擎算法会惩罚他们。
以上就是无障碍 (a) 规则 – 3的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1498149.html
微信扫一扫 
支付宝扫一扫 
