广泛部署的技术

越来越多的移动设备依赖于触控。尽管在Web平台中公认的传统交互方式(键盘、鼠标输入)仍然可以在这种情况下应用,但更具针对性地处理触控输入是创建适应性良好的用户体验的关键因素,文档对象模型中的触摸事件可以解决这个问题。

振动 API 让移动开发者利用触觉反馈来创建新的交互形式(例如在游戏中)。

移动设备被用户随身携带,许多移动用户依赖它们去提醒和通知自己事件,如消息。Web通知规范使这种特性在 Web 环境中可用。

移动设备硬件的限制和不同的使用环境,会使残疾人体验到相似的障碍。而这些障碍的相似性意味着相似的方法可以被用来解决这类问题,使拥有移动设备的残疾人能无障碍访问网站就成为一个自然而然的目标(详见移动 Web 最佳实践与 Web 内容无障碍指南之间的关系)。

Web内容无障碍指南和用户代理无障碍指南工作组就 WCAG 和其它的 Web 无障碍指南如何应用到移动设备提供了指导。更确切地说,这使残疾人在使用移动设备时能够更简单地访问网站和应用程序。

WAI-ARIA提供有关部件、结构和行为钩子的语义信息,使 Web 应用程序能无障碍地访问,包括在移动设备上。

特性规范成熟度现有实现
基于触控的交互触摸事件 (Touch Events)REC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

振动振动 API (Vibration API)REC

已有稳定实现
shipped in firefoxshipped in chrome

通知Web 通知 (Web Notifications)REC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

信息无障碍移动 Web 最佳实践与 Web 内容无障碍指南之间的关系 (Relationship between Mobile Web Best Practices (MWBP) and Web Content Accessibility Guidelines (WCAG))NOTE

移动无障碍性:Web内容无障碍指南2.0和其他 W3C 无障碍计划如何应用到移动设备 (Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply to Mobile)ED

可访问富互联应用 1.0 (Accessible Rich Internet Applications (WAI-ARIA) 1.0)REC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

开发中的技术

指针事件工作组在处理用户输入的替代方法上取得了很好的进展。指针事件允许统一处理鼠标、触摸和笔事件。它为当前更广泛部署的触摸事件提供了一种补充和更统一的方法。

特别是,CSS 的 touch-action 属性使元素上的过滤器手势事件在实现指针事件之外进一步发展。

输入设备能力API的早期方案提供来自支持触摸设备的给定“鼠标“事件的信息。

随着越来越多的内容被呈现为很长的可滚动列表,越来越多的逻辑被附加到滚动事件上,而且这些动作的用户体验的质量高度依赖于它们的性能。CSSOM 视图模块确定滚动事件何时被触发,并让开发者指定他们想要的滚动行为的类型。

CSS 滚动捕捉点的提议通过定义当用户移动页面时应用视图捕捉的点,大大增加了控制平移和滚动行为的能力。

CSS 的 will-change 属性也可以向浏览器指示将会很快被滚动到的部分并指示这部分应该被预渲染。

推送API使服务器端的通知可以提醒用户,即使是在浏览器没有运行的情况下。

不论用户使用语音向它们的应用设备下达命令还是通过非触觉交互来处理这些命令,他们都面临着由于屏幕保护程序导致的屏幕自动关闭的风险。唤醒锁 API 让开发者在这种情况下保持屏幕不锁定。

特性规范成熟度现有实现
基于触控的交互指针事件第二版 (Pointer Events - Level 2)WD

开发中
indevelopment in firefox

已有稳定实现
shipped in chromeshipped in edge

指针事件第二版中的touch-action (touch-action in Pointer Events - Level 2)WD

已有稳定实现
shipped in firefoxshipped in chromeshipped in edge

输入设备能力 (Input Device Capabilities)ED

平滑滚动CSSOM视图模块 (CSSOM View Module)WD

CSS 滚动捕捉点第一版 (CSS Scroll Snap Module Level 1)CR

已有稳定实现
shipped in firefoxshipped in edgeshipped in safari

CSS Will Change Module Level 1CR

考虑实现
consideration in edge

已有稳定实现
shipped in firefoxshipped in chromeshipped in safari

通知推送 API (Push API)WD

开发中
indevelopment in edge

已有稳定实现
shipped in firefoxshipped in chrome

屏幕唤醒唤醒锁 API (Wake Lock API)CR

探索性工作

移动设备,特别是手机,在很多情况下也非常适合语音交互;语音 API 社区组开发了一个JavaScript API 来支持通过口头命令与网页进行交互。语音合成在浏览器中有很好的支持。对语音识别的支持仍在进行中。

输入法 API 允许脚本通过用户代理访问输入法。该规范目前需要更多的编辑工作。

特性规范小组实现意向
基于语音的交互Web 语音 API中的Speech synthesis (Speech synthesis in Web Speech API)语音 API 社区组 (Speech API Community Group)

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

Web 语音 API中的Speech recognition (Speech recognition in Web Speech API)语音 API 社区组 (Speech API Community Group)

考虑实现
consideration in edge

已有实验性实现
experimental in firefox

已有稳定实现
shipped in chrome

输入法输入法 API (Input Method Editor API)Web 平台工作组 (Web Platform Working Group)

已有稳定实现
shipped in edge

不再进行的工作

基于意图的事件
随着 Web 来到新的设备上,并且设备获得新的用户交互机制,允许 Web 开发者对更抽象的用户交互集合作出响应似乎是有用的,而不是将工作集中在“点击”、“按键”或“触摸事件“,能够按照用户如何下达给设备的“撤消“或“下一页”命令单独作出响应。IndieUI Events 规范就是为了解决这个需求。 由于缺乏实现,目前这项工作已经停止。