ARIA: Accessible Rich Internet Applications
出典: MDC
Accessibility Rich Internet Applications(ARIA) の Firefox による実装は、ツリービューやメニューバー、表計算などのデスクトップスタイルのウィジェットを、キーボードとスクリーンリーダや拡大鏡、代替入力機器などの支援技術から利用可能にします。また、ページ上で一部を AJAX スタイルのライブアップデートを行う際のアクセシビリティの解決策を提供します。
ARIA は、以前は DHTML アクセシビリティとして知られており、W3C - World Wide Web Consortium にて開発中の標準です。すべての文書は Protocols and Formats Working Group 公式ページ で利用可能です。ここには、ARIA ロードマップ および ARIA roles 仕様, states モジュール が含まれます。
Firefox における ARIA のためのソースコードは IBM によって寄贈されています。
また、ARIA のよくある質問とその答え(FAQ) もご覧ください。
目次 |
ARIA の例は Firefox の実装で説明することができます。コミュニティが W3C の Protocols and Formats グループがいくつかの標準化プロセスを経て ARIA 実装へと移行するのを待つ間、今日のウェブサイトはすでに Firefox の ARIA サポートを利用して書かれています。バグ修正と小さな改良は続いており、Firefox における ARIA サポートは進化し続けています。
[編集] キーボードによる操作
キーボードナビゲーションは二通りの方法でサポートされています:
- HTML の
tabindex属性を通して、どの HTML 要素へもタブで移動可能にし、また少なくとも、スクリプトやマウスを通してフォーカスすることができます。タブで移動可能な要素と単にフォーカス可能な要素を区別することによって、コンテナ内の子要素を矢印キーを使って移動できる、ツリービューや表計算のようなコンテナウィジェットを開発することができます。現在、これは Internet Explorer や Firefox, Opera で動作します。Safari では動作しません。キーボードから操作可能な DHTML ウィジェットの tabindex コードの書き方は、Practical documentation on building key navigable custom widgets を参照してください。 -
aria-activedescendant属性を通して。これを利用すると、とても簡単です。(例えば、list や tree, grid などの) コンテナウィジェット 上に tabindex="0" を置くだけで、ウィジェットがタブの移動順に追加されます。そして、aria-activedescendant="[id]" 属性を持つ、現在フォーカスされたものの子孫にフォーカスが移ります。コンテナウィジェット上の keydown ハンドラは、そのフォーカスが移った子孫に変更され、現在の項目がそれと分かるように (border や background color によって) スタイル付けされます。この方法は、すべてのブラウザで動作させることができます。この動作を直接描いた例は、listbox example のソースコードをご覧ください。
[編集] 支援技術のための基本的なサポート
支援技術のサポートには、Firefox 2 以降と、各ウィジェットを記述するために ARIA マークアップを使用するコンテンツを必要とします。例えば、各ウィジェットの種類を指定するために ARIA role を使用する必要があります。ウィジェットの種類にはメニューやスライダー、プログレスバーなどがあります。各 role は、checked および selected, required, invalid, expanded などの追加の property 属性をサポートします。
[編集] マークアップ例
ARIA の勧告が変更され、名前空間がマークアップ内で使用されなくなったため、HTML 内で使用できるようになりました。
例えば、checkbox は以下のように指定します:
[編集] HTML では (要 Firefox 3)
<span tabindex="0" role="checkbox"
aria-checked="true"
onkeydown="return checkBoxEvent(event);"
onclick="return checkBoxEvent(event);">
チェックボックスのラベル
</span>
[編集] 伝統的な名前空間によるアプローチ (サポートされません)
これは、歴史に残しておくための名前空間によるアプローチです。この方法は宣言が使用されるため、XHTML が必要です。Firefox 3 ではサポートされません:
<span tabindex="0" role="wairole:checkbox"
aaa:checked="true"
onkeydown="return checkBoxEvent(event);"
onclick="return checkBoxEvent(event);">
チェックボックスのラベル
</span>
上記の checkbox はカスタム構成です。しかし、支援技術とユーザに関しては通常の checkbox のように動作します。作者が望めば、CSS を通してビジュアルな外観にすることができます。以下に各属性の意味を解説します:
| 属性 | 意味 |
|---|---|
tabindex="0" |
<span> ベースのチェックボックスをタブで移動する順番に含め、マウスでクリックしてフォーカスできるようにします。対照的に、tabindex="-1" はスクリプトやマウスクリックから要素をフォーカスできるようにしますが、既定のタブで移動する順番には含まれません。 |
role="checkbox" |
これが checkbox であることを指定します。スクリーンリーダなどの支援技術は、これが checkbox であることを知ることができます。 |
aria-checked="true" |
checkbox はチェックが入っているかどうかをサポートしています。この指定により、checkbox がチェック可能であることを示しています。property は支援技術にも向いています。 |
onkeydown="return checkBoxEvent(event);" |
スペースキーでチェックの切り替えができるようにします。checkBoxEvent() メソッドでこれを実装しています。同様に、(消費された)イベントが伝達され続けるべきではない場合に false を返します。 |
onclick="return checkBoxEvent(event);" |
キーボードハンドラに加えて、これも必要です。checkbox をクリックすると checkbox の値を切り替えます。 |
このマークアップが使用されている例は、ARIA サンプル をご覧ください。Firefox はこれらのマークアップ role と property を MSAA - Microsoft Active Accessibility とATK - Accessibility Toolkit (from Gnome Accessibility Project) から実装しています。これは、Windows と Linux 上でのアクセシビリティ API 標準です。ウィジェットの情報がアクセシビリティ API 標準を通して公開されているため、支援技術はこれらのウィジェットを用いて、新しいコードなしで多くの互換性を得ることができます。現在、最も完全なスクリーンリーダによるサポートには Window-Eyes 5.5 が必要です。ZoomText などのスクリーン拡大鏡もまた、ARIA と互換性があります。
Internet Explorer による role や property のサポートは現在利用できません。Internet Explorer は現在、これらのウィジェットのキーボード操作のみサポートしています。支援技術ベンダーは、Internet Explorer を変更せずに DOM と DOM 変更イベントを直接探すことによって、ARIA のセマンティクスをサポートできるようにするべきです。
[編集] XHTML と HTML のどちらを選ぶか
XHTML と HTML (または SVG と XUL) のどちらを使用するかという問題はなくなりました。Firefox は名前空間なしの新しいマークアップを、他のものと同じ方法で処理します。content type の心配をしなくても、ARIA マークアップ宣言を使用し、それを他のものと同様に動的に設定することができます。初期の ARIA の扱いに比べれば、これは劇的な向上です!
[編集] サンプルウィジェット
[編集] キーボードとマウスによる操作をテストする
キーボードまたはマウスによる操作は、Internet Explorer と Firefox のどちらでも可能です。サンプルの HTML バージョンのみが Internet Explorer 上でテストし、動作するように作られているので注意してください。サンプルの XHTML バージョンはそうではありません。
[編集] Firefox のアクセシビリティ拡張でテストする
Firefox Accessibility Extension は ARIA role のアクセシビリティをテストする機能を持っています。
[編集] スクリーンリーダでテストする
スクリーンリーダのサポートは Firefox 1.5 以降でのみ利用可能です。以下のコンポーネントをインストールする必要があります:
- Firefox: Firefox からダウンロードしてインストールしてください。
- スクリーンリーダ: スクリーンリーダでテストするには Window-Eyes 5.5 以降が必要です。加えて、JAWS 7.x が ARIA の一部をサポートしています。また、Orca 2.20 以降が Firefox 3.0 のほとんどの ARIA ウィジェット型をサポートしています。
[編集] サンプルはどこにありますか?
注意: 以下の例は、次のセクションの role/property にもあります。
[編集] Dojo Toolkit
Dojo 1.0 widget toolkit のすべての Dijit ウィジェットコアは ARIA をサポートしています。スクリーンリーダをサポートする Dojo の例は、Firefox 2 または Firefox 3 で開かなくてはなりません。
[編集] イリノイ大学
イリノイ大学の ARIA テストスイートは、スクリーンリーダのサポートに Firefox 3 が必要です。
[編集] Mozilla ベアボーンの例
Mozilla.org の ARIA テストページは、ここから学ぶためのいくつかの例を提供しています。スクリーンリーダのサポートは Firefox 3 が必要です:
- Checkbox, 説明つき Button
- グラフィカルな slider, 簡単な slider, Progress bar
- Alert
- menubar 付きの Grid (spreadsheet)
- タブパネル
- Listbox
- Tree ビュー, Tree ビュー #2
[編集] CLC World: live region の例
現在の live region の例 は Fire Vox 内で動作します。Fire Vox スクリーンリーダ拡張の実行は、Firefox のどのバージョンを使用しても問題ありません。
[編集] サポートされている role
ここには、Firefox に対応した使用例のある role と 各 role に対応する property の表があります。一部の property は "universal properties" であり、すべての要素上で動作することに注意してください。詳しくは、対応する property のセクションをご覧ください。
他の方法で指示されていない限り、property はブーリアン値で true または false に対応します。ブーリアン値である場合は、値が設定されていない属性には false が設定されます。
ただし、checked および selected, expanded 属性は特別です。属性に false が提供されている場合は、ウィジェットが checkable/selectable/expandable であると指示され、false が無いものとは異なります。
また私たちは、これらの情報を Firefox がどのように Windows(MSAA) や Linux(ATK) 上のアクセシビリティ API を通して公開しているか、技術の詳細を提供しています。
| Role | サポートされている作者が定義した property † | 自動的にサポートされる property | 使用例 | Firefox 1.5 対応 | Firefox 2 対応 | Firefox 3 テストビルド対応 |
|---|---|---|---|---|---|---|
alert |
子コンテンツまたは title 属性からの名前 |
Mozilla.org alert, [1] | Window-Eyes 5.5 以降、ZoomText 9.1 以降、JAWS 7.1 以降 | |||
alertdialog |
子コンテンツまたは title 属性からの名前 |
なし | Window-Eyes 5.5 以降、ZoomText 9.1 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、ZoomText 9.1 以降、JAWS 7.1 以降 | ||
application |
Mozilla.org Grid (spreadsheet) と menubar | Window-Eyes 5.5 以降 | Window-Eyes 5.5 以降、Orca 2.20 以降 | |||
button |
|
子コンテンツまたは title 属性からの名前 |
Weba11y button 説明付きの Mozilla.org button, UIUC button | Window-Eyes 5.5 以降、JAWS 8.0 以降 | Window-Eyes 5.5 以降、JAWS 8.0 以降、Orca 2.20 以降 | |
checkbox |
|
子コンテンツまたは title 属性からの名前 |
Mozilla.org checkbox, UIUC checkbox | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 | |
columnheader |
|
子コンテンツまたは title 属性からの名前 |
Mozilla.org grid (spreadsheet) と menubar | Window-Eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | |
combobox |
|
title 属性からの名前 |
Mozilla.org combo box | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 | |
description |
子コンテンツまたは title 属性からの名前 |
Mozilla.org button | Window-Eyes 5.5 以降、JAWS 7.0 以降 要素上では、その要素のための記述と共に aria-describedby を使用する必要があります。 |
Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 | ||
dialog |
Dojo dialog | Orca 2.20 以降 | ||||
directory |
公開されているが、対応する特別な支援技術は無い | |||||
document |
Window-Eyes 5.5 以降 | |||||
grid |
disabled |
title 属性からの名前 |
Mozilla.org grid (spreadsheet) と menubar, UIUC grid |
|
|
|
gridcell |
|
子コンテンツまたは title 属性からの名前 |
Mozilla.org grid (spreadsheet) と menubar, UIUC grid |
|
|
|
group |
title 属性からの名前 |
UIUC tree, Mozilla.org progress bar | Window-eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | ||
img |
title 属性からの名前 |
Mozilla.org 並べられた image | 未対応 | 未対応 | Orca 2.20 以降 | |
label |
子コンテンツまたは title 属性からの名前 |
Window-Eyes 5.5 以降、JAWS 7.1 以降 | ||||
link |
子コンテンツまたは title 属性からの名前、linked(常に true) |
disabled |
名前の処理が不正確 | 名前の処理が不正確 | Window-Eyes 5.5 以降、JAWS 7.1 以降 | |
list |
|
title 属性からの名前 |
Window-Eyes 5.5 以降、JAWS 7.1 以降 | |||
listbox |
|
title 属性からの名前 |
Mozilla.org listbox | なし | Window-Eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 |
listitem |
|
子コンテンツまたは title 属性からの名前 |
Window-Eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | ||
log (チャットログ、ゲームログ、エラーログなど。デフォルトで実況) |
AJAX チャット | 公開されているが、現在は対応する特別な支援技術は無い | ||||
menu |
disabled |
title 属性からの名前 |
Mozilla.org grid (spreadsheet) と menubar | Window-eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | |
menubar |
disabled |
title 属性からの名前 |
Mozilla.org grid (spreadsheet) と menubar, UIUC menubar | Window-eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | |
menuitem |
|
子コンテンツまたは title 属性からの名前 |
Mozilla.org grid (spreadsheet) と menubar, UIUC menubar | Window-Eyes 5.5, JAWS 7.1 以降 (checked=mixed には未対応) |
Window-Eyes 5.5, JAWS 7.1 以降 (checked=mixed に対応している場合、検証データをテストする必要あり) |
Window-Eyes 5.5, Orca 2.20 以降、JAWS 7.1 以降 (checked=mixed に対応している場合、検証データをテストする必要あり) |
menuitemcheckbox |
|
checkable, 子コンテンツまたは title 属性からの名前 |
なし | 検証データをテストする必要あり | 検証データをテストする必要あり | |
menuitemradio |
|
checkable, 子コンテンツまたは title 属性からの名前 |
検証データをテストする必要あり | 検証データをテストする必要あり | 検証データをテストする必要あり | |
option |
|
子コンテンツまたは title 属性からの名前 |
Mozilla.org listbox | なし | Window-Eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 |
presentation |
これらの項目はアクセシビリティの階層から自動的に削除されます。table 上に置いたときは、table 以下のすべての子孫もまたアクセシビリティの階層から自動的に削除されます。 | MSAA や ATK のようにアクセシビリティ API を使用する、DOM ベースでない支援技術すべて 例えば、Window-Eyes 5.5 以降、JAWS 7.0 以降、ZoomText 9.1 以降、Orca 2.20 以降で動作するが、Fire Vox では動作しない |
||||
progressbar |
|
title 属性からの名前 |
Mozilla.org progress bar | Window-eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | |
radio |
|
子コンテンツまたは title 属性からの名前 |
模擬 radio buttons ATRC radio buttons (ARIA の名前空間のみ), UIUC radio buttons | Window-eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | |
radiogroup |
|
title 属性からの名前 |
UIUC radio buttons | Window-eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | |
region |
公開されているが、対応する特別な支援技術は無い | |||||
row |
|
子コンテンツまたは title 属性からの名前 |
なし | なし | Firefox 3 に向けて作業中 | |
rowheader |
|
子コンテンツまたは title 属性からの名前 |
Mozilla.org grid (spreadsheet) と menubar | Window-Eyes 5.5 以降、JAWS 7.1 以降 | Window-Eyes 5.5 以降、JAWS 7.1 以降、Orca 2.20 以降 | |
secret |
|
title 属性からの名前、protected (常に true) |
Window-Eyes 5.5 以降、JAWS 7.0 以降 | |||
separator |
検証データをテストする必要あり | |||||
slider |
|
title 属性からの名前 |
Mozilla.org 平坦な slider, Mozilla.org グラフィカルな slider, UIUC slider | Window-Eyes 5.5 以降、JAWS 7.1 以降 (JAWS 8.0 では矢印キーによる操作不可) | Window-Eyes 5.5 以降、Orca 2.20 以降、JAWS 7.1 以降 (JAWS 8.0 では矢印キーによる操作不可) | |
spinbutton |
|
title 属性からの名前 |
Dojo spinner | Orca 2.20 以降 | ||
tab |
disabled |
子コンテンツまたは title 属性からの名前 |
Mozilla.org tab panel, UIUC tab panel | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.21.5 以降 | |
tablist |
Mozilla.org tab panel, UIUC tab panel | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.21.5 以降 | |||
tabpanel |
Mozilla.org tab panel, UIUC tab panel | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.21.5 以降 | |||
textbox |
|
title 属性からの名前 |
UIUC textfield | 未対応 | 未対応 | Window-Eyes 5.5 以降、JAWS 7.0 以降 |
toolbar |
disabled |
公開されているが、どの支援技術がこれに対応しているか、または必要としているかが不明確 | ||||
tooltip |
Mozilla.org tooltip | |||||
tree |
|
title 属性からの名前 |
Mozilla.org tree, UIUC tree | Windows-Eyes 5.5 以降、JAWS 7.0 | Windows-Eyes 5.5 以降、JAWS 7.0, Orca 2.20 以降 | |
treegrid |
|
title 属性からの名前 |
なし | なし | Firefox で作業中のため未サポート | |
treeitem |
|
子コンテンツまたは title 属性からの名前 |
Mozilla.org tree, UIUC tree | Windows-Eyes 5.5 以降、JAWS 7.0 以降、checked=mixed には未対応 |
Windows-Eyes 5.5 以降、JAWS 7.0 | Windows-Eyes 5.5 以降、JAWS 7.0, Orca 2.20 以降 |
† 下記の表において、適用性の列が "すべての要素" と書かれているすべての要素が universal property を許容します。
[編集] 代表的な XHTML の role 属性モジュール
XHTML の role 属性モジュール は次の role を定義しています:
banner, contentinfo, definition, main, navigation, note, search, secondary, seealso
XHTML では、これらの代表的な role を "wairole:" プレフィックス無しで使用することができます (例: <div role="main">)。理想的なスクリーンリーダーは、これらの role を用いてナビゲーション機構を提供するか、ユーザがメインコンテンツに入ると自動的にナビゲーションを開始します。スクリーン拡大鏡や携帯電話もまた、メインコンテンツから開始するか、特別なハイライトやナビゲーション機構を提供します。しかしながら、これらの role は MSAA 下の role を通じて公開されており、現在ある支援技術には特別なサポートが知られていません。
[編集] サポートされている property
| Property 名 | 適用性 | 使用例 | Firefox 1.5 対応 | Firefox 2 対応 | Firefox 3 テストビルド対応 |
|---|---|---|---|---|---|
aria-activedescendant="[id]"
| すべての要素 | Mozilla.org Listbox | 無し | 無し | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 |
aria-atomic="true"
| すべての要素 | Fire Vox 2.7 以降 | Fire Vox 2.7 以降 | Fire Vox 2.7 以降 アクセシビリティ API を通じて公開されているが、一般的な目的の支援技術にはまだ使用されていない | |
aria-busy="true" or "false" or "error"
| すべての要素 | 未実装 | 未実装 | ||
aria-channel="main" (default) or "notify"
| すべての要素 | 未実装 | 未実装 | 未実装 | |
aria-checked="true"aria-checked="false" (チェック可能だがチェックされていない)
| roles: checkbox, menuitem, menuitemcheckbox, menuitemradio, listitem, option, radio, treeitem | Mozilla.org checkbox, | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 |
aria-checked="mixed" (チェック可能だが未確定)
| roles: checkbox, menuitem, treeitem | Mozilla.org checkbox | 検証データをテストする必要あり | 検証データをテストする必要あり | 検証データをテストする必要あり |
aria-controls=IDLIST
| すべての要素 | Fire Vox 2.7 以降 アクセシビリティ API を通じて公開されているが、一般的な目的の支援技術にはまだ使用されていない | Fire Vox 2.7 以降 アクセシビリティ API を通じて公開されているが、一般的な目的の支援技術にはまだ使用されていない | Fire Vox 2.7 以降 アクセシビリティ API を通じて公開されているが、一般的な目的の支援技術にはまだ使用されていない | |
aria-datatype="xsd:DATATYPE"
| すべての要素 | 無し | 無し | 公開されているが、対応する支援技術は無い | |
aria-describedby=IDLIST
| すべての要素 | Mozilla.org button with aria-describedby | Window-Eyes 5.5 以降 | Window-Eyes 5.5 以降 | Window-Eyes 5.5 以降、Orca 2.20 以降 |
aria-disabled="true"
| roles: button, checkbox, columnheader, combobox, grid, gridcell, link, listbox, menu, menubar, menuitem, menuitemcheckbox, menuitemradio, option, progressbar, radio, radiogroup, row, rowheader, secret, slider, spinbutton, tab, textbox, toolbar, tree, treegrid, treeitem | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 (span への参照点なし) | |
aria-dropeffect="copy" または "move", "reference", "none"
| すべての要素 | 未実装 | 未実装 | 未実装 | |
aria-expanded="true"
| roles: treeitem, region, (combobox?) | Mozilla.org tree, | Orca 2.20 以降 | ||
aria-flowto=IDLIST
| すべての要素 | 公開されているが、対応する支援技術は無い | 公開されているが、対応する支援技術は無い | 公開されているが、対応する支援技術は無い | |
aria-grab= "true" または "false", "supported"
| すべての要素 | 未実装 | 未実装 | 未実装 | |
aria-haspopup="true"
| roles: button, menuitem, textfield | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 | |
aria-hidden="true"
| すべての要素 | 要素のスタイルに display: none がある場合に動作 | 要素のスタイルに display: none がある場合に動作 | 要素のスタイルに display: none がある場合に動作 | |
aria-invalid="true"
| すべての要素 | ATRC alert, | Window-Eyes 5.5 以降 | Window-Eyes 5.5 以降 | Window-Eyes 5.5 以降 |
aria-labelledby="[IDLIST]"
| すべての要素 | aria-labelledby=IDLIST | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 |
aria-level=POSITIVE_NUMBER
| すべての要素、特に treeitem 上で有用 | 無し | 無し | ツリービューでのみ動作、Window-Eyes 5.5 以降および JAWS 7.0 以降 | |
aria-live=POLITENESS
| すべての要素 | Fire Vox 2.7 以降 | Fire Vox 2.7 以降 | Fire Vox 2.7 以降 アクセシビリティ API を通じて公開されているが、一般的な目的の支援技術にはまだ使用されていない | |
aria-multiselectable="true"
| roles: grid, list, tree | UIUC grid | 未対応 | 未対応 | 検証データをテストする必要あり |
aria-owns
| すべての要素 | 無し | 無し | 無し | |
aria-pressed="true"
| roles: button | UIUC button | 検証データをテストする必要あり | 検証データをテストする必要あり | Orca 2.20 以降 |
aria-posinset=POSITIVE_NUMBER (treeitem 上の場合、aria-setsize および aria-level と共に使用)
| すべての要素、特に option, listitem, treeitem 上で有用 | 模擬 radio buttons (名前空間付き/xhtml/FF2 のみ) | 無し | 無し | Window-Eyes 5.5 以降および JAWS 7.0 以降、Orca 2.20 以降において、option および listitem, treeitem のみ動作 |
aria-readonly="true"
| roles: checkbox, columnheader grid, gridcell, list, rowheader, spinbutton, textarea, textfield | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 | |
aria-relevant=RELEVANCE_LIST
| すべての要素 | Fire Vox 2.7 以降 | Fire Vox 2.7 以降 | Fire Vox 2.7 以降 アクセシビリティ API を通じて公開されているが、一般的な目的の支援技術にはまだ使用されていない | |
role="[rolename]"
| すべての要素 | 上記の role 表をご覧ください | 上記の role 表をご覧ください | 上記の role 表をご覧ください | 上記の role 表をご覧ください |
aria-required="true"
| すべての要素 | Mozilla.org checkbox | Window-Eyes 5.5 以降 | Window-Eyes 5.5 以降 | Window-Eyes 5.5 以降 |
selected="true"selected="false" (選択可能だが、選択されていない)
| roles: columnheader, gridcell, listitem, option, rowheader | UIUC grid | 検証データをテストする必要あり | 検証データをテストする必要あり | 検証データをテストする必要あり |
aria-setsize=POSITIVE_NUMBER (treeitem 上の場合、aria-setsize および aria-level と共に使用)
| すべての要素、特に option, listitem, treeitem 上で有用 | 模擬 radio buttons (名前空間付き/xhtml/FF2 のみ) | 無し | 無し | Window-Eyes 5.5 以降および JAWS 7.0 以降、Orca 2.20 以降において、option および listitem, treeitem のみ動作 |
aria-sort=SORT_TYPE | すべての要素 | 無し | 無し | アクセシビリティ API を通して公開されているが、一般的な目的の支援技術にはまだ使用されていない | |
tabindex
| すべての HTML 要素 | すべての支援技術、同様に IE 5 以降も対応 | すべての支援技術、同様に IE 5 以降も対応 | すべての支援技術、同様に IE 5 以降も対応 | |
valuenow="#"valuemin="#"valuemax="#"
| roles: progressbar, slider, spinbutton | Mozilla.org 平坦な slider Mozilla.org グラフィカルな slider Mozilla.org plain progress bar | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降 | Window-Eyes 5.5 以降、JAWS 7.0 以降、Orca 2.20 以降 |
valuenow の設定なし (値が未確定)
| roles: progressbar | 検証データをテストする必要あり | 検証データをテストする必要あり | 検証データをテストする必要あり |
[編集] Live regions
一部のウェブページには、ユーザのアクションや現実世界のイベントによって更新することができる Live region(動的更新が可能な領域) があります。ユーザのアクションによる変更の例は、この wiki のオプションページです。現実世界のイベントによる変更の例には、チャット領域 や 試合状況のライブ更新, 金融情報のライブ更新 があります。
今のところ、スクリーンリーダの Live region のためのアクセシビリティには問題があります。スクリーンリーダがページ上のすべての変更を逐次読み上げてしまうと、ユーザにとって迷惑になります。もし、スクリーンリーダがそれらを読み上げなければ、ユーザは極めて重要な情報を失うことになります。
解決策は ARIA を通して開発されており、ウェブページの作者がそこにある Live region が何かを指定し、また Live region についての追加の役立つ情報を指定することができます。これは、スクリーンリーダが何をいつ読み上げればよいかを決められるようにします。
これらの ARIA プロパティには、aria-live および aria-atomic, aria-relevant, aria-controls, aria-labelledby, aria-describedby があります。現在のサポートは、標準仕様の執筆活動を前進させ、ウェブ開発者コミュニティに対して WAI-ARIA を採用する利点を実証し、またスクリーンリーダ開発者コミュニティがエンドユーザに WAI-ARIA の 動作を体験できることを示すため、Fire Vox スクリーン読み上げ拡張機能で開発されています。
さらに詳しい情報:
- Live region マークアップの開発状況の完全なリポートは、AJAX:WAI_ARIA_Live_Regions をご覧ください。ここでは、Fire Vox で動作するテストケースへのリンクも提供しています。
- テストケースの簡単なものと詳細なもの は、Fire Vox 拡張の開発者である Charles Chen 氏によって提供されています。これらの例はすべて、Fire Vox で動作します。
- その他のマークアップの記述は、Gez Lemon 氏による Juicy Studio の ARIA live region についての記事にあります。
Firefox 3 の登場までに、Live region がスクリーンリーダのすべての目的に対応することは期待されていません。
[編集] ARIA のための標準開発
W3C の Web Accessibility Initiative の中身は Protocols and Formats Working Group (PFWG) です。このグループは、Dynamic Web Content Accessibility Work roadmap と呼ばれるものに大きく焦点を当てており、すべての重要な格差を埋める長期的な努力と同時に、基本的な role および properties を定義する短期間の努力をしています。
[編集] Firefox の公開バグ
完全な Firefox の ARIA バグ一覧 では、Firefox の ARIA 対応の進捗を追跡することができます。
[編集] 将来の ARIA
追加の ARIA サポートは将来のリリースで計画されています。この作業は W3C PF グループの安定した標準から得ることに依存しています。これらの変更には、作者が既存の role を継承して新しい role を定義したり、動作を記述したり、要素間の関係を新たに指定したり、またブラウザと Web ページの間でのキーボード・アクセラレータの今日のような衝突を避けるセマンティック・アクセスキーのサポートが含まれます。
[編集] ARIA メーリングリスト
WAI-XTech リスト では、ARIA に興味がある人々が技術的な問題を議論しています。
WAI-XTech リストを購読するには、Participation in the Protocols and Formats Working Group の説明をご覧ください。
カテゴリ: Accessibility | AJAX | DHTML | DOM