aria-setsize
aria-setsize 属性は、セット内の全ての項目が DOM に存在しない場合に、現在のリスト項目またはツリー項目のセット内の項目の数を定義します。
解説
ブラウザーは、リスト内の <li> の数、同じ名前の ラジオボタン グループ内のボタン、<select> 内の <option> の数など、項目のグループ内の各項目のセットサイズと位置を自動的に計算します。スクリーンリーダーなどの支援技術は、この状態管理を利用してセットサイズをユーザーに報告します。
DOM が完全でない場合、ブラウザーが計算するセット内のアイテム数が不正確になる可能性があります。リストアイテムなどのアイテムのサブセットのみが DOM に読み込まれると、ブラウザーは存在するアイテムのみに基づいてアイテム数を計算します。aria-setsize 属性は、ブラウザーの不正確なカウントを上書きするために使用する必要があります。これは、セット全体が読み込まれた場合の現在のリストアイテムまたはツリーアイテムセット内のアイテム数を定義します。
aria-setsize 属性は、コンテナー要素ではなく、各アイテムに設定されます。値は各アイテムで同じです。完全なセット内のアイテムの数を反映する整数、またはセットサイズが不明な場合は -1 です。全てのアイテムが DOM 内に存在する場合、ブラウザーがセットサイズと各アイテムの位置を計算できるため、aria-setsize と aria-posinset はどちらも不要になります。
aria-setsize を持つ要素には通常、セット内でのその項目の位置を示す aria-posinset 属性も含まれます。aria-posinset は 1 と aria-setsize の正の値の間の値をとります。
例えば、ページのコメント欄において、コメントがページネーションされている場合など、コメントが DOM 内に全て収まらない場合は、階層レベル、コメントの総数、各コメントの位置を ARIA で設定します。コメントの階層レベルは aria-level で示せます。グループの位置情報は aria-posinset と aria-setsize で示します。
フィード内の記事数が固定されている場合、各記事要素に aria-setsize を追加できます。値は、読み込まれた記事の総数またはフィード内の記事の総数のいずれかになります。どちらの値が選ばれるかは、どの値がユーザーにとって最も役立つかによって異なります。記事数が非常に多い、不確定である、または頻繁に変更される場合は、セットのサイズが不明であることを通知するために aria-setsize="-1" を設定できます。
listbox では、スクロール時の動的読み込みにより、使用可能なオプションの完全なセットが DOM に存在しない場合、各 option に aria-setsize と aria-posinset の両方を設定できます。
ツリービューでは、ユーザーがツリー内でフォーカスを移動したりツリーをスクロールしたりするときに動的に読み込まれるため、使用可能なノードの完全なセットが DOM に存在しない場合、各ノードには aria-level、aria-setsize および aria-posinset が設定されます。
メニューでは、aria-setsize は menuitem、menuitemcheckbox または menuitemradio の全てのロールに設定され、値は区切り線を除いたメニュー内の項目の合計数になります。
例
次の例では、16 個のセットのうち 5 番目から 8 番目の項目を示します。
<h2 id="label_fruit">Available Fruit</h2>
<ul role="listbox" aria-labelledby="label_fruit">
<li role="option" aria-setsize="16" aria-posinset="5">apples</li>
<li role="option" aria-setsize="16" aria-posinset="6">bananas</li>
<li role="option" aria-setsize="16" aria-posinset="7">cantaloupes</li>
<li role="option" aria-setsize="16" aria-posinset="8">dates</li>
</ul>
ユーザーに指示を与えるために、支援技術では上記のバナナを「16 個中 6 番目」としてリストします。
値
<integer>-
全セット内のアイテム数または、
-1はセットサイズが不明であることを示します。
関連インターフェイス
Element.ariaSetSize-
Elementインターフェイスの一部であるariaSetSizeプロパティは、aria-setsize属性の値を反映します。 ElementInternals.ariaSetSize-
ElementInternalsインターフェイスの一部であるariaSetSizeプロパティは、aria-setsize属性の値を反映します。
関連付けられたロール
使用するロール:
articleassociationlistitemkeyassociationlistitemvaluecommentlistitemmenuitemoptionradiorowtab
継承先のロール:
仕様書
| Specification |
|---|
| Accessible Rich Internet Applications (WAI-ARIA) # aria-setsize |