miChecker:『areaのalt属性 ”*”は文字間に空白を含んでいるため、音声で正確に読み上げることが出来ない可能性があります。』

技術コラムAMCC,miChecker

検出理由

「問題の可能性大」として検出される項目です。
area要素を用いてイメージマップ上でのクリック可能な領域を定義する時、領域を画像に変わって説明するalt属性に、空白を含むテキストが設定されていると検出されます。単語の間に空白があれば常に検出しているわけではなく、漢字の文字数と空白の数などで判定しているようです。漢字2文字からなる単語を1つの空白で2分割すると必ず指摘されます。漢字3文字あるいは4文字だと2つの空白で3分割されると指摘されます。

根拠

ブラウザや支援技術などのプログラムは、テキストを解析する際に空白は区切りであると認識する可能性があります。例えば、音声ブラウザは読み上げの際に誤った読み上げを行う可能性があります。あるいは、音声認識プログラムで操作しようとしたとき、発声した内容とプログラムが認識している語に相違が生じる可能性もあります。

<area shape="rect" coords="0,0,100,50" href="#" target="_blank" alt="北 海 道">

音声ブラウザは「北 海 道」を"ほっかいどう"と読まずに"きた うみ みち“と読み上げる可能性がある。利用者は何のことかわからない。

修正方針

代替テキスト中の無用な空白を取りぞいてください。

<area shape="rect" coords="0,0,100,50" href="#" target="_blank" alt="北海道">

補足

代替テキストであって表示されるものでもないため文字間の空白は不要です。

miCheckerでは文字間空白を次の様なケースでも検出し報告します。

  • (検出語)は文字間に空白を含んでいるため、音声で正確に読み上げることが出来ない可能性があります
  • (検出語)ボタン(inputのvalue属性)は文字間に空白を含んでいるため、音声で正確に読み上げることが出来ない可能性があります。
  • 画像のalt属性”(検出語)”は文字間に空白を含んでいるため、音声で正確に読み上げることが出来ない可能性があります。
  • 画像ボタンのalt属性”(検出語)”は文字間に空白を含んでいるため、音声で正確に読み上げることが出来ない可能性があります。

「問題の可能性大」の項目ではありますが、指摘の正解率も高い項目ですので、指摘された箇所はすべて確認し問題の無いことを確認すべきです。

関連する達成基準、達成方法


(他のテクニックは「miChecker対策テクニック集」に整理されています。)

2021年2月9日