EPUB リーディングシステムをスクリーンリーダーと併用しての雑感
「Form Design Patterns — シンプルでインクルーシブなフォーム制作実践ガイド」の電子書籍版 (リフロー型の EPUB) を制作した過程で、いくつかのリーディングシステム (Reading System : 電子書籍の閲覧環境) を用いて表示や動作の検証をしたのですが、ことスクリーンリーダーとの併用について言うと、今日のウェブブラウザに比べて、まだまだ動作が熟れていないのかなという印象を受けました。
比較的新しい (本記事執筆時点で2023年5月に更新されている) DAISY Consortium による記事「Reading Systems Accessibility Support Roundup - Inclusive Publishing」でも、リーディングシステムごとにアクセシビリティのサポート状況がまちまちであることをうかがい知ることはできますが、この記事では、私自身が試してみたリーディングシステムについて、実際に触って知った動作の違いや感じたことを記したいと思います。
試したリーディングシステム
この記事で取り上げるリーディングシステムは、いずれも無料で入手できるソフトウェアです。電子書籍専用デバイス (Amazon の Kindle 端末など) が含まれていないなど、網羅性のあるレポートではないことを、ご留意ください。
- Apple Books (iOS、macOS)
- Kindle (iOS、macOS、Windows)
- Google Play ブックス (Android)
- Colibrio Reader (Android)
- calibre (macOS、Windows)
- Thorium Reader (macOS、Windows)
各リーディングシステムの動作
Apple Books (iOS、macOS)
iOS アプリ
- VoiceOver によるコンテンツの音声読み上げ : 問題あり
- ページめくり : OK
- 画面最下部のページ番号表示に読み上げフォーカスが当たった状態で、上下フリックすることでページをめくることができる。
- 画像の代替テキスト (
<img>
要素のalt
) の読み上げ : OK - 見出しジャンプ (ローターで「見出し」を指定してのアクセス) : OK
- リンク (左右フリックでのフォーカス) : NG
- リンク (ローターで「リンク」を指定してのアクセス) : OK (ただし問題あり)
- 外部へのリンクは問題なくブラウザで開くことができる。
- 脚注は、リンク元の
<a>
要素にepub:type="noteref"
を記述することで脚注をポップアップ表示させた場合、ポップアップの中身が読み上げられない。
- テーブル (ローターで「テーブル」を指定してのアクセス) : NG
- ローターで「テーブル」を指定してジャンプすることはできないが、左右フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
<td>
セルを読み上げる際に関連する<th>
セルの内容が読み上げられないため、テーブル構造を把握するのが難しい。
- ローターで「テーブル」を指定してジャンプすることはできないが、左右フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
- ページめくり : OK
- VoiceOver を介したリーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : 可能
macOS アプリ
- VoiceOver によるコンテンツの音声読み上げ : 問題あり
- ページめくり : OK
- 「前のページ」「次のページ」ボタンに読み上げフォーカスが当たった状態で、スペースキーを押すことでページをめくることができる。
- 画像の代替テキスト (
<img>
要素のalt
) の読み上げ : NG - 見出しジャンプ (H キー / ローターで「見出し」を指定してのアクセス) : NG
- リンク (Tab キー / ローターで「リンク」を指定してのアクセス) : NG
- テーブル (T キー / ローターで「テーブル」を指定してのアクセス) : NG
- ページめくり : OK
- VoiceOver を介したリーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : 問題あり
- 目次は OK だが検索やテーマ設定などは NG
ちなみにスクリーンリーダーを併用しない場合のキーボード操作については、以下のとおりです。
- ページめくり : OK
- リンク (Tab キーでのフォーカス) : NG
- リーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : NG
- ショートカットキー操作で機能を開くことはできるが (例 : command + T キーで目次を開く)、そこから先の操作 (特定の目次項目を選択してジャンプする) はできない。
Kindle (iOS、macOS、Windows)
iOS アプリ
- VoiceOver によるコンテンツの音声読み上げ : 問題あり
- ページめくり : OK
- ローターで「行」を指定して、上下フリックでコンテンツを読み進めながらページをめくることができる。
- 画像の代替テキスト (
<img>
要素のalt
) の読み上げ : OK - 見出しジャンプ (ローターで「見出し」を指定してのアクセス) : NG
- リンク (左右フリックでのフォーカス) : NG
- ローターで「行」を指定して、上下フリックでコンテンツを読み進めながら、リンクにフォーカスすることはできる。
- リンク (ローターで「リンク」を指定してのアクセス) : OK (ただし問題あり)
- 外部へのリンクは問題なくブラウザで開くことができる。
- 脚注のリンクは、脚注のあるページを開くものの、リンク先の脚注に直接フォーカスが当たらないので、ユーザーが自力で該当する脚注を探し当てる必要がある。
- テーブル (ローターで「テーブル」を指定してのアクセス) : NG
- ローターで「テーブル」を指定してジャンプすることはできないが、上下フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
<td>
セルを読み上げる際に関連する<th>
セルの内容が読み上げられないため、テーブル構造を把握するのが難しい。
- ローターで「テーブル」を指定してジャンプすることはできないが、上下フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
- ページめくり : OK
- VoiceOver を介したリーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : 可能
macOS および Windows アプリ
- VoiceOver / NVDA によるコンテンツの音声読み上げ : 不可能
ちなみにスクリーンリーダーを併用しない場合のキーボード操作については、以下のとおりです。
- ページめくり : OK
- リンク (Tab キーでのフォーカス) : NG
- リーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : NG
- キー操作で機能を開くことはできても、実質的な操作は不可能 (例 : 目次を開いても、特定の目次項目を選択してジャンプすることができない)。
なお、Kindle の各アプリでは、私が試してみた iOS、macOS、Windows いずれも、脚注のリンク元 <a>
要素に epub:type="noteref"
を記述していても、脚注はポップアップ表示されず、脚注のあるページに遷移する挙動をします。Kindle Previewer でも同様の挙動なので、Kindle 共通の仕様と思われます。
Google Play ブックス (Android)
- TalkBack によるコンテンツの音声読み上げ : 問題あり
- ページめくり : OK
- 画像の代替テキスト (
<img>
要素のalt
) の読み上げ : OK - 見出しジャンプ (「読み上げコントロール」で「見出し」を指定してのアクセス) : OK
- リンク (左右フリック /「読み上げコントロール」で「リンク」を指定してのアクセス) : OK (ただし問題あり)
- 外部へのリンクは問題なくブラウザで開くことができる。
- 脚注は、リンク元の
<a>
要素にepub:type="noteref"
を記述することで脚注をポップアップ表示させた場合、ポップアップの中身が読み上げられない。
- テーブル (「読み上げコントロール」で「テーブル」を指定してのアクセス) : NG
- 「読み上げコントロール」で「テーブル」を指定してジャンプすることはできないが、左右フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
<td>
セルを読み上げる際に関連する<th>
セルの内容が読み上げられないため、テーブル構造を把握するのが難しい。
- 「読み上げコントロール」で「テーブル」を指定してジャンプすることはできないが、左右フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
- TalkBack を介したリーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : 可能
Colibrio Reader (Android)
- TalkBack によるコンテンツの音声読み上げ : 問題あり
- ページめくり : NG
- 画面最下部の読書進捗表示 (パーセント) に読み上げフォーカスが当たった状態で、ダブルタップすると次ページに進むことはできるが、前のページに戻ることができない。
- 画像の代替テキスト (
<img>
要素のalt
) の読み上げ : OK - 見出しジャンプ (「読み上げコントロール」で「見出し」を指定してのアクセス) : OK
- リンク (左右フリック /「読み上げコントロール」で「リンク」を指定してのアクセス) : OK (ただし問題あり)
- 外部へのリンクは問題なくブラウザで開くことができる。
- 脚注のリンクは、脚注のあるページを開くものの、リンク先の脚注に直接フォーカスが当たらないので、ユーザーが自力で該当する脚注を探し当てる必要がある。
- テーブル (「読み上げコントロール」で「テーブル」を指定してのアクセス) : NG
- 「読み上げコントロール」で「テーブル」を指定してジャンプすることはできないが、左右フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
<td>
セルを読み上げる際に関連する<th>
セルの内容が読み上げられないため、テーブル構造を把握するのが難しい。
- 「読み上げコントロール」で「テーブル」を指定してジャンプすることはできないが、左右フリックまたは直接のタッチでテーブル内のセルにアクセスすることはできる。ただし
- ページめくり : NG
- TalkBack を介したリーディングシステムの機能 (目次、テーマ設定など) の利用 : 不可能
なお脚注については、Kindle と同様、リンク元 <a>
要素に epub:type="noteref"
を記述していても、脚注はポップアップ表示されず、脚注のあるページに遷移する挙動をします。
calibre (macOS、Windows)
- VoiceOver / NVDA によるコンテンツの音声読み上げ : 不可能
ちなみにスクリーンリーダーを併用しない場合のキーボード操作については、以下のとおりです。
- ページめくり : OK
- リンク (Tab キーでのフォーカス) : NG
- リーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : NG
- Esc キーで機能を開くことはできるが、開いたあとの操作がキーボードではできない。
なお脚注については、リンク元 <a>
要素に epub:type="noteref"
を記述していなくても、当該 <a>
要素が <sup>
要素の中にあるだけで、脚注がポップアップ表示されるようになっており、これは calibre 独特の挙動と言えます。
Thorium Reader (macOS、Windows)
- VoiceOver / NVDA によるコンテンツの音声読み上げ : 可能
- ページめくり : OK
- 画像の代替テキスト (
<img>
要素のalt
) の読み上げ : OK - 見出しジャンプ (H キーでのアクセス) : OK
- リンク (Tab キーでのフォーカス) : OK
- 外部へのリンクは問題なくブラウザで開くことができる。
- 脚注も、リンク元の
<a>
要素にepub:type="noteref"
を記述することで脚注をポップアップ表示させた場合、ポップアップの中身がダイアログとして読み上げられる。開いたポップアップは Esc キーで閉じることができる。
- テーブル (T キーでのアクセス) : OK (ただし macOS VoiceOver では NG)
- NVDA では、テーブル内の読み上げ対象セル (
<td>
) を変更すると、関連する<th>
セルの内容も適宜読み上げてくれるため、テーブル構造を把握しやすい。
- NVDA では、テーブル内の読み上げ対象セル (
- VoiceOver / NVDA を介したリーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : 可能
ちなみにスクリーンリーダーを併用しない場合のキーボード操作についても、以下のとおり問題なく可能です。
- ページめくり : OK
- リンク (Tab キーでのフォーカス) : OK
- リーディングシステムの機能 (目次、検索、テーマ設定など) の利用 : OK
Thorium Reader では、Tab キーによるフォーカスインジケーターが明示的で、視認しやすくなっています。またショートカットキーを用いて、Tab キーのフォーカスをコンテンツとツールバー (リーディングシステムの機能が並んでいる) との間でいつでも切り替えることができるのもポイントです (ctrl + T でツールバーに、ctrl + F10 でコンテンツに、それぞれ瞬時にフォーカス移動できます)。
一点、Thorium Reader で不思議なのが、コンテンツのリンクに下線が表示されないことです (EPUB ファイル側の CSS で a{text-decoration:underline;}
と明記していても、です)。視覚を用いて読書するユーザーにとっては、下線があることでリンク箇所を認知しやすくなるので、今後のアップデートでリンクに下線が付くことを期待したいところです。
Thorium Reader + NVDA が標準的なリファレンスか
小説のように基本的に通しで読むものではなく、技術書 (目次や検索で特定の箇所を読む、リンクや脚注にスムーズにアクセスする、見出しを拾い読みして深掘りしたいところを読む、データテーブルの内容を理解する、といったことが読書体験において重要な書籍) をスクリーンリーダーで読むためのリーディングシステムとしては、上記の中では実質的に Thorium Reader + NVDA の組み合わせに絞られるのかな、というのが正直な印象です。実際に何人かの視覚障害者の方に聞いてみた範囲でも、技術書を読む際は Thorium Reader + NVDA をチョイスしている、という声が聞かれました。EPUB 制作においては、各種リーディングシステムで表示を確認しつつ、スクリーンリーダーの検証においては、Thorium Reader + NVDA を標準的なリファレンス環境としてテストするのが現時点では妥当と言えそうです。
なお、今回の検証は、それなりに時間をかけたものの、スクリーンリーダーを用いて電子書籍を読んだ経験がウェブほど多くない中で、手探りでやってみた感があります。視覚障害当事者の方で、(この記事では NG と記載されているものの) 実際にはこうすれば使えるよ、といった知見がございましたら、後学のために教えていただけたらありがたいです。