チェックボックスロールはチェック可能なインタラクティブなコントロールに使用されます。もし要素が role="checkbox" を使っていたら 、支援技術へチェックボックスのステートを公開するためにaria-checked 属性も持つ必要があります。ネイティブHTMLのチェックボックスフォームコントロールが２つののみ（ "checked" もしくは "not checked" ）をもてる一方で、role=checkbox 要素は aria-checked を通して３つのステートを公開できます:
- aria-checked="true": チェックボックスはチェックされています
- aria-checked="false": チェックボックスはチェックされていません
- aria-checked="mixed": チェックボックスは部分的にチェックされています
開発者はチェックボックスが作動した際に、 aria-checked 属性を動的に変更する必要があります。
チェックボックスはインタラクティブなコントロールなので、フォーカス可能かつキーボードからアクセス可能でなければなりません。 ロールがフォーカス可能ではない要素に適応されたとしたら、フォーカスを可能にするために tabindex 要素が使用されなければなりません。チェックボックスを動作させるために期待されるキーボードショートカットはスペースキーです。
ユーザーエージェントと支援技術への影響
チェックボックスロールが要素に付与されたときに、ユーザーエージェントは次のように振る舞わなければなりません:
- チェックボックスを持っている要素を、オペレーティングシステムのアクセシビリティAPIへ公開します。
- aria-checked の値が変わった際に、アクセシブルなす～手との変更イベントを送信します。
支援技術製品は次のように振る舞わなければなりません:
- スクリーンリーダーは要素をチェックボックスとしてアナウンスしなければなりません。またオプションでチェックボックスを動作させる方法を提供します。
注記: 支援技術がこの技術をどう扱うべきかについて、意見は分かれています。上記の情報はこれらの意見の一つであり、標準的なものではありません。
例
例1: ARIA によるチェックボックスロールの追加
<span role="checkbox" aria-checked="false" tabindex="0" id="chk1"></span>
<label for="chk1">Remember my preferences</label>注記
使用された ARIA 属性
関連する ARIA 技術
互換性
TBD: 一般的なUAとAT製品の組み合わせサポート情報の追加