WebAIM  - 无障碍记

键盘辅助功能

介绍

重要

确保所有的内容可以仅使用键盘进行访问。

键盘辅助功能是网页易读的最重要的方面之一。许多用户肢体残疾依靠在键盘上。盲人用户通常还使用键盘进行导航。有些人有震颤不容许精细肌肉控制。其他人很少或根本没有使用他们的手。有些人根本没有动手,无论是由于先天缺陷,事故或截肢。除了传统的键盘,一些用户可能会使用修改键盘或其他硬件模拟键盘的功能。

潜在问题

有迹象表明,网页可能给谁依靠键盘导航的用户的困难很多方面。下面是几个最常见的问题。

重点指标

键盘用户通常使用标签通过网络输入文本页面链接,按钮,输入框等,当一个项目有键盘的“焦点”,它可以激活或用键盘操作上的互动元素键导航。一个有远见的键盘的用户必须提供有视觉当前具有键盘焦点的元件的指示器。一个基本的焦点指示符由web浏览器自动提供,并且典型地示出为一个边界(称为轮廓)周围的聚焦元件。然而,这些轮廓可以通过应用隐藏概要:0要么概述:无CSS来可聚焦元素。

重要

避免概要:0或链接等元素可以接收键盘焦点类似的风格。

除了默认的轮廓,你可以使用CSS使对焦指示更直观明显,键盘友好通过添加背景颜色或其他视觉样式的链接,和其他控件将接收键盘焦点。大纲可样式,以配合您的网站设计。

不能接收键盘焦点项目

默认情况下,用户只能浏览到链接,按钮和一个键盘表单控件。这些本地访问的内容应尽可能使用万博体育官网网址。如果这是不可能的,你可能需要使用的tabindex = “0”确保元素可以接收键盘焦点。

冗长的导航

明眼人鼠标的用户能够直观地扫描网页,直接点击任何项目。键盘用户必须按标签键或其他导航键先于用户想要激活项目的互动元素进行导航。通过冗长导航互联可以是特别苛刻用于与马达残障用户。

链接或其它项目通航一长串可能造成只有键盘用户的负担。以下最佳做法可以方便高效键盘导航:

键盘测试

带键盘测试是任何访问性评估的重要组成部分。键盘测试的基础是简单的标签密钥可以通过链接和表单控件被用于导航,输入(有时空格键)选择的元素,和箭头键有时用于其他导航。然而,与键盘进行测试时,你是不是只是想与页面进行成功的交流,你也想确保所有交互是可以预见的。这需要共同键盘交互的理解。

下表包括许多最常见的在线互动,为互动,和对事物的附加信息的标准按键在测试过程中考虑。

相互作用 击键 笔记
导航到大部分元素
  • 标签
  • 转移+标签- 向后导航
  • 键盘焦点指标必须存在。
  • 导航顺序应该是合乎逻辑和直观。
链接 输入
按键 输入要么空格键 确保与ARIA元素角色=“按钮”可以用两个键指令来激活。
复选框 空格键- 选中/清除复选框 时,可以选择一个或多个选项应使用复选框。
单选按钮
  • /要么/- 选择一个选项。
  • 标签- 移动到下一个元素。
当可以选择从一组只有一个选择应使用的单选按钮。
选择(下拉)菜单
  • /- 菜单选项之间导航
  • 空格键- 扩大
您也可以通过键入字母过滤器,但这种行为由浏览器的不同而不同。当你的类型,比如自动完成一些会过滤。其他人则只能按首字母排序。例如,美国的国家名单,击中一种然后[R可以带你去一种rizona,或者它可能需要你阿拉巴马然后[RHODE岛。
自动完成
  • 键入开始过滤
  • /- 导航到一个选项
  • 输入- 选择一个选项
对话 退出- 关
  • 模式对话框应该保持键盘焦点。
  • 非模态对话框应该失去焦点自动关闭。
  • 当对话框关闭,焦点通常应返回到打开的对话框元素。
滑块
  • /要么/- 增加或减少滑块值
  • /结束- 开始或结束
  • 对于双滑块(到设定的范围),标签/转移+标签应各端之间切换。
  • 在一些滑块上一页/向下翻页可以通过较大的增量移动(例如,通过10)。
菜单栏
  • /- 上一个/下一个菜单选项
  • 输入- 展开菜单(可选),并选择一个选项。
  • /- 展开/折叠子菜单
  • 并非所有的菜单应该有这些控制。简单的菜单通常应该依靠标签/输入
Tab平板
  • 标签- 一旦导航到组选项卡并且一旦组选项卡的浏览出
  • /要么/- 上一个/下一个标签。
  • 这是“应用程序”选项卡,更改,恕不加载了新的一页。如果菜单看起来像一组选项卡,但实际上是一组链接到不同的网页,标签输入是比较合适的。
  • 按箭头键时,标签内容应自动更新。你不应该按Enter键来激活标签。
“树”菜单
  • /- 浏览上一页/下一页菜单选项
  • /- 展开/折叠子菜单,向上/向下移动一个级别。
滚动
  • /- 垂直滚动
  • /- 滚动水平
  • 空格键/转移+空格键- 滚动的页面

最小化水平滚动。

注意

ARIA创作实践文档提供了这些和其他常见的交互的附加信息。