Smart Communication Design Company
ホーム > ナレッジ > Blog > アクセシビリティBlog > 2016年2月 > スクリーン・リーダーは如何にして表の見出しセルを探すか

アクセシビリティBlog

Webサイトのアクセシビリティを高めるための方法や国内外の関連情報など、さまざまな角度からWebアクセシビリティに関する話題をご提供していきたいと思います。

当Blogの更新情報は、Twitter経由でも配信しています。興味のある方はぜひ、@mlca11yをフォローしてください。当Blogへのご意見・ご質問は、Twitter経由でも受け付けております。

スクリーン・リーダーは如何にして表の見出しセルを探すか

アクセシビリティ・エンジニア 黒澤

PowerMapperのMark Rogers氏がTable cell header calculation for ATという記事で、スクリーン・リーダーとブラウザーが表のデータセルに対応する見出しセルを見つける方法を紹介しています。記事では、IEとNVDA、FirefoxとNVDA、ChromeとNVDA、SafariとVoiceOverの組み合わせ(それぞれバージョンは記載されていません)における結果を解説しています。

記事では、th要素にscope=rowもしくはscope=colを指定する場合が最もセマンティクスが伝わる(制作者の意図とスクリーン・リーダーの挙動が一致する)、という結論でした。scope属性にその他の値を指定する場合、headers属性を指定する場合、あるいは、属性を指定しない場合、制作者の意図通りに見出しセルが認識されない環境・場合があるとしています。

この記事の素晴らしいところは、ブラウザーとスクリーン・リーダーが、セルが見出しセルかどうかをどのように判断しているかや、データセルに対応する見出しセルをどのように特定しているのかまで解説しているところです。加えて、HTMLの仕様にはデータセルから見出しセルを特定するアルゴリズムがありますが、これらのアルゴリズムがアクセシビリティAPIと合っていないことも解説されています。これらの解説によって、何を解決すれば、制作者の意図がユーザーにより伝わるのかを考えることができます。

短期的にはブラウザーやスクリーン・リーダーの挙動を見ながら、ユーザーにセマンティクスが伝わるマークアップが何かを考える必要がありそうですが、この記事が仕様(HTML)と実装(ブラウザーやスクリーン・リーダー)の足並みが揃うきっかけになることも期待しています。

Pick Up