我试图让我的网站更易于为残疾用户访问，并且我一直在研究如何向图标添加替代文字。我使用的字体真棒图标和图标作为一个链接，该文档建议我加一个标题链接的锚标记周围，像这样：将替代文字添加到图标
<a href="path/to/shopping/cart" title="View 3 items in your shopping cart">
<i class="fa fa-shopping-cart" aria-hidden="true"></i>
</a>
但是，它似乎不工作与苹果的VoiceOver。它仍然只是读出“访问链接[？]”。有人对这个有经验么？
谢谢！
如果图标是内容（如果它传达的是信息，并且您没有其他文本已经传达该信息），那么用于表示它的元素不是斜体元素，而是元素<img> ，它支持alt属性。
因此，我应该用img替换我？ – user3781239
使用aria-label属性可能是你正在寻找的。
<a href="path/to/shopping/cart" aria-label="View 3 items in your shopping cart">
<i class="fa fa-shopping-cart" aria-hidden="true"></i>
</a>
我也建议做进一步的了解这2篇文章为什么title属性是普遍误解了，为什么不表现的方式你带领相信会的。
http://mrwweb.com/the-title-attribute-and-why-its-almost-useless/
你必须与aria-label属性共同地使用title属性。
title属性不总是通过辅助技术读取，但aria-label应该是。
不幸的是单独使用aria-label对于不使用屏幕阅读器的人来说没有任何帮助，title属性会给他们提供线索。
有两种方法可以在这里添加一些内容。
第一种方法是使用img元素以及适当的alt属性值，例如，
<a href="path/to/shopping/cart" >
<img src="url/source.jpg" alt="View 3 items in your shopping card" />
</a>
第二种方法是将一些文本添加到i元素和明显隐藏它：
<a href="path/to/shopping/cart">
<i class="fa fa-shopping-cart" aria-hidden="true">
<span class="sr-only">
View 3 items in your shopping cart
</span>
</i>
</a>
的.sr-only类添加到您的样式表：
.sr-only {
height: 1px;
width: 1px;
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
position: absolute;
}
第二种方法将允许更长的字符串，如果需要的话。它还可以防止在某些浏览器（Firefox，内存）上出现一些问题，如果文本在屏幕外对齐并且是链接的一部分，则用户在链接上标签会将焦点延伸到文本所在的位置，这会导致很长的，在屏幕上的薄盒子。
.sr-only通过使内容成为一个小的1px框然后剪切出来，并将健壮性定位在页面上。它受到所有现代浏览器的支持，并且只需要一个额外的剪辑规则，适用于不喜欢标准语法（clip: rect(1px 1px 1px 1px)）的较旧版本的IE。更多信息可以在Yahoo's developer blog找到。
至于哪一个是个人喜好的问题。如果使用图标集，我会去.sr-only向页面添加有意义的文本。如果您想使用img元素，则需要确保在内容更新时内容作者写入了有意义的内容，而不是描述图像的外观。
相关：[HTML可访问性，是否允许使用空元素？]（http://stackoverflow.com/q/32812349/1591669） – unor