使用“tab”键导航时平滑滚动

因为这个标记为可访问性,所以简单的答案是不要。

您可能不喜欢页面跳跃,但您必须考虑更改滚动行为的相反副作用。

如果您的用户有部分视力,并且页面上的缩放比例设置为300%,该怎么办?当缩放级别很高时,一个可选项卡项(如链接)可能会离开屏幕许多像素,等待它滚动到视图中只会令人沮丧。

另外,对于wcag 2.1(我认为适用于AA级)指南,您应该避免任何类型的动画,或者用户可以选择关闭它,您需要一个设置来直接在您的站点中删除滚动,这是增加了大量额外的工作。这是因为某些认知障碍会使动画比简单的跳跃更令人不安和分心,而且这也是预期行为——改变预期行为也会导致认知障碍者失去方向感。

另一个需要考虑的问题是,要实现这一点,你必须截取tab键——这是一个糟糕的想法,因为屏幕阅读器在不同的场景中严重依赖于这个键(在项目列表中截取tab键,在某些屏幕阅读器中截取下一个项目,会导致截取tab键以意想不到的行为。)

不用担心,残障和健全的用户会感谢你把tab键放在一边(因为我讨厌人们减慢我的滚动速度)。

如果你真的想这样做,你会截获按键的标签键,并手动循环到下一个标签元素-但请不要这样做!!

您还必须(对于辅助功能和wcag 2.1)添加一个选项,以便在站点辅助功能设置(如果有)中删除此功能。

平滑滚动是一种浏览器设置(chrome>about:flags、firefox>about:preferences、ie>tools>options>advanced)。您可以通过编程方式更改浏览器的设置,但这似乎是浏览器会阻止的安全风险。这是一个私人环境。有些用户喜欢它,有些不喜欢。如果你强迫一个不喜欢它的用户,那就不好了。