NVDAを用いたチェックの実施方法

Windows用スクリーン・リーダーのNVDAの初期設定の方法と、基本的な使い方について記します。

なお、本稿のキー操作の説明では、NVDA + Nのような表記をしていますが、これは初回起動時の設定の項で説明する「NVDA制御キー」を押しながらNを押すことを意味します。

標準環境

freeeでは、スクリーン・リーダーを用いて行う必要があるチェックについては、Windows上でNVDAとGoogle Chromeのそれぞれ最新版で実施することにしています。

macOSではなくWindowsを採用しているのは、日本においてはスクリーン・リーダーを利用している視覚障害者のほとんどがWindowsを利用していると考えられるためです。[1] NVDAを採用しているのは、WAI-ARIAなどの最新のWeb技術への対応が最も進んでいるスクリーン・リーダーであると考えられるためです。Google Chromeを採用しているのは、freeeでは最新版のGoogle Chromeを推奨環境としているためです。

様々な環境で問題なく動作するものを実現できるのが理想ですが、こういった理由で、freeeでは最低限NVDAで問題なく動作するものを目指しています。

事前準備

参考動画

NVDAのインストール

以下の手順でNVDA日本語版の最新版をインストールします。インストール完了後の画面で、NVDAが自動的に起動します。NVDAが起動すると、いろいろな挙動が普段と異なった状態になりますので、後述するNVDAの終了方法を予め確認しておくことをお勧めします。

  1. NVDA日本語チームのサイトから、NVDA日本語版の最新リリースをダウンロード(https://i.nvda.jp/にアクセスすると、自動的にダウンロードが開始される)

  2. ダウンロードしたファイルを実行(実行すると音が出るので注意)

  3. 使用許諾条件を確認後、「同意する」をチェック

  4. 「このコンピューターにNVDAをインストール」をクリック

  5. 「ログオン画面でNVDAを使用」のチェックを外す

  6. 「継続」をクリック

  7. Windowsのユーザーアカウント制御の確認ダイアログでインストールを許可

  8. インストールが完了したら「OK」をクリック

初回起動時の設定

NVDAの初回起動時には、「ようこそ画面」が表示されます。

スクリーン・ショット:NVDAの「ようこそ画面」

以下を参考に、必要な設定をすると良いでしょう。

なお、インストール後にこの画面を再度表示したい場合は、後述するNVDAメニューでヘルプ ‣ ようこそ画面の順にクリックします。

キーボード配列

通常は「デスクトップ」を選択します。

「ラップトップ」は、テンキーがないキーボードを使っている場合に便利なキーマップがデフォルト設定になっています。ただ、通常のチェック作業においては、テンキーに割り当てられた機能を使うことはほとんどありませんので、どちらを選んでも問題ありませんが、Web上の情報などはデスクトップ配列を想定して書かれているものが多いので、デスクトップのままにしておくと良いでしょう。

NVDA制御キー

NVDA制御キーは、他のキーと組み合わせて押下することでNVDAの機能を実行するためのキーで、デフォルトではInsert (Ins)キーになっています。ただ、ノートPCなどInsキーを搭載していない機種もあり、そのような環境での利用を可能にするために、他のキーをNVDA制御キーとして使う設定ができるようになっています。

テンキーがある場合、NumLockをオフにした状態で0キーを使うことが可能ですので、ようこそ画面では特になにも設定する必要はありません。

テンキーがない場合やInsキーがない場合は、変換無変換、あるいはその両方を使う設定にすると良いでしょう。

Escキーを指定できるようになっているのは、上記のいずれのキーもないような環境を想定したもので、具体的にはmac OS上の仮想Windows環境でNVDAを使用しているような場合に便利です。

なお本稿の説明では、NVDA制御キーをNVDAと表記します。例えば、NVDA + Nと表記した場合、ここで設定したNVDA制御キーを押しながらNキーを押すことを意味します。

その他の設定

検証作業の際のみNVDAを使う場合は、「Windowsへのログオン後に自動的にNVDAを起動」のチェックを外します。

この画面での設定は、今後変更することはほとんどありませんし、設定メニューから変更することも可能ですので、「NVDA起動時にこのダイアログを表示」のチェックは外しておくと良いでしょう。

その他の初期設定

NVDAには、ようこそ画面で設定できる項目以外にも、設定画面にかなり多くの設定項目があります。ここでは、NVDAを検証作業に使う場合に便利な設定について記します。

設定画面は、画面右下のシステムトレイにあるNVDAのアイコンをクリックして表示されるメニューから開くことができます。このメニューはNVDA + Nを押下することでも表示できます。

「設定」画面では、左側に設定カテゴリーが表示され、右側に選択中のカテゴリーの設定項目が表示されます。

スクリーン・ショット:NVDA設定画面(「一般」を選択)

以下、最初にしておくと良い設定について、カテゴリーごとに記します。

音声

参考動画
スクリーン・ショット:NVDA設定画面(「音声」を選択)

「音声エンジン」が、「Windows OneCore音声」になっていることを確認します。

「早さ」や「高さ」を、好みに合わせて変更します。もし高速な音声に慣れてきて、「早さ」を最高にしても遅く感じる場合は、「高速読み上げ」をチェックしたうえで、「早さ」を調整してみると良いでしょう。

なお、後述するように、音声の速度や高さは、この設定画面を開かなくても変更できるショートカット・キーがあります。

「サポートされている場合自動的に言語を切り替える」と「サポートされている場合自動的に方言を切り替える」の2項目は、日本語以外の自然言語の読み方に関するものです。この2項目をチェックしておくと、Webページで用いられている言語が適切に指定されているかどうかを確認する、チェックID:0621チェックID:0921を実施することが容易になります。なお、この設定をする場合、日本語以外の音声合成エンジンがWindowsにインストールされている必要があります。(音声合成エンジンの管理参照)

ビジョン

スクリーン・ショット:NVDA設定画面(「ビジョン」を選択)

「ハイライトあり」、「フォーカスをハイライト」、「ナビゲーターオブジェクトをハイライト」、「ブラウズモードのカーソルをハイライト」をチェックします。これらをチェックすることで、現在読み上げられている箇所を可視化することができます。

ブラウズモード

スクリーン・ショット:NVDA設定画面(「ブラウズモード」を選択)

「サポートされている場合画面レイアウトを使用」のチェックを外します。この項目がチェックされている場合、ブラウズ・モードでの読み上げ時に画面上の1行分のテキストがまとめて読み上げられます。このテキストの一部がリンクになっている場合、リンク箇所とそうでない箇所がまとめて読み上げられるため、リンク・テキストの確認などの際に分かりづらくなる可能性があります。なおこの設定は、NVDA + Vで変更することも可能です。

「フォーカスの変化を追跡する自動フォーカスモード」と「テキストカーソルの移動を追跡する自動フォーカスモード」のチェックを外します。これらの項目がチェックされていると、ブラウズ・モードで操作している際に、状況に応じて自動的にフォーカス・モードに切り替わるため、混乱を生じやすくなります。

「フォーカスモードとブラウズモードの切り替えを音で報告」のチェックを外します。この項目がチェックされていると、フォーカス・モードとブラウズ・モードの切り替わりが効果音で通知されますが、チェックされていないと音声で通知され、慣れていない場合にはモードの切り替わりを意識しやすくなります。

マウス

スクリーン・ショット:NVDA設定画面(「マウス」を選択)

「マウスカーソル位置のテキストの報告」のチェックを外します。

画面表示を確認できない視覚障害者の場合、マウスを使うことは困難なので、アクセシビリティー・チェック実施の際にもマウスをなるべく使用せずにチェックを実施することが望ましいです。この項目がチェックされていると、マウス・ポインターが移動した先にあるテキストが自動的に読み上げられます。そのため、キーボードのみによる操作では読み上げられないものが、誤ったマウス操作によって読み上げられてしまう場合があり、チェック結果について誤った判断につながることがあります。

書式とドキュメント情報

スクリーン・ショット:NVDA設定画面(「書式とドキュメント情報」を選択)

「クリック可能」のチェックを外します。

この項目がチェックされていると、リンクでもボタンでもない要素にonclick属性がある場合など、クリック操作時に何らかの処理が行われるようになっている要素を読み上げる際に、「クリック可能」という読み上げが追加されます。

本来クリック可能な要素にはボタンやリンクなどの適切なロールが指定されているべきですが、現実にはspan要素やdiv要素を適切なrole属性を指定せずに用いているなど、アクセシビリティーの観点から望ましくない実装が少なくありません。こういった要素がクリック可能であるという情報は、視覚障害があるユーザーにとっては有益なものとなり得ますが、適切に実装されている場合は不要な情報です。

アクセシビリティー・チェックの実施に当たっては、この情報が読み上げられることで、実際には適切に実装されていないものについての問題を見落とすことにつながる可能性が考えられます。

音声合成エンジンの管理

参考動画

音声の項で触れた自然言語に関する設定について、これらの設定を反映した形でNVDAを動作させるには、Windowsに複数言語の音声合成エンジン(音声パッケージ)がインストールされている必要があります。ここでは、現在インストールされている音声パッケージの確認と、新たな音声パッケージの追加の方法を記します。

  1. スタート・ボタンなどから設定画面を表示

  2. 「時刻と言語」、「音声認識」の順にクリック

  3. この画面の下の方にある「インストールされている音声パッケージ」のプルダウンに表示されている、現在インストールされている音声パッケージの一覧を確認

  4. 1つの言語しかインストールされていない場合は、「音声を追加」をクリックして、「英語 (米国)」、「日本語」など、別の言語を追加

スクリーン・ショット:Windows 10の音声認識の設定画面

一般的なチェックの場合、「日本語」と「英語 (米国)」がインストールされていれば、NVDAは意図した挙動になります。英語と日本語以外の言語が使われているサイトをチェックする場合は、その言語も合わせて追加すると良いでしょう。

最低限知っておきたいこと

NVDAメニュー

NVDAメニューは、NVDAの各種画面やツールへのアクセスを提供するメニューです。このメニューは、以下のいずれかの方法で表示することができます。

  • NVDA + Nを押下

  • デスクトップ右下のシステムトレイにあるNVDAのアイコンをクリック

起動と終了

インストールの際にデスクトップにショートカットを作成している場合、デスクトップのショートカットをクリックするか、Ctrl + Alt + Nキーの押下で起動することができます。ショートカットがない場合は、「ファイル名を指定して実行」(Win + R押下で表示)でnvdaと入力して起動します。

終了は、NVDA + Qの押下で可能です。このキー操作が何らかの理由で使えない場合は、前述のNVDAメニューから終了することができます。

フォーカス・モードとブラウズ・モード

参考動画

NVDAには「フォーカス・モード」と「ブラウズ・モード」という2つの動作モードがあります。

2つのモードの最も大きな違いは、フォーカス・モードではNVDA制御キーを用いたものを除いて、すべてのキー操作がそのままOSや現在フォーカス中のアプリケーションに渡されるのに対して、ブラウズ・モードではキー操作はNVDAが受け取り、NVDAの様々な機能の実行に用いられるという点です。

フォーカス・モードは通常の動作モードであるのに対して、ブラウズ・モードは主にWeb閲覧時だけに利用できるモードです。

Webブラウザーのコンテンツ表示領域にフォーカスがある場合など、ブラウズ・モードが利用できるときには、NVDA + Spcで2つのモードを切り替えることができます。

Web閲覧時は、通常はブラウズ・モードでコンテンツを確認し、フォーム入力時などにフォーカス・モードに切り替えるというのが一般的な使い方です。ただし、アプリケーションのような振る舞いをするWebコンテンツにおいては、主にフォーカス・モードで操作することもあります。

参考:Windows上で動作するスクリーン・リーダーの多くには、同様の動作モードが存在します。Microsoft Narratorでは、「スキャン・モード」がオンの状態がブラウズ・モード、オフの状態がフォーカス・モードに当たります。JAWSでは、「仮想PCカーソル」がブラウズ・モード、「フォーム・モード」がフォーカス・モードに当たります。

スピーチビューアーの活用

参考動画

スピーチビューアーは、NVDAが音声出力した内容を文字で表示する機能です。音声出力がよく聴き取れない場合や、そもそも音を出せない状況で読み上げられる内容を確認する必要があるときは、スピーチビューアーを使うと便利です。

スピーチビューアーは、NVDAメニューを開いてツール ‣ スピーチビューアーの順に実行することで利用できます。実行するとスピーチビューアーのウィンドウが開き、NVDAが発声した内容が表示されます。

スピーチビューアーが不要になったときは、スピーチビューアーのウィンドウを閉じます。再度NVDAメニューを開いてツール ‣ スピーチビューアーの順に実行することでも、スピーチビューアーのウィンドウを閉じることができます。

知っておきたいキー操作

音声設定の変更

前述の設定画面での音声設定について、一時的に変更したい場合などに、設定画面を開かずに設定変更を行う方法があります。使用するのは、NVDA + Ctrlと上下左右の矢印キーです。

NVDA + Ctrl + またはNVDA + Ctrl + を押下すると、「高さ50」のように、設定対象の項目名と現在の設定値が読み上げられます。目的の設定項目が読み上げられるまで、このいずれかのキー操作を続けます。目的の設定項目が読み上げられたら、NVDA + Ctrl + またはNVDA + Ctrl + キーで設定値を調整します。

その他

参考動画
Ctrl

読み上げの停止

Shift

読み上げの一時停止/再開

NVDA + S

読み上げモードの変更(誤操作で音声が出なくなった場合などに何度か押下してみると良い場合があるかもしれない)

NVDA + 1

入力ヘルプ(1度押下するとヘルプ・モードに入り、再度押下するとヘルプ・モードから抜ける。ヘルプ・モードでは、押下したキーの名称や役割が読み上げられる。)

NVDA + Q

NVDAの終了

NVDA + N

NVDAメニューの表示

参考:NVDAチートシート

ここまでで紹介したキー操作などはごく一部のものですが、NVDA日本語チームが公開しているNVDAチートシートには、キーボード配列の設定が「デスクトップ」と「ラップトップ」の場合に分けて、他のキー操作も含めてまとめられています。GitHubのリポジトリーでは、Markdown版pptx版PDF版とPNG版(デスクトップ配列ラップトップ配列)が公開されています。以下にデスクトップ配列のNVDAチートシートのPNG版を転載します。

なお、前述の通り、ラップトップ配列はテンキーがない場合に便利な設定ですが、通常のチェック作業において、テンキーに割り当てられた機能を使う必要はありません。これらの機能を使わないと内容を確認できないようなWebページは、アクセシビリティーに関する問題がある可能性があります。

画像化したデスクトップ配列のNVDAチートシート

NVDAの更新

NVDAは3カ月に1回程度、更新版がリリースされます。また、これらのメジャー・バージョンのリリースの間に、マイナー・バージョンがリリースされることもあります。

NVDAは、最新のブラウザーへの対応やWeb技術への対応など、継続的に改良されていますので、必ず最新版を使うようにしましょう。

デフォルトでは、NVDAの起動時に更新版がリリースされていないかチェックするようになっています。これに加えて、NVDAメニューを開いて ヘルプ ‣ 更新を確認を実行することで、明示的に更新版のリリースを確認することができます。

Webコンテンツのチェック

ここでは、Webコンテンツのチェックを実施する場合の基本的な考え方やよく実行する操作について説明します。チェック内容に応じた具体的なチェック実施方法については、NVDAを用いたチェック実施方法の例を参照してください。

Webコンテンツのチェックをする場合、基本的にはブラウズ・モードですべての情報にアクセスできることを確認することが必要です。

ブラウズ・モードでは、キーで読み進め、キーで戻って読むというのが基本的な操作です。上下の矢印キーで進む/戻る長さは、概ねHTMLソースの要素単位です。途中にリンクやspan要素でマークアップされた部分がないような段落であれば、p要素が1つのまとまりとして扱われます。一方、リンクがあればリンク部分が1つのまとまり、span要素があればその部分が1つのまとまりとして扱われ、上下矢印キーによる移動の単位になります。

1つのまとまりとして判断されるテキストが、一定の長さを超える場合、キーによる読み上げが途中で止まります。この場合、キーを再度押下することで、続きの部分が読み上げられます。

NVDA + を押下すると、直前に読み上げられた内容を再度読み上げさせることができます。(正確には、この操作はカーソルが現在ある行を読み上げさせる操作です。)

なお、左右の矢印キーは1文字単位の読み上げのために使います。

ページ全体を読み上げさせる

以下の手順で、ページ全体を読み上げさせることができます。

  1. Ctrl + Homeでページの先頭に移動

  2. NVDA + で読み上げを開始

途中で読み上げを停止したい場合は、Ctrlキーを押下します。

再度NVDA + 下矢印を押下すると、続きを読み上げさせることができます。

操作を受け付けるコンポーネント

開閉できるメニュー、アコーディオンなど、何らかの操作を受け付けるコンポーネントについては、ブラウズ・モードでも操作ができることを確認する必要があります。

具体的には、ブラウズ・モードでそのコンポーネントを探し、そのコンポーネント上でキー操作を実行してみます。コンポーネントに対する操作のうち、EnterSpcEscによる操作はブラウズ・モードでも想定した挙動となることを確認します。その結果として新たなコンテンツが表示された場合は、そのコンテンツをブラウズ・モードで読み上げ可能なことを確認します。

これら以外のキー操作については、NVDA + Spcでフォーカス・モードに切り替えた上で確認します。

表の読み上げ

NVDAには、表の読み上げを効率的に行うためのキー操作が用意されています。これらのキー操作を利用することで、表を構成するセルの位置関係などを把握しやすくなりますので、表組みされたコンテンツのアクセシビリティーチェックに当たっては、これらのキー操作が適切に機能することを確認することが重要です。

以下に、表の読み上げに関連する主なキー操作を記します。これらはいずれもブラウズ・モードで動作します。

表の読み上げに関連するキー操作

キー操作

説明

T, Shift + T

次、前の表へ移動

Ctrl + Alt +

1つ上のセルへ移動して読み上げ

Ctrl + Alt +

1つ下のセルへ移動して読み上げ

Ctrl + Alt +

1つ左のセルへ移動して読み上げ

Ctrl + Alt +

1つ右のセルへ移動して読み上げ

上記のセル間移動の操作を行った場合、以下の内容が読み上げられます。

  • 左右の移動:移動先のセルの列見出し、列の番号、セルの内容

  • 上下の移動:移動先のセルの行見出し、行の番号、セルの内容

ブラウズ・モードで単に矢印キーを操作した場合は、以下のような内容が読み上げられます。

  • 上下矢印:前後のセルへ移動して読み上げ。ただしセル内で改行がある場合などは、セルの1部分だけが読み上げられることもある。

  • 左右矢印:1文字ずつ移動して読み上げ。空のセルでは、1つだけスペースがあるような挙動になる。

移動のための様々なキー操作

ブラウズ・モードでは、以下に挙げるようなキー操作でコンテンツ内を移動することができます。

ブラウズ・モードで使用できるキー操作(抜粋)

キー操作

説明

DShift + D

次、前のランドマーク(領域)

HShift + H

次、前の見出し

LShift + L

次、前のリスト(uloldl要素)

GShift + G

次、前の画像

FShift + F

次、前のフォーム・コントロール

TShift + T

次、前の表

これらのキー操作に加えて、NVDA + F7の押下でページ内の要素ごとのリストを表示することができ、このリストを用いて移動することも可能です。