ウェブアクセシビリティ・レポート
文＝KeiYu HelpLab石田優子
ユーザーの視点に立ったサイト構築、運営に関するユーザビリティ、アクセシビリティの向上などのコンサルティング、調査などを行っている。
第3回
FlashとPDFのウェブアクセシビリティ
Web制作において今や欠かせないものになりつつあるFlashとPDFだが、制作サイドでの配慮がないと、障害者や高齢者に使いにくい、あるいはまったく使えないものになる。今回はFlashとPDFのアクセシビリティについて取り上げる。
Flashのアクセシビリティ
Flashのアクセシビリティが問題となるのは、おもに視覚障害者と、マウス操作ができずキーボードのみで操作している肢体不自由者だ。
Flash Playerに対応している音声読み上げソフト
Flash Playerは、バージョン6からMicrosoftのMSAA（Microsoft Active Accessibility）という技術を使い、音声読み上げソフトなどの支援ソフトに対応するようになった。音声読み上げソフトには、画面のメニューなどまで読み上げるスクリーン・リーダーと、Webに特化して読み上げる音声ブラウザがあるが、多くのソフトの最新版はFlash Playerに対応している。
日本語版のおもなスクリーン・リーダーとしては、高知システム開発のPC-Talker XP、エクストラのJAWS 6.2、システムソリューションとちぎの95Reader Ver.5.0（XP Reader）、スカイフィッシュのFocus Talkなどがある。
音声ブラウザでは、日本IBMのホームページ・リーダーがFlash対応している。ただし、それぞれの音声読み上げソフトによって対応しているFlash Playerのバージョンがまちまちであり、また旧バージョンでは対応していないものが多い。音声読み上げソフトごとに読み上げ方の癖もある。また、音声ブラウザのボイスサーフィンはFlash対応していない。このためアクセシブルなFlashをつくったとしても、並行してFlashなしでもアクセスできるページをつくるのが親切だ。
アクセシブルなFlashの作成
Flashムービーを読み上げるためには、Flash MX以降のバージョンが必須だ。MX以降からはテキスト、テキスト入力フィールド、ボタン、ムービークリップ、ムービー全体の5種類のオブジェクトを音声で読み上げられるように設定が可能だ。
これらのオブジェクトに代替テキストとして、視覚障害者への音声読み上げ用のテキストを付加することもできる【1】。また、マウスを使わずキーボードのみで操作しているユーザーのために、オブジェクトにショートカットキーを割り当てたり、タブの移動順をタブインデックスで指定することもできる。
【1】
特にタブインデックスの設定は重要だ。HTMLの場合は、ソースコードに記述された上から下に向けてタブキーを押すとリンクなどを移動するが、Flashコンテンツの場合は独自の計算式に基づいてタブが移動するので、タブインデックスを設定していないと、思わぬ順序で移動してしまい、キーボード操作が不便になる。
これを解消するために、ユーザーが見た目通りに操作できるようにタブインデックスを設定する必要がある。各種の代替テキストやタブインデックス、ショートカットキーは、「アクセシビリティ」パネル上で指定できるほか、ActionScriptに記述可能だ【2】。
【2】Flash8のアクセシビリティパネル
アクセシブルなFlashの例
アクセシブルなFlashを実際のサイトで使っている例としては、富士通のプラズマディスプレイサイト【3】が有名だ。ここではHTML版、Flash版【4】、文字を拡大したFlash版の3種類を用意している。Flashがアクセシビリティに問題ありといっても、このぐらいの配慮があると、だれもが好みに応じて閲覧することができる。
【3】富士通のプラズマディスプレイサイト（jp.fujitsu.com/museum/pdp/）
【4】プラズマディスプレイのFlash版
PDFのアクセシビリティ
WebサイトでのPDFの閲覧は、PC初心者が多い高齢者と視覚障害者には敷居が高い。まず、PDF文書の閲覧には、Adobe Readerが必要で、これはAdobeのサイトから無料でダウンロードできるのだが、高齢者には、どこからAdobe Readerを入手できるのか、あるいはダウンロードにはどうすればよいのかわからない。
Adobe Readerのロゴマークのように、Adobe Readerのダウンロード先へのロゴだけを貼ったサイトが多いのだが、高齢者はロゴの意味などわからない。PDF文書を閲覧するにはAdobe Readerが必要であることや、どのように操作すればダウンロードし、インストールできるかまで詳しく説明する、あるいは説明したページへのリンクを張るなどの配慮が必要だ。
また、PDF文書にリンクを張る場合は、「会報（PDF形式 500KB）」のように、リンク先がPDF文書であることと、そのファイルサイズを明記しておくのが親切だ。いきなり大きなPDFファイルが開き始めて、時間がかかってしまうとユーザーは戸惑う。また数MBのPDFと記載されているのならば、ブラウザで開くと負担が大きすぎるので、いったんハードディスクにダウンロードしてから開くという選択もすることができる。
視覚障害者への配慮
Acrobat 4までは音声読み上げソフトで、視覚障害者がPDFを簡単に読むことができなかった【5】。しかし、Acrobat 5以降からは、Windows版ではMSAAを使用した音声読み上げに対応したため、PDFのテキスト部分の音声による読み上げが可能になってきた【6】。
【5】音声読み上げソフトでは読み上げられない厚生労働省のPDF
【6】音声読み上げソフトに配慮したFocus TalkのオンラインヘルプのPDF
ただし、通常のPDFは音声読み上げされるように工夫されていない。PDFは見た目重視などで、段組みレイアウトや見出しに装飾文字を使っていたりすると、音声読み上げソフトではレイアウト通りでなくバラバラな順番で読み上げられたり、図版が音声読み上げ対応できなかったり、文字が二重読みされるようなことが起こる。このためAcrobat側では、「タグ付きPDF」として、PDF制作サイドが図版に代替テキストを付けたりすることができる【7】。
【7】Acrobat Professionalの「Touch UP読み上げ順序」パネル
また、WordからのPDF出力の場合は、自動的に構造化し、音声読み上げで不便のない形式で出力することができる。ただし、この「タグ付きPDF」の作成方法の情報は少なく、制作サイドでは音声読み上げソフトがPDFに対応しているのだから、自動的にレイアウト通りに読み上げられると、誤解しているのが大半だ。
しかし実際には、レイアウト通りに音声読み上げソフトで読み上げるためには、細かな設定が必要になる。細かな設定はAcrobat Professionalの「Touch UP読み上げ順序」パネルやオブジェクトを選択してのポップアップメニューで行うことができる。しかし、この機能もあまり知られていない。また、コピープロテクトを使ったPDFが音声読み上げソフトでは読み上げられないという問題も発生している。Webで膨大な資料を公開する場合など、安易にPDF化する動きがあるが、音声読み上げで見た目通り読めるかのチェックが必要だろう。
本記事は『Web STRATEGY』2006年5-6 vol.3からの転載です
文＝KeiYu HelpLab石田優子ユーザーの視点に立ったサイト構築、運営に関するユーザビリティ、アクセシビリティの向上などのコンサルティング、調査などを行っている。
第3回
FlashとPDFのウェブアクセシビリティ
Web制作において今や欠かせないものになりつつあるFlashとPDFだが、制作サイドでの配慮がないと、障害者や高齢者に使いにくい、あるいはまったく使えないものになる。今回はFlashとPDFのアクセシビリティについて取り上げる。
Flashのアクセシビリティ
Flashのアクセシビリティが問題となるのは、おもに視覚障害者と、マウス操作ができずキーボードのみで操作している肢体不自由者だ。
Flash Playerに対応している音声読み上げソフト
Flash Playerは、バージョン6からMicrosoftのMSAA（Microsoft Active Accessibility）という技術を使い、音声読み上げソフトなどの支援ソフトに対応するようになった。音声読み上げソフトには、画面のメニューなどまで読み上げるスクリーン・リーダーと、Webに特化して読み上げる音声ブラウザがあるが、多くのソフトの最新版はFlash Playerに対応している。
日本語版のおもなスクリーン・リーダーとしては、高知システム開発のPC-Talker XP、エクストラのJAWS 6.2、システムソリューションとちぎの95Reader Ver.5.0（XP Reader）、スカイフィッシュのFocus Talkなどがある。
音声ブラウザでは、日本IBMのホームページ・リーダーがFlash対応している。ただし、それぞれの音声読み上げソフトによって対応しているFlash Playerのバージョンがまちまちであり、また旧バージョンでは対応していないものが多い。音声読み上げソフトごとに読み上げ方の癖もある。また、音声ブラウザのボイスサーフィンはFlash対応していない。このためアクセシブルなFlashをつくったとしても、並行してFlashなしでもアクセスできるページをつくるのが親切だ。
アクセシブルなFlashの作成
Flashムービーを読み上げるためには、Flash MX以降のバージョンが必須だ。MX以降からはテキスト、テキスト入力フィールド、ボタン、ムービークリップ、ムービー全体の5種類のオブジェクトを音声で読み上げられるように設定が可能だ。
これらのオブジェクトに代替テキストとして、視覚障害者への音声読み上げ用のテキストを付加することもできる【1】。また、マウスを使わずキーボードのみで操作しているユーザーのために、オブジェクトにショートカットキーを割り当てたり、タブの移動順をタブインデックスで指定することもできる。
【1】
特にタブインデックスの設定は重要だ。HTMLの場合は、ソースコードに記述された上から下に向けてタブキーを押すとリンクなどを移動するが、Flashコンテンツの場合は独自の計算式に基づいてタブが移動するので、タブインデックスを設定していないと、思わぬ順序で移動してしまい、キーボード操作が不便になる。
これを解消するために、ユーザーが見た目通りに操作できるようにタブインデックスを設定する必要がある。各種の代替テキストやタブインデックス、ショートカットキーは、「アクセシビリティ」パネル上で指定できるほか、ActionScriptに記述可能だ【2】。
【2】Flash8のアクセシビリティパネル
アクセシブルなFlashの例
アクセシブルなFlashを実際のサイトで使っている例としては、富士通のプラズマディスプレイサイト【3】が有名だ。ここではHTML版、Flash版【4】、文字を拡大したFlash版の3種類を用意している。Flashがアクセシビリティに問題ありといっても、このぐらいの配慮があると、だれもが好みに応じて閲覧することができる。
【3】富士通のプラズマディスプレイサイト（jp.fujitsu.com/museum/pdp/）
【4】プラズマディスプレイのFlash版
PDFのアクセシビリティ
WebサイトでのPDFの閲覧は、PC初心者が多い高齢者と視覚障害者には敷居が高い。まず、PDF文書の閲覧には、Adobe Readerが必要で、これはAdobeのサイトから無料でダウンロードできるのだが、高齢者には、どこからAdobe Readerを入手できるのか、あるいはダウンロードにはどうすればよいのかわからない。
Adobe Readerのロゴマークのように、Adobe Readerのダウンロード先へのロゴだけを貼ったサイトが多いのだが、高齢者はロゴの意味などわからない。PDF文書を閲覧するにはAdobe Readerが必要であることや、どのように操作すればダウンロードし、インストールできるかまで詳しく説明する、あるいは説明したページへのリンクを張るなどの配慮が必要だ。
また、PDF文書にリンクを張る場合は、「会報（PDF形式 500KB）」のように、リンク先がPDF文書であることと、そのファイルサイズを明記しておくのが親切だ。いきなり大きなPDFファイルが開き始めて、時間がかかってしまうとユーザーは戸惑う。また数MBのPDFと記載されているのならば、ブラウザで開くと負担が大きすぎるので、いったんハードディスクにダウンロードしてから開くという選択もすることができる。
視覚障害者への配慮
Acrobat 4までは音声読み上げソフトで、視覚障害者がPDFを簡単に読むことができなかった【5】。しかし、Acrobat 5以降からは、Windows版ではMSAAを使用した音声読み上げに対応したため、PDFのテキスト部分の音声による読み上げが可能になってきた【6】。
【5】音声読み上げソフトでは読み上げられない厚生労働省のPDF
【6】音声読み上げソフトに配慮したFocus TalkのオンラインヘルプのPDF
ただし、通常のPDFは音声読み上げされるように工夫されていない。PDFは見た目重視などで、段組みレイアウトや見出しに装飾文字を使っていたりすると、音声読み上げソフトではレイアウト通りでなくバラバラな順番で読み上げられたり、図版が音声読み上げ対応できなかったり、文字が二重読みされるようなことが起こる。このためAcrobat側では、「タグ付きPDF」として、PDF制作サイドが図版に代替テキストを付けたりすることができる【7】。
【7】Acrobat Professionalの「Touch UP読み上げ順序」パネル
また、WordからのPDF出力の場合は、自動的に構造化し、音声読み上げで不便のない形式で出力することができる。ただし、この「タグ付きPDF」の作成方法の情報は少なく、制作サイドでは音声読み上げソフトがPDFに対応しているのだから、自動的にレイアウト通りに読み上げられると、誤解しているのが大半だ。
しかし実際には、レイアウト通りに音声読み上げソフトで読み上げるためには、細かな設定が必要になる。細かな設定はAcrobat Professionalの「Touch UP読み上げ順序」パネルやオブジェクトを選択してのポップアップメニューで行うことができる。しかし、この機能もあまり知られていない。また、コピープロテクトを使ったPDFが音声読み上げソフトでは読み上げられないという問題も発生している。Webで膨大な資料を公開する場合など、安易にPDF化する動きがあるが、音声読み上げで見た目通り読めるかのチェックが必要だろう。
本記事は『Web STRATEGY』2006年5-6 vol.3からの転載です
