的使用和可访问性答案

【问题标题】：Use of and accessibility 的使用和可访问性
【发布时间】：2015-11-19 04:51:24
【问题描述】：

从这个问题/答案：Pausing in a screen reader for accessibility 看来，在设计可访问的网站时，不应将  用于演示目的。我认为这里的可访问性意味着它可以很好地与屏幕阅读器配合使用。

我在网页上有一个页脚。页脚只是三个链接。所以我有：

<div id="footer">
  <a href="xxx">xxx</a>,
  Email me: <a href="mailto:yyy">yyy</a>, 
  <a href="zzz">zzz</a>
</div>

我的问题是：

如何最好地将三个链接显示在三个单独的行上？

我应该在前两个</a> 之后插入一个 ，还是应该将每一行括在 ...  中？

以“可访问的方式”完成这一点很重要。我需要验证为 XHTML 1.0 Strict 的代码。

【问题讨论】：

您是否针对特定的浏览器/浏览器版本？
嘿@Thomas，您正在寻找的是块级元素和内联元素之间的区别。简而言之，标签是显示在同一行的内联元素。查看以下链接了解更多信息。 w3schools.com/html/html_blocks.asp 现在，要解决您的问题，您可以简单地将锚标记包装在块级元素中（例如
）。
似乎您的问题已经在同一个答案中得到了回答，不是吗？ “您特别希望每一行都是分开的，因此您应该将它们放在包装块级标签中。您可以将每一行包装在 p 或 div 标签中，然后屏幕阅读器会正确地将它们分开。 "
我会说 方式是要走的路。这样，您可以根据需要为每个人添加不同的 css 和边距/填充。我认为  在这个地方在语义上是错误的，但实际上我之前就读过这个。所以我可能错了。
类似的东西..我会说把.my-anchor-tag-class {margin-bottom: 5px;}然后应用到你想要的所有a。 <a class="my-anchor-tag-class">

标签： html accessibility line-breaks xhtml-1.0-strict

【解决方案1】：

一般来说，屏幕阅读器会在 标签处分割文本，这会使句子听起来很奇怪。

如果您希望屏幕阅读器忽略 ，使其纯粹是展示性的，您可以添加aria-hidden 属性，如下所示：

<br aria-hidden="true" />

【讨论】：

【解决方案2】：

  将导致屏幕阅读器稍作停顿。我发现在包含跨度中使用 role=text 可以解决此问题。

<span role="text">The<br>End</span>

【讨论】：

【解决方案3】：

br element 只能用于“实际上是内容的一部分”的换行符。

此类换行符通常是in addresses 或in poems。

就您而言，出于布局原因，您似乎只需要换行符。所以在那里使用br 元素是不正确的。

您可以使用任何适当的元素并在您的 CSS (display:block;) 中添加换行符，但是通过使用像 p 或 div 这样的元素，默认情况下您会获得此行为，并且它还具有额外的好处适用于不支持 CSS 的文本浏览器和其他用户代理。

【讨论】：

【解决方案4】：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<head>
<title>Strict</title>
</head>
<body>
<div id="footer">
  <a class="links" href="xxx">xxx</a>
  <div class="email">Email me:<a class="links" href="mailto:yyy">yyy</a></div> 
  <a class="links" href="zzz">zzz</a>
</div>
</body>
</html>

你可以包装一个 div 或者你也可以使用<ul> 标签。这是有效的代码。 Div 是一个块元素，所以它会破坏东西。

 也没有错

如果您想在不寻常的地方插入换行符，而您实际上是指换行符，请使用换行符。

【讨论】：

【解决方案5】：

关键是屏幕阅读器会直接阅读br 标签，因为它对它没有特别的意义。 换行符只是一个视觉指示符，而不是语义指示符。在您链接到的另一个问题中，每一行都应该独立存在，因此 br 作为分隔符是错误的语义选择。

在您的情况下，看起来整个内容在语义上是一个句子（用逗号猜测），但应该只分三行呈现。在这种情况下，br 非常适合插入 visual 换行符而不添加任何语义含义。

br = 不间断阅读，p = 段落，阅读时适当暂停。

【讨论】：

好的，我明白了。所以听起来我可以做两者中的任何一个。如果我想暂停一下，那么我可以使用，如果我只想将内容作为一个句子读出，我可以使用 。我想我可能会选择。