验证网页布局在窄时是否可用
辅助功能的一个重要部分是确保您的网站在狭窄的视区上正常运行。 许多用户需要缩放页面才能使用它，这意味着没有多少空间剩余。
当空间不足时，多列布局应转换为单列布局，内容按可理解的顺序放置。 这意味着将最重要的内容放在页面顶部，并将其他内容放在页面的更下一步。
通过调整浏览器窗口的大小来测试窄视区
在新窗口或选项卡中打开 辅助功能测试演示网页 。
右键单击网页中的任意位置，然后选择“ 检查”。 或者，按 F12。 DevTools 将在网页旁边打开：
通过将网页和 DevTools 之间的分隔符拖动到左侧，使浏览器窗口变窄。
呈现的网页会重新排列其布局以适合窄视区：
使用箭头键向下滚动页面并评估内容的可访问性。
双列布局现在是单列布局。 但顶部导航栏占用大量垂直空间，这使得阅读内容更加困难。 搜索表单也很难使用，因为它太窄：
用于测试窄视区的设备仿真工具
可以通过调整浏览器窗口的大小来模拟窄视区，但测试设计的响应性的更好方法是使用 设备仿真 工具。 下面是 设备仿真 工具的一些功能，可帮助你查找任何网站的辅助功能问题：
在不调整浏览器窗口大小的情况下，调整页面大小并测试 CSS 媒体查询 是否触发布局更改。
检查使用鼠标的依赖项。 默认情况下， 设备仿真 采用触摸设备。 这意味着，依赖于悬停交互的产品的任何功能都不起作用。
通过模拟不同的设备、缩放级别和像素比率来执行视觉测试。
测试产品在不可靠的连接或用户脱机时的行为方式。 在慢速连接上向用户显示最重要的交互也是一个可访问性考虑因素。
若要了解有关 设备仿真 工具的详细信息，请参阅 模拟移动设备 (设备仿真) 。