使用<br />和辅助功能

Question

从这个问题/答案:在屏幕阅读器中暂停可访问性似乎<br />在设计可访问的网站时不应该用于演示目的.我在这里可以访问意味着它适用于屏幕阅读器.

我在网页上有一个页脚.页脚只有三个链接.所以我有

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

我的问题是:我如何在三条不同的线上最好地显示三个链接？

我应该<br />先插入两个之后</a>,还是应该将每一行括起来<p> ... </p>？

重要的是,这是以"可访问的方式"完成的.我需要代码验证为XHTML 1.0 Strict.

Answer 1

通常，屏幕阅读器会在标签处拆分文本<br />，这可能会使句子听起来很奇怪。

如果您希望屏幕阅读器忽略<br />，以便它纯粹是演示性的，您可以添加该aria-hidden属性，如下所示：

<br aria-hidden="true" />

Answer 2

问题的关键是,屏幕阅读器将读取就在一个br标签,因为它并没有特别的意思是什么吧.甲换行符只是一个视觉指示器,而不是一个语义之一.在您链接到的另一个问题中,每个单独的行应该独立存在,因此br作为分隔符是错误的语义选择.

在你的情况下,看起来整个事情是一个语义句子(用逗号猜测),但应该只是在三行上呈现.在这种情况下,br非常适合插入视觉换行而不添加任何语义含义.

br=无间断读取,p=段落,在阅读时适当暂停.

Answer 3

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

\n\n

这种换行符通常出现在地址或诗歌中。

\n\n

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

\n\n

您可以使用任何适当的元素并在 CSS 中添加换行符 ( )，但是通过使用类似或 的display:block;元素，您将在默认情况下获得此行为，并且它还适用于文本浏览器和其他不支持 \xe2 的用户代理。 \x80\x99t 支持 CSS。pdiv

\n