introduction

Next.js 团队提交了一份满意的答卷(能够让所有开发人员以及终端用户可以访问Next.js),默认Next.js 已经增加了访问能力的特性,主要是让Web能够包括在每个人之内 …

路由通知

当在服务器上在页面之间的渲染的过渡(例如<a href>tag) 屏幕阅读器 以及其他辅助性技术通告这个页面的标题(当页面被加载),因此用户能够理解页面发生了改变 …

除了传统的页面导航之外,Next.js 也支持客户端过渡(为了提高性能,例如next/link),为了确保客户端过渡也能够让辅助性技术进行通告,Next.js 包括了一个路由通告器(默认) ..

Next.js 的路由通告器通过首先检测 document.title去查看页面的名称进行通告,然后<h1>元素,最终发现URL 的路径名称 … 为了大多数访问用户的体验,确保应用中的每一个页面都有一个独一无二且描述性的标题 ….

Linting

Next.js 提供了一个集成的 ESLint 体验(开箱即用),包括针对Next.js 定制的规则 .. 默认来说Next.js 包括了eslint-plugin-jsx-ally帮助更早的捕获访问性问题,包括警告在:

举个例子,这个插件帮助你增加额外的文本到 img标签,使用正确的aria-*属性,使用正确的role属性以及更多 …

禁用js

默认情况,Next.js 预渲染页面为静态Html页面,这意味着js是不必须的(为了渲染来自服务器的HTML 标签),并且能够在客户端用来增强交互性 …

如果你的应用禁用了js,仅仅html可以使用,你可以从应用中移除所有的js,通过使用一个实验性的标志:

  1. // next.config.js
  2. export const config = {
  3. unstable_runtimeJS: false,
  4. }

访问性资源