屏幕阅读器的html5辅助功能

Question

如何为此

添加辅助功能

文字：

按钮，图像和锚点：

  for(WebElement item : itemList ){

      item.click();
   }

Answer 1

提供的信息太少。需要上下文。话虽如此：

• 将alt属性添加到<img>，
• 确保该链接具有有效的href，
• 不要依赖FontAwesome图标来传达重要信息，
• 可能会转储role属性，因为可能不需要它（需要知道必要的上下文）。

Answer 2

只有您适合在代码和内容中正确添加语义，因此我们无法为您执行此操作。但是，这里有一些重要的事情需要记住/做/遵循：

• 您的HTML无效，因此请correcting that开始。

• 因为它的制作方式，所以不要使用HTML元素 可见的页面外观（即使用类似<h4>的标题来制作文本 小而大胆）。 CSS应该用于所有布局和演示。

• 使用最合适的HTML元素来传达您拥有的内容的语义。对于 例如，如果您确实是这样，请继续使用<table>元素 尝试显示表格数据并使用<ul>和<li>制作菜单。

• 尽管有（很多）神话，HTML5分区元素（section， 大多数屏幕阅读器无法识别article，nav，aside）。它们的使用实际上使创建有效的文档大纲变得更加困难。

• 正确使用标题（<h1> ... <h6>）元素是最好的 你可以对convey a proper document structure做些什么。

• 在适用的情况下使用WAI-ARIA具有里程碑意义的角色 多年的标准和所有主要的屏幕读者都了解 它

Answer 3

对于图片，请为alt标记提供<img>属性，该标记是图片的说明。例如，<img class="profile-img" alt="profile picture">。

对于语义，请使用<em>代替<i>和<strong>而不是<b>。

另外，请查看ARIA（可访问的富Internet应用程序）。有用的ARIA属性是角色属性。它提供了有关元素目的和功能的额外内容。