文書構造と動的なWebのアクセシビリティ
Mozillaでアクセシビリティ関連のQAを担当しているMarco Zeheが自身のBlogに “The importance of placement of HTML elements in a document” という記事を投稿していました。JavaScriptでモーダルダイアログなどを実現するものがありますが、実装方法によってアクセシビリティを著しく損ねることになるケースが紹介されています。
記事で例に挙げられていたのはThickBox。デモの写真やリンクをクリックするとダイアログが開くのですが、これは新たに生成した
divを文書の一番後ろに追加し、それをスタイルシートで調整するという実装が行われています。
表示上はなんら問題ない方法ですが、Zeheはこの﹁文書の一番後ろに追加する﹂ことに問題があると述べています。文書の最後に要素を追加してしまうと、内容の多いページにおいてはアンカー︵または画像︶を表す要素とダイアログを表す要素が近接しない場合があるので、スクリーンリーダーのような文書順に情報を辿るソフトウェアでは、情報の変化を追うことが困難になるのです。
Zeheは﹁ユーザーの位置をふまえた適切な位置に要素を追加して欲しい﹂と述べています。文書構造の重要性がこういった動的な部分でも活きてくるのは、すこし新鮮に感じました。
動的なWebにおけるアクセシビリティについては、WAI-ARIAなど技術的な面での対応は進んでいますが、この件のように﹁どのように使えば問題が少ないか﹂など、手法に関する議論はまだ充分に行われていないように感じます。技術の展開に向けた取り組みが、今後の大きな課題になりそうですね。