解説

アクションやイベントから生じる可能性のある結果をユーザーに通知します。例としては、警告、注意、危険などがあります。

例1 — 見出し付きの通知

ラベルはaria-labelledby属性で識別します。

<div role="doc-notice" class="danger" aria-labelledby="alert01">
   <img id="alert01" src="warn.jpg" alt="Warning"/>
   <p>Serious bodily injury may result …</p>
</div>
例2 — 見出しのない通知

ラベルはaria-label属性で提供します。

<div role="doc-notice" class="warning" aria-label="warning">
   <p>Exercise caution when mixing …</p>
</div>

ARIAとの関係

doc-noticeは、noteロールからセマンティクスを継承します。

使用方法

doc-noticeは通常、 div要素で使用します。このロールは、色が重要度の主な指標として使用される場合に特に便利です(たとえば、警告には黄色の枠線が、危険には赤色の枠線が、明示的なラベルの代わりに使用される場合があります)。

role属性に認められる値についての簡易リストは、EPUBタイプによるARIAロール製作ガイド(EPUB Type to ARIA Role Authoring Guide)対応表をご覧ください。正式なリストは、HTMLのARIAについて(ARIA in HTML)を参照してください。

関連リンク