Question

我遇到NVDA屏幕阅读器的问题，因为它会在一个块中读取同一行的所有元素。

例如，使用以下代码：

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Title</title>
        <style>
        nav > ul > li {
            list-style: none;
            display:inline-block;
        }   

        </style>
    </head>
    <body>
        <h1>Title 1</h1>
        <nav role="navigation">
            <ul>
                <li>
                  <a href="#">Link 1</a>
                </li>
                <li>
                  <a href="#">Link 2</a>
                </li>
                <li>
                  <a href="#">Link 3</a>
                </li>
                <li>
                  <a href="#">Link 4</a>
                </li>
            </ul>
        </nav>
    </body>
</html>

这将显示一行中的所有导航链接，这在视觉上是正确的，但是在浏览模式下，当使用箭头键滚动时，NVDA将一起读取所有链接。用户不能在每个单独的链接之间移动，这意味着不可能保持一个并选择它。

段落中间的链接也是如此：

<p>NVDA will not stop on <a href="#">This link</a> so a user can select it.</a>

在我的导航示例中，更改样式以使每个链接位于单独的一行：

        nav > ul > li {
            list-style: none;
            display:block;
        }

解决了NVDA的问题 - 用户可以在链接之间移动 - 但视觉上是错误的。

我发现使视觉上正确并迫使NVDA单独阅读的唯一方法是将每个锚点显示为列表项目中的一个块：

        nav > ul > li {
            list-style: none;
            display:inline-block;
        }   

        nav > ul > li > a {
            display: block;
        }

但这种感觉很糟糕，并不是每种情况下的解决方案（例如，这不适用于段落中）。

是否有我可以添加的属性，或者是否有其他更好的方法让NVDA分别读取每个元素？

此问题适用于所有浏览器。

Answer 1

您无需执行任何操作，用户可以导航到每个链接并激活它们。用户可以使用CONTROL键在任何时候中断读取。此外，在读取链接后，用户可以使用SHIFT-TAB键向后导航到每个链接。用户也可以使用K键在链接之间导航。此外，用户可以使用NVDA + control + leftArrow键逐字向后移动。

这里的关键是通过确保每个链接都具有href属性来确保每个链接都可以与TAB一起使用。因此<a>Not really a link</a>不会被识别为链接，也不会成为TAB的焦点。

以下是NVDA http://community.nvda-project.org/documentation/userGuide.html

的键盘命令参考

如果您想更改默认行为以使NVDA读取链接就像每行只有一个，就像JAWS那样，请执行以下操作：

转到NVDA菜单（插入| n）。
转到偏好设置。
选择浏览模式。
取消选中第二个复选框，“支持时使用屏幕布局。”
选择确定。
返回NVDA菜单（插入| n）。
选择“保存配置”。如果不这样做，根据您配置NVDA的方式，此更改可能不会在重新启动后保留。

如何分别在同一行上制作NVDA读取元素？

1 个答案: