国勢調査のインターネット回答をしつつ、アクセシビリティはどうか見てみた

今年は国勢調査の年で、インターネット回答に関する書類が手元に来ました。早速回答をしながらアクセシビリティはどうか、少しチェックしてみました。回答にはあえて普段使っているMacBook Proは使わず、家族共用のWindows 8.1マシン、ブラウザはInternet Explorer 11を利用しました。また、音声読み上げ対応かにこだわるわけではないですが、スクリーンリーダーであるNVDAも起動して回答しました。ちなみに、2010年は東京都に住んでいてインターネット回答をした記憶があるので、インターネット回答は2回目です。

結論を書くと、アクセシビリティに関しては、やはり(と想像してしまう状況がアレですね...)イマイチという結果になりました。次回の調査では、回答画面のアクセシビリティが高まることを期待します。

気付いた点を以下に列挙します。(画面キャプチャは念のため止めておきます。)

  • 画面を遷移する度に次の画面に遷移するためのボタンや入力フィールド、もしくは入力フィールドがあるtable要素に勝手にフォーカスが当たるようにしてあるようです。フォーカス対象の前に説明書きなどがあるのですが、スクリーンリーダーは何も読み上げません。
  • 赤いクエスチョンマークがあって、td要素にマウスオーバーすると入力のヒントが出るのですが、マウス以外のデバイスではどうやってもヒントを見ることはできません。
  • <span class="boldtext">強調したい文章</span>のようなマークアップで、セマンティクスが伝わりません。
  • チェックボックス・ラジオボタンとラベルがほとんど関連付けられていません。label要素があっても空だったり...。なので、何の項目なのか全く分かりません。(テキストフィールドもか...。)
  • input要素が配置されているテーブルはthead要素やth要素は使われておらず、内容が掴みづらいです。(もしth要素が使われていたとしたら違っていたかもと。td要素にinput要素だけ配置して読み上げさせたことがないので、ちょっと想像がつかず。)
  • 回答が完了した最後の画面で、再度入力画面にアクセスするために利用するパスワードを設定するモーダルウインドウが開くのですが、これはスクリーンリーダーだと気付かないのでは。また、最初に書いたように入力フィールドに自動でフォーカスが当たるので、さらに分かりにくいかと。
  • 文字サイズ変更ボタンがありますが、「大」にしてもほとんど大きくなりませんでした。(1.184倍ぐらいかな?)
  • 個々の設問に関する詳細な解説は新しいウインドウで開きます。

チェックボックス・ラジオボタンの件を補足すると、氏名の横に10個ぐらいのセルがあって、その中にチェックボックス・ラジオボタンがあるのですが、個々のチェックボックス・ラジオボタンが何の選択肢なのかが全く分からない状況でした。

余談ですが、漢字で入力して欲しい部分は、CSSでime-mode:active;が指定されていたせいで、なぜか(というか前からそうなる気がしている)IMEが「かな入力」モード(ローマ字入力ではなく、50音のキーを押して入力する方法)になってつらかったです。(ATOKだから?)

今回利用したのはパソコン版ですが、スマートフォン版はどうなのでしょうか。また時間があれば見てみたいと思います。