メインコンテンツまでスキップ

アクセシビリティ

Next.jsチームは、Next.jsをすべての開発者（およびそのエンドユーザー）にとってアクセスしやすくすることに尽力しています。デフォルトでNext.jsにアクセシビリティ機能を追加することで、Webをより包括的なものにしようとしています。

ルートアナウンス​

サーバーでレンダリングされたページ間を遷移するとき（例：<a href>タグを使用）、スクリーンリーダーやその他の支援技術は、ユーザーがページが変更されたことを理解できるように、そのページの読み込み時にページタイトルをアナウンスします。

伝統的なページのナビゲーションに加え、Next.jsはパフォーマンス向上のためにクライアント側での遷移（next/linkを使用）もサポートしています。支援技術でもクライアント側の遷移がアナウンスされるようにするために、Next.jsはデフォルトでルートアナウンサーを含んでいます。

Next.jsのルートアナウンサーは、アナウンスするページ名を探すために、まずdocument.titleを確認し、次に<h1>要素、そして最終的にはURLのパス名を調べます。最もアクセスしやすいユーザーエクスペリエンスを提供するために、アプリケーション内の各ページが一意で説明的なタイトルを持つようにしてください。

リンティング​

Next.jsは、Next.js用のカスタムルールを含む統合されたESLintの体験を箱から出して提供しています。デフォルトでNext.jsはeslint-plugin-jsx-a11yを含んでおり、アクセシビリティの問題を早期に発見するのを助けます。以下への警告を含みます：

たとえば、このプラグインはimgタグにaltテキストを追加するよう確保し、正しいaria-*属性を使用し、正しいrole属性を使用することなどを助けます。

アクセシビリティリソース​