如何在一页上使用大量“详细信息”链接。无障碍网页不喜欢 “细节”

据http://webaim.org/standards/wcag/checklist#sc2.4.4 如何在一页上使用大量“详细信息”链接。无障碍网页不喜欢 “细节”

2.4.4链接目的（在上下文）（A级）

The purpose of each link (or form image button or image map hotspot) can be determined from the link text alone, or from the link text and its context (e.g., surrounding paragraph, list item, table cell, or table headers). 
Links (or form image buttons) with the same text that go to different locations are readily distinguishable.

等WAVE（无障碍网页评估工具 - http://wave.webaim.org）说我所有的“细节”链接不建议在我的网页上：

但我不能认为什么会更好。我真的不想用实际细节文本的前几个字符来混淆页面，因为我认为这会使页面显得过于混乱。

来源

2015-06-22 Michael Durrant

那么，有很多方法可以解决您的问题。仅举几例：

你可以添加一个title属性的各个环节（即标题=“上makeagoodpassword.com详细信息”），但是屏幕阅读器可能无法读出标题属性的值，所以你最好ARIA标签=“上makeagoodpassword.com详细信息”添加到您的链接标签
另一个（我的首选）选项将被隐藏文本，因为这似乎是最通用的解决方案：

<a href="#" title="Details on makeagoodpassword.com">Details <span style="display:none;" aria-hidden="false">on makeagoodpassword.com</span></a>

另请参阅：http://www.w3.org/WAI/WCAG20/quickref/#qr-navigation-mechanisms-refs其他选项。

来源

2015-06-22 09:11:53 bassface

要展开一点，屏幕阅读器会将整个页面加载到其缓冲区中，并允许用户扫描文档中的所有链接（或标题等）。这是一个非常常见的操作，可以概览文档的内容。在原始标记的情况下，用户将仅仅听到：“链接，细节”重复多次。这当然很没用，而且为什么像“click here”这样的链接文本是不鼓励的。在链接的文本中提供一些背景信息，对屏幕阅读器用户和视力用户更有用。 – steveax

如何在一页上使用大量“详细信息”链接。无障碍网页不喜欢 “细节”

回答

相关问题