みんな大好きAnother HTML Lint。
こいつで<TH> には ABBR 属性を指定するようにしましょう。
という警告に遭遇した。
ちょっと迷ったので「th abbr」でぐぐると、かなりのページがヒットする。
それらの中から、いくつかピックアップしてみる。
- アクセシブルなテーブル/HTML基礎講座
-
abbr属性を使った構文は以下のとおりです。
<th abbr="受験者">氏名</th>
こうすることで、音声ブラウザは 「受験者氏名」と発声して見出しに示される補足的な内容と共に、視覚障害を持った閲覧者が理解できるようになります。
- これを見るとあたかも、「abbr属性の値とth要素の値が連結されて読み上げられる」ように思える。
- テーブルとアクセシビリティ -- ごく簡単なHTMLの説明
-
このような時には、[HTML4]で導入されたabbr属性で、th要素にその省略形を加えておくことで、データセルの読み上げ時には省略した見出しをつかうことができます。
[例2]
<th abbr="利益">売上総利益（損失）</th>...
<th abbr="販管費">販売費及び一般管理費合計</th>...
このabbr属性を指定すると、[HPR]は2000年の販売費のセルを、長い見出しではなく「販管費 2000年 70億」と読み上げます。
- 「th要素の値の代わりにabbr属性の値が読み上げられる」と読める。
- 小粋空間: カレンダー アーカイブ
-
<th abbr="Sunday"><span class="calendar"><span class="red">Sun</span></span></th>
- なぜブログにカレンダーを表示していないブログが多い？ [ mokari.boo.jp journal ]
-
<th abbr="日曜日">日</th>
- この２例は他人が書いたコードを引用しているようで、槍玉に挙げるのはちと気の毒ではあるが、これはどう見ても「abbr属性の値がth要素の値の非省略形になっている」例である。
もちろん、仕様書も当たってみなければなるまい。とはいえ、英語は面倒なので日本語版を見ると、この属性は、コマ内容の省略形を提供するために用いる必要がある
とある。
いや…やはり、こういうのは翻訳の些細なミスで意味が180度違ってしまうこともあるから、原典も見ておくか。えーと、This attribute should be used to provide an abbreviated form of the cell's content
だそうである。間違いなさそうだ。
読み上げエージェントの仕様次第という面もあるとはいえ、自信を持って「正しい」と言えるのは、２番目に紹介した例であろう。さすが神崎さんである。
逆に、自信を持って「間違い」と言えるのが最後の２例である。
どうしてこういう間違いが起きたのか。これは推測でしかないが、そもそも、それが、この属性について調べるきっかけでもある。
HTML 4.01にはABBR要素というのもあるのである。こいつは、要素内容が略語となり、title属性で非省略形を記述する。この際、思い切って要素名と属性名には目をつぶり、要素と属性という関係にだけ着目すれば、ちょうど、th要素のabbr属性と正反対の関係になっていることがわかる。
ちょっと考えればわかりそうなものだが…いやいや、それは、自信を持てずにこうして調べてしまった俺に言えたことではないか。
というわけで、覚えておきましょう。th要素の内容が非省略形、abbr属性が省略形が正解です。