暗黙のネイティヴロールセマンティックスがアクセシビリティAPIに対応づけされない要素。類義語none
を参照のこと。
注
ARIA 1.1において、ワーキンググループは、単語"presentation"または"presentational"の意図された意味の周囲の著者の混乱のために、presentation
のロールに同義語としてnone
を導入した。多くの人はrole="presentation"
をaria-hidden="true"
と同義であると誤って考え、我々はrole="none"
がより明確に実際の意味を伝えると考える。
実装がrole="none"
に対して十分なサポートを含むまで、ウェブ制作者は、presentation
ロールだけでrole="presentation"
またはnone
ロールのフォールバックとして重複してrole="none presentation"
を使用することを勧める。
要素がページの外観を変更するために使用されるが、要素型によって暗黙的な、機能的な、インタラクティブな、または構造の関連性を一切持たない、またはWAI-ARIAをサポートしない古いブラウザーでアクセシビリティフォールバックを提供するために使用する場合が使用目的である。
ユースケースの例:
- コンテンツが完全にプレゼンテーショナルな(スペーサー画像、装飾的なグラフィック、または要素をクリアするような)要素。
- 完全な代替テキストが使用可能であり
aria-labelledby
と(必要な場合)aria-describedby
でマークアップされるimg
ロールをもつコンテナーにおける画像。
- CSSの追加のマークアップ"フック"として使用される要素。または
- レイアウトテーブルおよび/またはその関連する行、セル、その他のいずれか。
フォーカス可能でない、presentationのロールをもつ任意の要素に対して、ユーザーエージェントは、アクセシビリティAPIへ要素の暗黙のネイティヴセマンティックス(ロールとそのステートおよびプロパティ)を公開してはならない。しかし、ユーザーエージェントは、presentationの明示的または継承されたロールを持たないコンテンツまたは子孫要素を公開しなければならない。このように、presentation
ロールは与えられる要素に何のロールも持たないものとして扱わさせる、またはアクセシビリティツリーから削除させるが、要素内に含まれているコンテンツにアクセシビリティツリーから削除させることはない。
たとえば、アクセシビリティAPIによれば、次のマークアップ要素は、同じロールセマンティックス(ロールなし)と同じコンテンツを持つように見えるだろう。
<h1 role="presentation"> Sample Content </h1>
<span> Sample Content </span>
<span role="presentation"> Sample Content </span>
Sample Content
presentation
ロールは、要素に対するデフォルトのアクセシビリティAPIロールが存在することを意味する、暗黙のネイティヴセマンティックスを持つ要素で使用される。一部の要素は、追加の子孫要素が与えられた場合にのみ完結する。たとえば、HTMLにおいて、(table
ロールとマッチする)table要素は、順番にth
またはtd
の子(cell
、columnheader
、rowheader
ロール)を要求する、tr
の子孫(row
ロール)を要求する。同様に、リストはリスト項目の子を必要とする。要素のセマンティックスを完全なものにする子孫要素は、必須の所有される要素としてWAI-ARIAに記載される。
presentation
の明示的または継承されるロールが、所有される要素を必要としているWAI-ARIAロールの暗黙のセマンティックをもつ要素に適用され、さらにpresentation
の明示的なロールを持つ要素である場合、ユーザーエージェントは、定義された明示的なロールを持たないすべての必須の所有される要素にpresentationの継承されたロールを適用しなければならない。また、presentationの明示的または継承されたロールは、ホスト言語仕様によって定義されるような任意の必須の子を持つホスト言語要素に適用され、さらにpresentationの明示的なロールを持つ要素である場合、ユーザーエージェントは、定義された明示的なロールを持たない任意の必須の子にpresentationの継承されたロールを適用しなければならない。
HTMLにおいて、<img>
要素は、画像ファイルのタイプにかかわらず単一の実態として扱う。したがって、HTML img
のrole="presentation"
またはrole="none"
を使用することは、aria-hidden="true"
を使用することと同じである。画像コンテンツをアクセシブルにするために、著者は、<object>
または<iframe>
要素を使用してオブジェクトを埋め込む、またはインラインSVGコードを使用して、画像コンテンツのアクセシビリティガイドラインに従うことができる。
presentationの明示的または継承されるロールをもちかつフォーカス可能でない任意の要素に対して、ユーザーエージェントは、その要素に対するロール固有のWAI-ARIAステートおよびプロパティを無視しなければならない。たとえばHTMLにおいて、presentation
のロールをもつul
またはol
要素は、ul
またはol
が対応するlist
ロールがlistitem
の必須の所有される要素を持つので、li
要素の暗黙のネイティヴセマンティックスを取り除かさせる。同様に、HTML table
要素のthead
/tbody
/tfoot
/tr
/th
/td
の子孫の暗黙のネイティヴセマンティックスも削除される。なぜなら、HTML仕様はこれらがtable
要素の構造的な子孫である必要があることが示されているためである。
注
WAI-ARIA必須の所有される要素に対応する要素の暗黙のネイティヴセマンティックスのみが削除される。この要素がまた適用されるpresentation
の明示的なロールを持たない限り、ネストした表やリストを含む、任意の他のコンテンツは、そのまま残る。
たとえば、アクセシビリティAPIによれば、次のマークアップ要素は、同じロールセマンティックス(ロールなし)と同じコンテンツを持つように見えるだろう。
<ul role="presentation">
<li> Sample Content </li>
<li> More Sample Content </li>
</ul>
<foo>
<foo> Sample Content </foo>
<foo> More Sample Content </foo>
</foo>
注
この状況が適用可能である必須の子をもつ他のWAI-ARIAロールが存在する(たとえば、radiogroupおよびlistbox)が、テーブルおよびリストは、プレゼンテーションの継承を適用する可能性がある最も一般的な実世界のケースである。
presentation
の明示的または継承されるロールをもつ任意の要素に対して、ユーザーエージェントは、プレゼンテーショナル要素に対するすべてのホスト言語固有の分類要素に継承されるpresentation
のロールを適用しなければならない。たとえば、captionは単なるプレゼンテーショナルテーブルのラベルであるため、presentation
のロールをもつtable
要素は、caption
要素の暗黙のネイティヴセマンティックスを取り除かせる。
presentation
ロールを画像に適用する場合、著者は(HTMLのalt=""
を使用するなど)意味のある代替テキストを提供すべきでない。
次のコードサンプルにおいて、img
を含むものは、キャプションの段落によって適切に分類される。ロールおよび代替テキストが包含する要素によって提供されるため、この例においてimg
要素はpresentationとしてマークすることができる。
<div role="img" aria-labelledby="caption">
<img src="example.png" role="presentation" alt="">
<p id="caption">A visible text caption labeling the image.</p>
</div>
次のコードサンプルにおいて、アンカー(HTMLのa
要素)はtreeitemとして動作しているので、リスト項目(HTMLのli
要素)は、リスト項目に対するユーザーエージェントの暗黙のネイティヴセマンティックスを上書きするために明示的なWAI-ARIA presentationロールが割り当てられる。
<ul role="tree">
<li role="presentation">
<a role="treeitem" aria-expanded="true">An expanded tree node</a>
</li>
…
</ul>
プレゼンテーショナルロールの競合を解決するためのさまざまな方法がある。
ユーザーエージェントは、以下の例外を除いて、アクセシビリティツリーで明示的または継承されたプレゼンテーショナルロールを持つ要素を公開してはならない。
- 要素がフォーカス可能である、またはインタラクティブである場合、ユーザーエージェントは、要素が操作可能であることを保証するために、
presentation
ロールを無視し、暗黙のロールで要素を公開しなければならない。
- 必須の所有される要素が明示的な非プレゼンテーショナルロールを持つ場合、ユーザーエージェントは継承されたプレゼンテーショナルロールを無視し、明示的なロールで要素を公開しなければならない。明示的なロールを公開するアクションにより、アクセシビリティツリーが不正な形式になる場合、期待される結果は未定義である。
- 要素がグローバルWAI-ARIAステートまたはプロパティを持つ場合、ユーザーエージェントは
presentation
ロールを無視し、暗黙のロールで要素を公開しなければならない。しかし、要素が非グローバルで、ロール固有のWAI-ARIAステートまたはプロパティのみを持つ場合、プレゼンテーショナルロールが継承され、明示的な非プレゼンテーショナルロールが適用されない限り、要素を公開してはならない。
たとえば、aria-describedby
はグローバル属性であり、常に適用される。要素がプレゼンテーショナルステートではなかった場合、aria-level
はグローバル属性ではなく、したがって適用のみされる。
<h1 role="presentation" aria-describedby="comment-1"> Sample Content </h1>
<h1 role="presentation" aria-level="2"> Sample Content </h1>