如何为图像编写好的替代文本,以帮助屏幕阅读器和盲人用户了解图片是什么？

Question

如何为图像编写好的替代文本,以帮助屏幕阅读器和盲人用户了解图片是什么？如果我们使用Alt文本那么如果我们在菜单图像等特殊情况下使用它们,那么标题="文本"应该是什么

Answer 1

我是一个屏幕阅读器用户,将使用Stackoverflow作为好的和坏的例子.

Alt标签应该简洁且具有描述性.例如,alt用于投票和投票选项的stackoverflow 标签很不错,因为它们不需要很长时间才能阅读并快速达到目的.坏alt标签的例子是让这个问题成为最喜欢的并接受这个答案.这两个标签都不是描述性的,最喜欢的标签只是" *"而接受答案标签是" check"我告诉他们的唯一方法是阅读消息来源或让某人看到它让我知道它们的用途.

至于title属性,我真的没有太多的建议.我的屏幕阅读器默认不读它们,所以我通常不会使用它们.可能有用的一个例子是附加信息.例如,我接受的答案率如此之低的原因是因为我无法说出我是否接受了一个问题的答案.如果接受此答案图形上的title属性会说"如果答案未被接受则单击以接受此答案 "并且"如果接受的答案是单击将此答案删除 ",那将是很好的.

Answer 2

你应该不会让视障用户理解图像的意义所在.对于盲人来说,图像实际上并不存在,所有的都是文本.

该alt文本应该工作作为一个单一的句子/段落可以被替换为图像,传达相同的内容,仍然是有意义的相邻内容的上下文.

如果图像是GUI的一部分,则alt文本应该传达动作(动词),行向上,回答或注销.

您应该访问您的网站links并尝试了解您的网站.如果存在饼图,则其alt文本应该是百分比的小摘要.如果你只是在博客文章旁边有一朵漂亮的花,不要给它一个alt像博客邮件#324的花图像伴侣或更糟糕的flower.jpg的innane 文本.

如果图像对导航很重要或获取信息,请尝试为其提供一个alt文本,使网站在没有图像的情况下工作.如果图像只是表现形式,请给它一个空alt文本.

title据我所知,只应在悬停时显示,因此他们应该为图像提供额外的信息,因此应避免无用的重复信息.对于屏幕阅读器,这有点棘手,因为用户之间的支持和配置可能非常不同.

一些经验数据显示title无用:

• 屏幕阅读软件的大多数用户不会更改其默认设置以访问链接上的TITLE属性信息.
• 大多数屏幕阅读软件默认情况下可以访问表单控件上的TITLE属性内容.
• 某些屏幕阅读软件无法访问TITLE属性信息.
• 屏幕放大镜的用户可以在较低放大率级别读取TITLE属性文本.
• 屏幕放大镜的用户无法读取TITLE属性文本,该文本包含超过1或2个单词,处于更高的放大级别.

这是一个很好的建议,比我更好

使用此选项可提供非必要的其他信息.大多数可视浏览器在元素悬停时将标题文本显示为工具提示,但是由浏览器制造商决定如何呈现标题文本.有些会在状态栏中显示文字.例如,早期版本的Safari就是这样做的.

title属性的一个很好用途是向链接添加描述性文本,特别是如果链接文本本身没有清楚地描述链接的目的地.通过这种方式,您可以帮助访问者了解链接的位置,可以避免他们加载页面,只是发现它不是他们感兴趣的内容.另一个潜在的用途是为图像提供额外的信息,例如日期或其他可能不重要的信息.

请记住,该longdesc属性应该是进一步信息的链接,而不是文本,因为有些人会错过它.