浏览模式与焦点模式
理解用户与页面交互的两种方式。
浏览模式与焦点模式 是 CoddyKit 上的免费 Web Accessibility Academy 课时。 这是第 3 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 Web Accessibility Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 Web Accessibility Academy 课程共包含 4 节课。
两种交互方式
桌面屏幕阅读器有两种模式。浏览模式用于朗读内容,而焦点模式用于输入内容。了解这两种模式可以消除许多困惑。🔁
浏览模式用于朗读
在浏览模式下,H、K 和箭头键等按键用于浏览页面。屏幕阅读器会拦截这些按键,让您可以快速浏览标题和链接。
虚拟副本
浏览模式基于页面扁平化后的虚拟缓冲区运行。因此,无论在哪种文档中,您都可以用相同的方式使用箭头键浏览文本。
焦点模式用于输入
当您到达文本字段时,屏幕阅读器会切换到焦点模式。此时,您按下的键会直接传递给输入框,而不是用于导航。
为什么切换很重要
如果没有两种模式,输入字母 H 时就会跳到标题,而不是写入 H。焦点模式让您能够真正填写表单。
自动切换
当焦点落在可编辑字段或需要接收原始按键的组件上时,NVDA 会自动切换到焦点模式。
手动切换模式
您也可以手动切换。在 NVDA 中,按 NVDA 加空格键可以在浏览模式和焦点模式之间切换,以纠正自动判断错误的情况。
NVDA: press NVDA + Space to toggle modesVoiceOver 中的对应功能
VoiceOver 将其输入状态称为 Quick Nav off。打开或关闭 Quick Nav,可以在探索和交互之间切换,作用类似于这两种模式。
自定义组件容易造成混乱
伪造的按钮或假装成菜单的 div 可能让屏幕阅读器处于错误的模式,导致按键无法执行有用的操作。
正确的角色可以解决问题
正确的角色会告诉屏幕阅读器何时进入焦点模式。真正的表单控件和正确的 ARIA 角色可以让模式按预期切换。
测试两种路径
进行检查时,请确认在浏览模式下可以正常朗读,并且焦点模式启动后每个输入框都能接受文本。
快速检查
屏幕阅读器的焦点模式允许用户做什么?
回顾
浏览模式负责朗读和导航;焦点模式负责输入和交互。正确的角色会自动触发模式切换,让用户始终能够顺利操作。✅
用 AI 导师学习 HTML — 免费
在浏览器中编写并运行真实代码,获得全天候 AI 导师的即时帮助,并在网页或应用中继续学习。
- 课程
- 30
- 课程
- 120
常见问题解答
「浏览模式与焦点模式」课时是免费的吗?
是的 — 「浏览模式与焦点模式」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 Web Accessibility Academy 课程的其余内容,请升级到 CoddyKit PRO。 Web Accessibility Academy 课程共包含 4 节课。
「浏览模式与焦点模式」这节课中我会学到什么?
理解用户与页面交互的两种方式。 你通过在浏览器中直接运行的动手代码来练习 Web Accessibility Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 Web Accessibility Academy 需要有经验吗?
无需任何先前经验。CoddyKit 上的 Web Accessibility Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 3 节课,共 4 节。
「浏览模式与焦点模式」课时需要多长时间?
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。
我能在这节 Web Accessibility Academy 课中编写并运行代码吗?
能。每节 Web Accessibility Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。