1. google-axs-chrome
wenju / 进步博客
互联网用户体验设计部

2. 目录
ChromeVox ChromeVis
ChromeShades Lois TTS Voice

3. ChromeVox

4. ChromeVox
• Chrome OS内置的屏幕阅读器
• Chrome浏览器的一个扩展应用
– 下载地址
– 依附于Chrome浏览器，不能像JAWS、NVDA、永德等屏
幕阅读器可以访问浏览器之外的应用程序或者操作计
算机
– 不能和其他屏幕阅读器共同工作，称之为屏幕阅读器
模拟器更为恰当
– 支持最新的web标准，操作现代交互站点表现优异

5. ChromeVox用法
• 基本导航
– 焦点元素导航 Tab
– 页面内导航 Ctrl + Alt + ↓/↑
ChromeVox键
– 停止播报 Ctrl
– 当前位置开始朗读 Ctrl + Alt + R
– 命令帮助 Ctrl + Alt + .

6. ChromeVox用法
• 导航精确度
– 代表导航的细节水平，级别越高，细节越少，
可快速到达感兴趣的区域
– 级别： group
object
sentence
word
character
– 精确度调整： ChromeVox键 +
ChromeVox键 - / =
– 查看更详细级别
ChromeVox键 + ←/→

7. ChromeVox用法
• 高粘度模式
– 进入或退出，双击 Insert
– 无需按 Ctrl + Alt
– 规避快捷键冲突

8. ChromeVox用法
• 语音命令
控制音调
[ ]
ChromeVox + ; ‘
控制语速

9. ChromeVox用法
• 跳跃键（元素间导航） A
Q
Anchor
Block quote
B Button
Previous X Checkbox
/next C Combobox
G Graphic
H Heading
J Jump
ChromeVox + p/n + h ; Landmark
F Form Field
L Link
O List
I List item
R Radio button
S Slider
T Tables

10. ChromeVox用法
• 表格模式
T+E 强制退出表格模式
↓ 跳至表格下一行
↑ 跳至表格上一行
← 跳至表格前一列
→ 跳至表格后一列
ChromeVox + T then R 报读当前行标题
T then C 报读当前列标题
T then [ 跳至表格开头
T then ] 跳至表格结尾

11. ChromeVis

12. ChromeVis
• 透镜
– 下载地址
– 用于放大所选文字及更改其颜色。可用鼠标或
键盘在网页中四处移动所选文字。

13. ChromeVis用法
• 打开/关闭 0
• 6种样式 1-6
– 设置文字、背景颜色
• 位置 9
– 顶部固定
– 当前元素周围浮动
• 调整文字大小
– 增大文字 =
– 减小文字 -

14. ChromeVis用法
• 浏览
– 前移一句 Shift+s
– 后移一句 Shift+a

15. ChromeShades

16. ChromeShades
• 帮助发现无障碍问题
• 将网页重新格式化，模拟盲人使用屏幕阅
读器浏览网页
• 交互式web apps保留功能性，可用来测试实
际工作流程中的无障碍问题
• 不能替代屏幕阅读器测试，快速解决一些
常见问题

17. 去掉大部分样式
• 检查无样式的内容是否仍具有逻辑性，仍
容易理解

18. 保留语义标记
• 屏幕阅读器可以报读语义标记，如
<h1>, <li>, <strong>等

19. 突出标题结构层级关系
• 标题导航是屏幕阅读器用户常用的导航方
式

20. 识别交互控件
• 帮助你发现页面中的可交互元素是否设置
了合适的ARIA role
• 绿色显式且独占一行

21. 可见性
• 检查隐藏内容是否对屏幕阅读器可见
• 屏幕阅读器忽视 display: none 和
aria-hidden=“true”

22. Alt 及其他标记
• 检查img是否有alt属性及其属性值
• Form控件是否有<label>标签、aria-label属性、
title(部分屏幕阅读器有效，谨慎使用)

23. iframe

24. 布局表格
• 布局表格线性显式

25. Lois TTS Voice

26. 谢谢