“顺序焦点导航起始点”功能用于定义在没有焦点区域时，系统从何处开始搜索可聚焦元素以进行顺序焦点导航（[Tab] 或 [Shift-Tab]）。这对于“跳过链接”等无障碍功能和管理文档中的焦点特别有用。
HTML 为我们提供了许多内置支持来处理键盘互动，这意味着，我们可以非常轻松地编写可通过键盘使用的网页，无论是由于运动障碍而无法使用鼠标，还是因为我们效率极高，从键盘上移开手会浪费宝贵的几毫秒时间。
键盘处理围绕焦点展开，焦点决定键盘事件在页面中的去向。到目前为止，在某些情况下，我们需要执行一些额外的工作，才能让键盘用户顺利使用。借助 focus() 方法，我们可以选择性地选择要作为焦点元素来响应用户操作的元素，从而管理焦点。不过，这种最佳实践存在许多问题，并且需要一些棘手的 JavaScript 黑客技术才能提供基准体验。
虽然这种技术不会很快完全消失，但在 Chrome 50 中，由于引入了顺序焦点导航起点，因此在大多数情况下都不需要使用此技术。经过此项更改，编写良好的网页会自动变得更易于访问，而无需额外手动管理焦点。我们来看一个示例。
页面内的链接
以文本为主的网站通常会在同一页面中建立互链，以帮助用户快速跳转到重要部分。
<!-- Table of Contents -->
<a href="#recipes">Recipes</a>
<a href="#ingredients">Ingredients</a>
<!-- Recipes Section -->
<h2 id="recipes">Recipes</h1>
<h3>Vegemite Cheesecake</h3>
<p>
Vegemite cheesecake is delicious. We promise.
<a href="cheesecake.html">Read More</a>
</p>
如果我是键盘用户（并且喜欢澳大利亚食物），接下来我会执行一系列操作，如下所示：
- 按两次
Tab将焦点移至“食谱”链接 - 按
Enter即可跳转到“食谱”部分 - 再次按
Tab可将焦点移至“了解详情”链接
我们来看看使用 Chrome 49 时的情况。
哦，事情似乎没有按计划进行，对吗？
最后一次按 Tab 时，焦点移到了目录中的下一项，而不是将焦点移至“了解详情”链接。这是因为开发者未在标题上设置 tabindex="-1" 以使其可聚焦。因此，点击名为 #recipes 的锚点不会移动焦点。这是一个细微的错误，如果您使用的是鼠标，则不是什么大问题。但如果您是键盘或开关设备用户，这可能非常重要。想想典型维基百科页面上的互链数量？如果必须不断地在所有这些锚点之间切换，那将会很令人沮丧！
现在，我们来看看使用 Chrome 50 时的相同体验。
太棒了，这正是我们想要的，而且最重要的是，我们无需更改代码。浏览器只是根据我们在文档中的位置确定了焦点应该放在哪里。
工作原理
在焦点起始点实现之前，焦点始终会从上一个聚焦的元素或页面顶部移动。这意味着，选择下一个焦点对象可能涉及将焦点移至不应真正可聚焦的对象，例如容器元素或标题。这会导致各种奇怪的行为，包括在您无意中点击此类元素时显示焦点圈。
顾名思义，焦点起点提供了一种机制，用于建议在按 Tab 或 Shift-Tab 时从何处开始查找下一个可聚焦元素。
可以通过多种方式进行设置：如果某个内容获得焦点，它也是焦点导航的起点，就像之前一样。此外，与之前一样，如果没有其他任何内容设置焦点导航起点，则起点将是当前的 document，或者当前处于活动状态的 dialog（如果可用且受支持）。如果我们导航到上例中的页面 fragment，系统现在会设置焦点起始点。此外，如果我们点击页面上的任何元素（无论该元素是否可聚焦），现在都会设置焦点导航起点。
最后，如果从 DOM 中移除焦点起始点的元素，则其父元素会成为焦点起始点。再也不用像打老鼠一样来回切换焦点了！
其他用例
除了上述示例之外，还有许多其他场景都非常适合使用此功能。
隐藏元素
有时，用户会聚焦于需要设置为 visibility: hidden 或 display: none 的项。例如，轮播界面中的可点击项。在较低版本的 Chrome 中，以这种方式隐藏当前聚焦的项会将焦点重置为默认的起始点，这会将上述轮播界面变成行动不便用户的恶意陷阱。使用顺序焦点起点后，这种情况就不再存在了。如果通过上述任一方法隐藏元素，按 Tab 键只会移至下一个可聚焦项。
跳过链接
跳转链接是不可见的锚点，只能通过键盘访问。借助这些功能，用户可以“跳过”导航元素，直接跳转到页面内容，这对键盘和摇杆设备用户来说非常有用。如 WebAIM 网站中所述
许多热门网站都实现了跳过链接，但您可能从未注意到。
由于跳转链接是命名锚点，因此其运作方式与我们原始的目录示例相同。
注意事项和支持
目前，Chrome 50、Firefox 和 Opera 支持顺序焦点导航起点。在所有浏览器都支持该功能之前，您仍然需要向命名的锚点目标添加 tabindex="-1"（并移除焦点轮廓）。
演示
顺序焦点导航起点是浏览器的一组无障碍功能基元的重要补充。它易于理解，实际上可以让我们从应用中移除代码，同时改善用户体验。双赢！请查看演示，详细了解此功能。