WAI-ARIAを学ぶときに整理しておきたいこと

結論 ロールについて知る HTMLの暗黙のロールを知る ロールを知った上でロールに対して使用できるプロパティ/ステートを使う (おまけ) markuplintを使おう aria属性を使う前に まず、いきなりaria-labelやaria-selectedとかに手を出さない。 aria-selectedとかを発見してしまうと「option要素以外にもselectedみたいな意味を付加できるんだ！すげえ！使ってみよう！」みたいな気持ちが沸き上がってしまう。わかる。とってもよくわかるよ。当時ぼくもそうだったから。 ただ、そこはぐっと我慢してほしい。 なぜかと言うと、aria属性は、使っていいときと悪いときがある。きちんとWAI-ARIAという仕様と、ARIA in HTMLやCore Accessibility API Mapping (Core-AAM)という仕様で決められていっている[1]の

[ginpei]

まず要素ごとのロールを意識し、本当に必要ならrole属性を与え、ロールの範囲でaria-*属性でプロパティを設定する。良し悪しの例などが多くてわかりやすい。

[shingo-sasaki-0529]

<div> みたいな generic ロールに対してアクセシブルネーム振れないの初めて知った。まぁそもそもアクセシビリティ気にする人が <div> <span> でみだりにマークアップすることはないだろうけど。