我正在阅读WCAG 2.0技术H30。
程序说:
对于使用此技术的内容中的每个链接:
- 检查文本或非文本内容的替代文本是否存在包含在元素
中- 如果img元素是a元素的唯一内容，检查它其文本替代描述的目的
- 如果a元素包含一个或多个img元素和文本img元素的备选项为空，检查文本说明
链接的目的- 如果a元素只包含文本，检查文本是否描述链接
的目的
我专注于第2点:如果img具有alt属性，但没有文本替代，该怎么办?
<a href="http://www.mystite.com">
<img src="http://www.mystite.com/myimage.jpg" alt="Description of the image" />
</a>
我认为你的例子不符合技术要求。
您的a元素只包含一个img元素。根据H30，该图像的alt属性应该包含关于链接目标的信息，而不是关于图像本身的信息。
http://www.w3.org/TR/WCAG20-TECHS/H30.html H30-description:
当图像是链接的唯一内容时，该图像的替代文本描述了该链接的唯一功能。
根据我的理解，alt属性是描述图像的文本'alt'。这是当您将鼠标悬停在图像上时显示的内容，也是当没有渲染图像或用户使用文本到口头翻译时显示的内容。所以，是的，你所举的例子确实符合规则。
一个很好的参考是这个堆栈溢出的答案我发现。它有助于展示如何去做:
我是一个屏幕阅读器用户，将使用Stack Overflow作为一个好的和坏的例子。
Alt标签应该是简短和描述性的。例如，Stack Overflow的投票赞成和投票反对选项的alt标签很好，因为它们不需要很长时间阅读，而且很快就能找到重点。坏的alt标签的例子是:让这个问题成为最喜欢的，并接受这个答案。这两个标签都不是描述性的，最喜欢的标签只是"*"接受答案标签是"检查"对我来说，唯一能告诉我它们是什么的方法是阅读来源或让有视力的人告诉我它们是干什么用的。
至于标题属性，我真的没有太多建议。我的屏幕阅读器默认不读取它们，所以我通常不使用它们。附加信息就是一个有用的例子。例如，我的接受答案率如此之低的原因是因为我无法判断我是否接受了一个问题的答案。如果接受这个答案图形上的title属性能像"点击接受这个答案"这样写就好了如果答案未被接受，并"点击将此答案从接受的答案中删除";