ARIA: 文書構造ロール
ARIA 文書構造ロールは、コンテンツのセクションに構造的説明を提供するために使用されます。
構造的な ARIA ロールは、もともとブラウザーでまだ完全に対応されていない HTML5 要素を支援技術に知らせるブリッジとして作成されました。presentation
、toolbar
、tooltip
などの一部のロールは、同等のネイティブ HTML 要素が存在しない場合に、ドキュメント構造に関する情報を支援技術に提供します。以下の表にリストされているものを含む他のロールは、同じ意味を持つセマンティック HTML 要素があるため、必要ありません。多くの場合、これらと同等の HTML 要素は常にサポートされています。
警告: これらの構造ロールには、すべてセマンティック HTML の同等物があります。ここではドキュメントの完全性のために含まれています。できれば、ウェブ開発者は使用すべきではありません。代わりに HTML セマンティック要素を選択してください。
一部の構造ロール、例えば suggestion
などは、HTML の同等物を持たないため、別のドキュメントがあります。HTML の同等物を持つ一部の構造ロール、例えば heading
などは、ARIA 属性の要件があります。これらは個別のロールドキュメントへのリンクとともに以下にリストされています。
以下のロールのほとんどは必要ではありませんでしたが、完全性のために ARIA に追加されました。ここでも完全性のために含めています。
HTML 同等物を持つ構造ロール
HTML 同等物を持つ構造ロールを以下にリストします:
ARIA ロールと説明 | HTML 同等物 |
---|---|
associationlist associationlistitemkey の子とその兄弟の associationlistitemvalue のみを含みます。 |
<dl> |
associationlistitemkey associationlist に含まれている必要があります。 |
<dt> |
associationlistitemvalue 常に associationlistitemkey に続く兄弟です。 |
<dd> |
blockquote 別のソースから引用されたコンテンツのセクションです。 |
<blockquote> |
caption figure 、table 、grid 、treegrid に名前を付け、説明することもある表示コンテンツです。これらの 4 つのロールでのみ見つかります。caption の id は一般的に figure 、grid 、table 、treegrid の aria-labelledby 属性によって参照されます。禁止属性: aria-label と aria-labelledby 。 |
<caption> <figcaption> |
code コンピューターコードの断片を表すセクションです。 禁止属性: aria-label と aria-labelledby 。 |
<code> |
deletion 削除済みまたは削除が提案されているとマークされたコンテンツです。 禁止属性: aria-label と aria-labelledby 。 |
<del> |
emphasis コンテンツを強調または重視するために使用されますが、重要性を示唆するものではありません。 禁止属性: aria-label と aria-labelledby 。 |
<em> |
figure グラフィカルドキュメント、画像、コードスニペット、またはサンプルテキストのコンテナーです。 |
<figure> |
heading ページのセクションの見出しです。 ネストレベルを示すために aria-level 属性が必要です。詳細については heading ロール を参照してください。 |
h1、h2、h3、h4、h5、h6 |
image 画像を形成する要素のコレクションのコンテナーです。 img ロールの同義語です。 |
<img> |
img 画像を形成する要素のコレクションのコンテナーです。 アクセシブル名が必要です。 詳細については img ロール を参照してください。 |
<img> |
insertion 追加済みまたは追加が提案されているコンテンツとしてマークされたコンテンツです。 禁止属性: aria-label と aria-labelledby 。 |
<ins> |
list listitem 要素を含むセクションです。詳細については list ロール を参照してください |
<ol> <ul> |
listitem list または directory 内の単一のアイテムです。list に含まれている必要があります(<li> のように)。詳細については listitem ロール を参照してください。 |
<li> |
mark 参照または記述の目的でマークまたはハイライトされます。 詳細については mark ロール を参照してください。 |
<mark> |
meter 既知の範囲内のスカラー量、または分数値です。 アクセシブル名が必要です。 aria-valuenow が必要です。詳細については meter ロール を参照してください。 |
<meter> |
paragraph コンテンツの段落です。 禁止属性: aria-label と aria-labelledby 。 |
<p> |
strong 重要で、深刻な、または緊急のコンテンツです。 禁止属性: aria-label と aria-labelledby 。 |
<strong> |
subscript 1 つ以上の下付き文字です。 ロールが存在しないとコンテンツの意味が変わる場合のみ使用してください。 禁止属性: aria-label と aria-labelledby 。 |
<sub> |
superscript 1 つ以上の上付き文字です。 ロールが存在しないとコンテンツの意味が変わる場合のみ使用してください。 禁止属性: aria-label と aria-labelledby 。 |
<sup> |
term 対応する定義を持つオプションの単語または句です。 禁止属性: aria-label と aria-labelledby 。詳細については term ロール を参照してください。 |
<dfn> |
time 特定の時点をリストする有効な日付または時刻文字列フォーマットです。 禁止属性: aria-label と aria-labelledby 。 |
<time> |
メモ:
aria-label
および aria-labelledby
属性は、code
、caption
、deletion
、emphasis
、generic
、insertion
、mark
、paragraph
、presentation
、none
、strong
、subscript
、superscript
、suggestion
、term
、time
では禁止されており、対話型コンテンツでのみ使用すべきです。
仕様書
Specification |
---|
Accessible Rich Internet Applications (WAI-ARIA)> # document_structure_roles> |