竹村TweetこんにちはSEの竹村です。2008年7月18日にクリーク・アンド・リバー社にて、「本物のWebアクセシビリティ・セミナー」というアクセシビリティのセミナーに行ってきました。ユーザーが求める本物のアクセシビリティお見せします!?http://www.harmony-i.org/csrdiv/release/2008061401.html当日の参加人数は約70名くらいだったと思います。1割という状況でした。このセミナーの内容は「アクセシビリティ概論」や「Flashのアクセシビリティ」や「評価ツールとユーザテストの違い」、「生の声を聞くパネルディスカッション」というものでした。現在発売中の下記の本が中心の話だったかもしれません。このブログではFlashのアクセシビリティの話を中心にセミナーで聞いてきた内容をまとめます。Flashのアクセシビリティまず、↓こちらの資料をもとに話が進んでいきます。http://www.infoaxia.com/slides/20080718.pdf注意:資料はPDFです。Flashがアクセシビリティ上問題とされる点は主に『うまく読み上げされない』『キーボードでのコントロールができない』という2点だそうです。現在は解決してきているらしいことが資料のPDFに書いてあるようですが、資料が確認できないのでちょっと不明です。FlashPlayerが対応してきているのか、読み上げソフト側が対応してきているのか気になります。追記2008/07/25:資料のダウンロードができるようになりました協賛のハーモニー・アイさんよりメールをいただきまして、資料がダウンロードできるようになったようです。これに伴って、上記のFlashアクセシビリティの資料もダウンロードできます。拝見したところではPDF6ページ(資料の12ページ)で問題がかかれており、それを7ページ目で『FlashPlayerが解決させた』とあります。Flashによるアクセシビリティで最低限覚えておきたい3点Flashでのアクセシビリティ対応については、様々な問題とそれに対応する方法がありますが、とりあえず押さえておくべき2点を紹介されていました。それに私がこれも最低限必要と思った1点を加えて3点紹介します。Flashではタブキーを押すごとにフォーカスが変わっていくのですが、そのフォーカスの当て方が、ABCDEF...と上から右に読まれそうですが、ABCDEFIGJHK...というように予期していたように読まれないことがあります。いう場合は、タブインデックスを使います。Flashを制作する際に、『アクセシビリティパネル』を開き、そのタブインデックスに読ませたい順番を指定します。25と追加ができるのでよいですよ、とのことです。オブジェクトの代替テキストを名前でつける読ませたいオブジェクトには名前をつけて、そのオブジェクトの説明を書きましょう。画像でいうところのalt属性と同じように、代替テキストと思って必ず設定するべきです。これも『アクセシビリティパネル』で設定できます。テキストにタブインデックスさせる時はダイナミックテキストを使う最後のこの項目はセミナーでは触れていませんでしたが、Webアクセシビリティの本に書いてあります。Flashのテキストは『静的テキスト』、『ダイナミックテキスト』、『入力テキスト』の3タイプを指定できますが、この『静的テキスト』は大抵の読み上げソフトで認識されません。現状ではなるべく『ダイナミックテキスト』を利用して、読み上げソフトに正しい読み上げ順を指定する必要があると思います。Flashアクセシビリティのサンプル次は、実際のサンプルについてMITSUE-LINKSの下記ページの内容を元に進みます。Flashコンテンツのアクセシビリティを向上!アクセシブルなリッチコンテンツでWebサイト全体の評価を高めます。http://www.mitsue.co.jp/service/produce/accessible_flash.html以降、この資料をミツエー資料と呼ぶことにします。OKIhttp://www.oki.com/jp/mechatro/products/このFlashはOKIさんのメカトロニクス商品のカテゴリが上に並んでいてカテゴリを変更すると、それに該当する項目が並び変わるようなユーザーインタフェースになっています。ミツエー資料の方に、アクセシビリティの対応/非対応の音声がついてます。聞き比べてみると、非対応の場合は「の・プッシュボタン」が連呼されます。ボタン要素を読み上げしようとしているが、名前がないので読まれないという状況のようです。アクセシビリティに対応した場合は、ちゃんと「現金のプッシュボタン」「自動化機器のプッシュボタン」といってくれるので意味がわかります。カテゴリを変更した時に、『変更された旨の通知』と『並び変わった要素しか読まれない』という部分はすごくアクセシブルですね。辻ちゃん・ウエちゃんのアクセシビリティPodcasthttp://accessibility.mitsue.co.jp/archives/podcast/このFlashはPodcastを再生するプレイヤーです。タブキーを押していくと分かりますが、タブインデックスの流れが下記のようになっています。アクセシビリティパネルの名前は1つずつ設定してあるそうです。(ループ)こちらは、音量のコントロールを『スライダー』と『ボタン』という2通りの方法で提供しているということもアクセシブルなんだと思います。このプレイヤーは再生すると字幕がでます。点字ピンディスプレイに反映させれば、全盲の方でもリアルタイムに聞けるというメリットがあったそうです。ちなみに、「再生」をクリックすると「停止」に自動的に変わります。これの読み上げも今表示している状態のものを読み上げさせるように制御してあると思います。アクセシビリティパネルから設定する他にActionScriptからも設定できるので、再生から停止に変更するコードの側に名前を変える処理をしているのでしょう。CS3からムービーにキャプションがつけられるようになりました。ムービーのどのタイミングでどんなキャプションをどのように表示するかをXMLで定義して、それをコンポーネントに食わせて表示させるようです。どのタイミングで、というのは開始からの時間で指定しますどんなキャプション、というのは表示する文言ですねどのように、というのはCSSのようにスタイルを宣言できるようでその適用についてですXMLの形式などは、下記のブログに書いてあったので参考にどうぞ。(ウェイアリア)は、W3CがまとめているAjaxやDHTMLなどのアクセシビリティについての仕様です。上記のPodcastで「再生」から「停止」になった時などに読み上げソフトへ通知することが可能になります。日本語訳が日立さんから出ているのでチェックしておいてください、とのことでした。WAI-ARIA(日本語訳)http://www.hitachi.co.jp/universaldesign/wai-aria/まとめ現状、まだまだFlashサイトは読み上げには対応していない状況で、見たくても見られなくて不満がある、という声をこのセミナーで聞いてきました。制作者側ができることは、Flashがどのようにアクセシビリティを提供しているか知ること、そしてどのような点に注意して構築するかを知ることだと思います。アークウェブでは、Webアクセシビリティの本(通称『黄緑本』)で勉強したFlashアクセシビリティについての内容をサンプルを交えて書いていく予定です。下記のアクセシビリティWiki内でまとめる予定ですので、チェックしていただければと思います。アクセシビリティWikihttps://www.ark-web.jp/accessibility/また、黄緑本のご購入は、ぜひmiqqle経由で!(miqqleをご存じない方はこちら。次の記事:「ペルソナ/シナリオ法」:アークウェブのソリューションとしてご紹介します。Cart公式本(v1.3対応)がついに発表です。アークウェブのスタッフをはじめZen-Cart.JPの中心メンバーが共著で執筆しました。プロフェッショナル・スタイルビジネスサイト構築におけるCMSとしてのMTの活用方法について、豪華執筆陣による実践的MT本です。八木が共著で執筆しました。(技術評論社)を、中野・安藤が執筆しました。