東京都議会議員選挙、参議院選挙が近づいてきました。こうした選挙の際にはPDFファイルの「選挙公報」が各都道府県のウェブサイトや選挙特設サイトに掲載されます。
近年では「音声読み上げ対応版PDF」と称して、テキスト抽出可能な PDF (Adobe Illustratorなどでアウトライン化される前の元データから書き出したPDF)が掲載されるようになっています。
実際、東京都議会選挙特設ホームページには以下のように記載されています。
当ホームページでは、選挙公報のPDFファイルを音声読み上げソフトに対応した形式で掲載いたします。
また選挙公報の記載事項を読み上げた音声ファイルも掲載いたします。
東京都では前回の衆議院議員選挙でも MP3音声ファイルを提供していましたが、音声ファイルの提供は全国的に見ればまだ少数(岩手、東京、神奈川、静岡、三重、長崎、鹿児島など)です。
単に「アウトライン化」されていないデータの掲出では不十分
PDFについては各都道府県で「音声読み上げソフトに対応した形式で掲載」と謳われているものの、読み上げ順指定が適切にされている PDFは10%未満で、単にアウトライン化されていないファイルが掲載されているのが現実です。
しかし、実際に掲出されている「音声読み上げ対応PDF」をスクリーンリーダーで読み上げてみると、わかりやすく情報が聞き取れるものはほとんどなく、意味のないテキストの読み上げや「イメージ、イメージ、イメージ、イメージ」など意味のない代替テキストの指定のない画像の読み上げの連続など「伝わらないPDF」であることが多いことがわかりました。
出典 : 選挙のアクセシビリティ「しなくてはならない」と「してもよい」の間の壁 アイコン別ウィンドウで開きます
PDFファイルのアクセシビリティ対応方法自体が正しく認知されていないことが大きな要因と思われます。ここに対応方法を記します。
※ アウトライン化とは? : テキスト情報を文字の形状やスタイルを保持したまま図形化する方法です。 アウトライン化によってフォントがインストールされていない環境でも同一の見た目を保持でき、印刷物などでは出稿時にアウトライン化するのが一般的ですが、テキスト情報が失われるためそのままでは音声読み上げができません。そのため、「音声読み上げ対応PDF」はアウトライン化されていないものの提出を候補者に求めておりそれを掲載しています。
PDFをスクリーンリーダーなどでの読み上げに対応させる手順
対応方法としては大きくわけて2つ、作成元アプリケーションのアクセシビリティ機能を使った方法と、Adobe AcrobatなどPDF編集ソフトを利用する方法があります。多くの場合、作成元アプリケーションでの対応だけでは不十分なので、Adobe AcrobatなどPDF編集ソフトでの対応は必須となります。
- 作成元アプリケーションでの対応
- PDF変換後Adobe AcrobatなどPDF編集ソフトでの対応
- PDF表示ソフト+スクリーンリーダーでの検証
この3ステップを踏む必要があります。
Microsoft PowerPointでの対応方法
PowerPointなど Microsoft Office系のアプリケーションはアクセシビリティへの対応を支援する機能があります。そのようなアプリケーションでは作成元のソフトウェアでできるだけアクセシブルなデータを作成しておくことが大切です。アクセシビリティへの対応ができないアプリケーションのデータではそのまま Adobe Acrobatでの対応へ進んでください。
文書のタイトルを指定する
文書のプロパティを開いてドキュメントにタイトルを指定してください。また、作成者欄などに個人情報が含まれている場合は削除するなどしてください。文書のタイトルはスクリーンリーダーでの読み上げのほか、検索エンジンにインデックスされる際にも使われることがあります。
画像に代替テキストまたは装飾用にするフラグを付ける
貼り付けた画像オブジェクトを右クリックして「代替テキストを表示...」を選択します。
画像がある場合、HTMLと同様に代替テキストを指定することができます。現在の Microsoft Office系のアプリではデフォルトで AIが付けた代替テキストが入るようになっています。「動物, 魚, 鳥, 座るが含まれている画像」となっていますが、ここを適切なものにリライトします。
意味のない装飾的な画像については空文字ではなく「装飾用にする」にチェックを入れます(スクリーンリーダーはこれを無視して読み上げをスキップします)。これを行わないと読み上げ時に非常に聞きづらいPDFになってしまいます。
イメージ、イメージ、イメージ、イメージ...
PowerPointでは画像以外にもこの「代替テキスト」機能で代替テキストを指定したり「装飾用にする」フラグを付けることができます。このPDFで指定すべきポイントは次の画像の箇所となります。Adobe Illustratorなどの場合は書き出し後のPDFに対してAdobe Acrobatで同様の編集を行います。
指定すべき箇所は次のとおりです。
- 装飾のためのテキスト
- 意味のある画像
- 縦書きテキスト
- 装飾用の画像
※ 最終的に左上の丸付き数字も読み上げが意図通りにならなかったため装飾フラグをつけて裏技的ですが背景色と同じ白い色のテキストを配置して対応しました。
縦書きのテキストに関する問題
縦書きのテキストは「縦書きテキスト ボックス」でも、横書きのブロックの幅を狭くして追加したものも、読み上げ方に問題が出る可能性が高いです。この例では「さかな たぐい ずかん」のように読み上げることがあります。
複数行に渡る縦書きテキストを流石に左から右に読み上げたりはしませんが、各々の文字が独立して読み上げられるため漢字を利用した単語などの読み間違いが多く理解しづらくなります。これは、スクリーンリーダーや表示するソフトウェア側での対応が望まれますが、代替テキストを指定することで読み上げを改善することができます。
注意点として、PowerPointで代替テキストを指定した場合、PDF書き出し後に確認するとテキストが重複しています。Acrobatで調整するようにします。
Adobe Acrobatの代替テキスト編集ダイアログは非常に小さく編集しにくいですが、今後の改善を望みます。
Adobe Acrobatでの対応方法
作成した元データをPDFに書き出した後に Adobe Acrobatで文書を開いて対応を続けます。PowerPointから書き出したものにはすでにタグ付けがされていますが、Adobe Illustratorなどで作成したデータやタグ付けがされていないデータではまず初めに「PDFに自動的にタグ付け」を実行してオブジェクトにタグを付けてから編集します。これを行わないと、入り組んだレイアウトや要素が重なっていると各オブジェクトの選択がとても難しいからです。
各要素に構造を指定して表示順を設定する
- 「テキストまたはツールを検索」に「読み上げ」と入力し「読み上げ順序」をクリックします。
- 「順序パネルを表示」ボタンをクリックします。
- 項目を選択して「見出し1」「見出し2」「テキスト / 段落」を指定します(これを適切に指定しないと読み上げ順指定時に項目が統合されることがある)。
- その後、項目をドラッグ&ドロップで順序指定します。
最後のドラッグ&ドロップの操作ですが、キーボード操作ができず、マウスやトラックパッドの操作が前提となります。また読み上げ順の変更は Undoできません。この部分についても今後の改善を望みます。
代替テキストを確認する
- 「テキストまたはツールを検索」に「代替テキスト」と入力し「代替テキストを設定」をクリックします。
作成元ソフトで指定した画像などへの代替テキストが適切かを再度確認します。意図通りでないものは修正してください。PowerPointで指定した縦書きテキストブロックの代替テキストは重複している場合がありますので、重複している部分は削除してください。
尚、テキストなどのブロックを「構造」で「図」にした後に「代替テキストを設定」を呼び出すと、そのブロックも図として扱われ、代替テキストを指定できるようになります。Adobe Illustratorなどで作成したデータの日本語の縦書きテキストブロックについては構造で「図」としてから代替テキストにそのテキストと同等のテキストをコピー&ペーストしてください。
表示ソフト+スクリーンリーダーでの検証
対応が完了したら文書を保存して表示ソフト(ブラウザやプレビューなど)で表示した状態でスクリーンリーダーを起動して検証を行いましょう。以下はMacで「プレビュー」でPDFを開き、VoiceOverで読み上げているところです。読み上げ順が正しいか、縦書きテキストや画像の代替テキストが意図通りに読み上げられるかを確認します。
また、構造を指定したことにより、VoiceOverの「見出しメニュー」に指定した見出しが表示されること、読み上げの際に「見出しレベル1 ミノカサゴ」などと読み上げられることも確認できるかと思います。
最終的に対応済みのPDFを載せておきます(あらゆる環境での読み上げ順を保証するものではありません)。
ソフトウェアの組み合わせによって指定した読み上げ順が正しく反映されないこともあります。これは現状のPDFの限界とも言えると思います。テキスト(HTML)版や音声データの提供についても義務化することが望まれます。PDFによると思いますが、過去に(昨年12月時点)確認した結果を掲載しておきます。
macOS
- プレビュー+VoiceOver => 正しい順
- Safari or Firefox+VoiceOver => 正しい順
- Chrome(Edge)+VoiceOver => 正しくない
- Adobe Acrobat+VoiceOver => 正しい順(ただし複数ページのPDFはうまく読むことができない)
- Adobe Acrobatの「読み上げ」機能=> 正しい順
Windows OS
- Chrome(Edge)+ナレーター or NVDA => 正しくない
- Firefox+ナレーター or NVDA => 正しい順
- Adobe Acrobat+ナレーター => 読み上げ不可
- Adobe Acrobat+NVDA => 正しい順
- Adobe Acrobatの「読み上げ」機能=> 正しい順
※ 掲載されている商品またはサービスなどの名称は、各社の商標または登録商標です。