aria-*属性 * - 要素の状態とプロパティ  (WAI-ARIA)

■ 概要

項  目説  明
記述形式 以下の解説および WAI-ARIA を参照   
値 の形式 以下の解説および WAI-ARIA を参照   
対応ブラウザー C?+ / e?+ / N?+ / Fx?+ / Op?+ / Ch?+ / Sa?+
適用可能な要素
(種  類)
すべての要素,または,指定可能としている要素
 (グローバル属性,または,固有属性
継  承 する

■ 解説

aria-*属性 は,

HTML5 の規定に基づく 属性 ではありません。  HTML のほか,xml なども含めたより広範囲の複数のページ記述言語を対象として,W3CWAI(Web Accessibility Initiative) が定めた Accessible Rich Internet Applications (WAI-ARIA)Ver. 1.0:2014年3月20日 勧告Ver. 1.1:2016年10月27日 勧告候補)により規定されているものです。 

この WAI-ARIA は,Webページの「情報アクセシビリティ」 について,様々な Web コンテンツをよりアクセシブルにすための規格 として策定されました。 その基になっているのが,同じく W3C が 2008年12月11日に勧告した Web Content Accessibility Guidelines (WCAG) 2.0 です。 これは Web コンテンツアクセシビリティに関するガイドライン であり,国際規格 ISO/IEC 40500:2012 としても,さらに,日本の JIS X 8341-3:2016 としても採用されています。

HTML5 では,WAI-ARIA の要素の 役割 および 状態とプロパティ を記述するための属性として, role 属性aria-* 属性HTML5 の仕様書(HTML5: A vocabulary and associated APIs for HTML and XHTML, 2014年10月28日勧告) で参照されています。 これについては,HTML5の通常の属性とは別に,PF/XTech/HTML5/RoleAttribute として,規格策定が進められました。

WAI-ARIA Ver. 1.0 の勧告内容は,詳細かつ多岐にわたるもので,ここにそのすべてを記すことはできません。 ただし,本リファレンスの各 要素 のページの 属性 欄中の表の後半には,HTML5の勧告内容 に従って,【ARIA role属性】 で指定可能な値 (役割)【ARIA aria-* 属性】 で指定可能なもの(状態とプロパティ) が示されております。どうぞ,これらを活用してください。

とりあえず,このページでは,aria-*属性 として,全体として,どのような値のとり方の種類があるのか,また,どのような種類のものがあるのかを列挙することにとどめることにします。 なお,詳細については WAI-ARIA Ver. 1.0 を参照してください。

1. aria-*属性の値の種類

状態とプロパティ (aria-*属性)の値の形式。値の種類は通常以下のうちのいずれかです。

値の種類説  明
true/false "false"を既定値として,true か false のいずれかの値を表します。
トライステート(3状態) true と false に加えて,中間の "mixed" という値のいずれかの値を表します。既定値は指定がない場合には,"false"です。
true/false/undefined true と false に加えて,「状態」や「プロパティ」が不明であることを示す"undefined" という既定値のいずれかの値を表します。
ID の参照 同一文書中の他の要素の「id属性の値」を参照します。
ID の参照リスト 1個以上の ID参照からなるリスト。
整数 分数部分を含まない数値。
数値 任意の実数値。
文字列 とくに制約をもたない値。
トークン(token) 指定可能な値の特定の制限された集合内の1つ。
トークンリスト 1個以上のトークンからなるリスト。
備  考 ある「状態」や「プロパティ」で "undefined" という値が指定可能である場合は,この値は「状態」や「プロパティ」が集合ではないことを明示していることになります。この "undefined" は,トークンで指定する値をもつ「状態」と「プロパティ」でも使用されますが,その場合,指定可能なトークンのうちの1つである文字列になります。また,"undefined" が "false" とは異なる意味をもつ場合には,いくつかの true/false値をもつ「状態」と「プロパティ」で使用されます。
これらの値は,「状態」や「プロパティ」に対する一般的な形式で,特殊な表現については定義を与えていません。

2. WAI-ARIA のグローバル状態とプロパティ

いくつかの「状態」「プロパティ」は,役割(roles) の指定の有無にかかわらず,HTML のすべての 要素に適用可能です。すなわち,次の グローバル状態とプロパティ は,すべての役割(roles)およびマークアップされた要素で利用可能です。

グローバル状態とプロパティは,(規格上は)roletype役割(基本役割であり全ての役割に継承する)に適用されます。読み易くするために,これらが規格上はある役割に適用されることや継承された状態とプロパティであることは明示してありません。

3. WAI-ARIA の状態とプロパティ(aria-*属性)の分類

状態プロパティ は,

  1. ウィジェット属性
  2. ライブ領域属性
  3. ドラッグアンドドロップ属性
  4. 関係属性

のように分類されます。 以下に,これら4種類に含まれる 状態とプロパティ を示しておきます。

3.1 ウィジェット属性 (Widget Attributes)

GUIシステム上やリッチインターネットアプリケーション内で見られる,ユーザーの入力やアクションを受信する汎用のユーザーインターフェース 要素 を対象とする 属性 が含まれています。これらの属性は,ウィジェットとしての役割 をサポートするために用いられます。

ウィジェット属性は,支援技術(assistive technologies) によるアクセスに対して,ブラウザーによって,プラットフォームアクセシビリティー API状態 にマッピングされるかもしれませんし,また,DOM から直接アクセスされるかもしれません。ブラウザーは, DOM 属性変更 イベントまたはプラットフォームのアクセシビリティーAPIイベントのいずれかを通じて,状態を変更するときには支援技術に通知するための方法を 提供しなければならなりません

3.2 ライブ領域属性 (Live Region Attributes)

リッチインターネットアプリケーション内の ライブ領域 を対象とする 属性 が含まれています。 これらの属性は,任意の 要素 に適用することが可能です。 この属性の目的は,コンテンツの変更がその要素がフォーカスをもっていないで状態で発生することがあることを明示し,支援技術 にこれらのコンテンツの更新をどのように処理するかの情報を提供することです。 一部の役割では,aria-live属性に対して,その役割に固有の既定の を指定しています。ライブ領域の1例として,株価情報の更新を列挙するティッカーセクションが挙げられます。

3.3 ドラッグアンドドロップ属性 (Drag-and-Drop Attributes)

ドラッグ可能な要素およびそのドロップターゲットなどのドラッグアンドドロップインターフェイス 要素 に関する情報を表す 属性を列挙します。ドロップターゲットの情報は,著者によって視覚的にレンダリングされ,また,代替モダリティ (modality) を通じて 支援技術に提供されます。

ドラッグアンドドロップ属性の使用方法についてのより詳しい情報は, WAI-ARIA Drag-and-Drop Support in the WAI-ARIA Authoring Practices([ARIA-PRACTICES])を参照してください。

3.4 関係属性 (Relationship Attributes)

文書構造から容易に決定することができない 要素 間の 関係 または関連を表す 属性を列挙します。

■ 使用例( aria-*属性の利用)

現在準備中です。

■ 備考