专注于SPA的客户端路由的焦点模糊？

Question

我有一个单页面应用程序。有一个包含产品的页面，在底部有一个链接转到下一页。点击这个＆＃34;下一个＆＃34;链接DOM中的产品列表被替换。虽然点击的链接保持不变并保持点击的焦点。对我来说，做document.activeElement.blur()这样的事情会更好吗？或者我应该把重点放在原样上？

我不确定最佳做法是什么，与普通服务器路由页面一样，焦点将通过页面加载重置。但是，从可访问性的角度来看，我还没有看到任何表明手动重置客户端路由的信息将是最佳体验。

Answer 1

永远不要使用模糊。它只是糟糕，随机，可能令人沮丧。

在原生应用程序中，您应该始终确切地知道焦点的位置，并且焦点应始终位于精确的位置;否则键盘可访问性被破坏。 如果您认为您的Web应用程序是真正的应用程序，您应该遵循同样的严格要求。

所以，永远不要使用模糊，因为你根本不知道焦点随后会移动的地方。如果您要从当前具有焦点的DOM中删除某些内容，则应首先将其放在另一个有意义的位置。

在您的情况下：点击链接，您有两个合理的选择：

• 将重点放在链接上（只要您不移动，隐藏或从DOM中删除它，就是合理的）
• 将焦点移动到刚出现/刚被替换的新内容的开头

您可以向应用程序的用户询问他们认为最佳的解决方案，或者在测试会话期间通过观察它们来推断答案。

让我们快速总结一下：您是否正在制作一个包含不同页面的旧式网站，而且您不必关注焦点，或者您正在制作一个真正的应用程序在这种情况下，您应该像开发本机应用程序一样严谨。 非常简单。