无障碍访问

Next.js 团队致力于让所有开发者(及其终端用户)都能无障碍使用 Next.js。通过在 Next.js 中默认集成无障碍功能,我们旨在让互联网对每个人更加包容。

路由播报

当在服务端渲染的页面之间跳转时(例如使用 <a href> 标签),屏幕阅读器和其他辅助技术会在页面加载时播报页面标题,以便用户知晓页面已切换。

除了传统的页面导航外,Next.js 还支持客户端转场以提升性能(使用 next/link)。为确保客户端转场也能被辅助技术播报,Next.js 默认内置了路由播报器。

Next.js 路由播报器会依次检查 document.title<h1> 元素和 URL 路径名,以确定要播报的页面名称。为提供最佳的无障碍用户体验,请确保应用中的每个页面都具有唯一且描述性的标题。

代码检查

Next.js 默认提供集成的 ESLint 体验,包括针对 Next.js 的自定义规则。默认情况下,Next.js 包含 eslint-plugin-jsx-a11y 插件,可帮助及早发现无障碍问题,包括对以下情况的警告:

例如,该插件可确保您为 img 标签添加替代文本、使用正确的 aria-* 属性、正确的 role 属性等。

无障碍资源

On this page