Internet Explorer 8 のアクセシビリティに関する新機能

メモ : このドキュメントは暫定版であり、変更されることがあります。

Internet Explorer 8 には、補助技術クライアント アプリケーションをサポートするいくつかの新機能があります。

このトピックの内容は次のとおりです。

• ARIA マークアップのサポート
• アクセシビリティに関する DHTML の拡張機能
• 関連トピック

ARIA マークアップのサポート

スクリプト、Cascading Style Sheets (CSS)、および HTML などの技術を駆使した本格的なアプリケーションに作り替えられる Web サイトが増えつつあります。これらのサイトは多くの場合、カスタムなユーザー インターフェイス (UI) 要素によって作成されたダイナミックな対話型のユーザー エクスペリエンスを提供しています。

Web ページのカスタム UI が開発された結果、補助技術プログラムや自動化ツールが、ページの内容を完全に解析できなかったり、各種コントロールの操作に代わる方法をユーザーに提供できないケースが見受けられるようになりました。

Internet Explorer では、MSAA (Microsoft Active Accessibility) を実装することで、補助技術プログラムにコンテンツのアクセスを提供しています。そのための基本的な方法は、HTML に基づいてアクセシブルなオブジェクトを作成し、それらにプロパティを割り当てることです。たとえば Web ページにボタンが含まれる場合、補助技術プログラムは、ブラウザーによって作成されたアクセシブル オブジェクトへの IAccessibleEx  インターフェイスを取得することにより、ボタンに関する情報を入手し、そのボタンをクリックする動作をシミュレートできます。

カスタム UI 要素がスクリプトによって作成されている場合には、補助技術クライアントに要素を公開するための標準的な方法が使えなくなります。ブラウザーは UI を表示することはできますが、UI 要素のロール、プロパティ、または状態に関する情報を取得できません。

たとえば、リストの一種であっても、ツリー表示のような機能のあるカスタム要素を作成したと仮定します。この要素は、次のコードによって作成されています。

<ul id="Tree">
    <li id="A1" onclick="javascript:Toggle('A1','sub1')" title="Colors" >
    <span>+ </span>Colors</li>
    <ul style="display:none" id="sub1">
         <li title="Red">Red</li>
         <li title="Blue">Blue</li>
         <li title="Green">Green</li>
    </ul>
    </li>
</ul>

ブラウザーがこの HTML を検出すると、補助技術クライアントにこの要素をどのように認識させるべきか、または、この要素のプロパティは何かを判断できないため、結果的にブラウザーはこの要素を有益な方法で公開することができなくなります。

この問題は Internet Explorer と MSAA に限らず、すべてのアクセシブル ブラウザーに当てはまります。この問題に対処するため、W3C (World Wide Web Consortium) の Web Accessibility Initiative  グループが、ARIA (Accessible Rich Internet Applications) の標準を作成しました。ARIA によって、Web 開発者はカスタム オブジェクトにプロパティを追加し、補助技術クライアントで使用できるようになりました。

次の例は、role 属性を使用してカスタムなツリー表示をアクセシブルにする方法を示しています (構文は ARIA ドラフト仕様に基づいています)。

<ul id="Tree" role="tree">
<li role="treeitem" id="A1" aria-expanded="false"
    onclick="javascript:Toggle('A1','sub1')" title="Colors" >
   <span>+ </span>Colors</li>
   <ul style="display:none" id="sub1" role="group">
       <li role="treeitem" title="Red">Red</li>
       <li role="treeitem" title="Blue">Blue</li>
       <li role="treeitem" title="Green">Green</li>
    </ul>
</li>
</ul>

role 属性は、コントロールの基本的な動作を識別します。Internet Explorerは、この属性を MSAA が認識できる ROLE_SYSTEM_CHECKBOX 値に変換します。補助技術クライアントは IAccessible::get_accRole を呼び出して、この値を取得します。また、aaa:checked 属性は STATE_SYSTEM_CHECKED に変換され、クライアントは IAccessible::get_accState を呼び出して、この値を取得します。

ARIA は、要素の主なロールを定義する wairole: ネームスペース内の値を指定します。さらに、状態およびプロパティ値に対応する aaa: ネームスペースを省略し、ブラウザーによって補助技術が認識できる用語に変換可能な値を定義します。たとえば、前出の例で "checked" という状態値は、該当するロール (on/off 値を使用できる任意の要素またはウィジェット) で有効なものとして定義されているので、Internet Explorer 8 は対応する MSAA 状態値に変換できます。

アクセシビリティに関する DHTML の拡張機能

Internet Explorer 8 では、MSAA (Microsoft Active Accessibility) によって補助技術アプリケーションのサポートを拡張しています。ページの内容が変化したことを補助技術クライアントに通知するイベントの種類の増加、コンテンツ要素から MSAA ロールへの対応付けの改良に加え、従来 MSAA が認識できなかった HTML コンテンツのサポートが追加されています。

次に示す WinEvents は、ページの内容が変化した場合に生成されます。

• EVENT_OBJECT_REORDER
• EVENT_OBJECT_STATECHANGE
• EVENT_OBJECT_LOCATIONCHANGE
• EVENT_OBJECT_VALUECHANGE

EVENT_OBJECT_REORDER

EVENT_OBJECT_REORDER イベントは、次のいずれかの Dynamic HTML (DHTML) プロパティが変更された場合に発生します。

• innerHTML
• outerHTML
• innerText
• outerText

このイベントは、次のいずれかの DHTML メソッドによってページの内容が変更された場合にも発生します。

• add (areas, options)
• appendChild
• applyElement
• clear
• createTFoot
• createTHead
• createCaption
• deleteTFoot
• deleteTHead
• deleteCaption
• deleteCell
• deleteRow
• insertCell
• insertRow
• moveRow
• execCommand (document, selection, range)
• insertAdjacentElement
• insertAdjacentHTML
• insertAdjacentText
• insertBefore
• pasteHTML
• remove (areas, options)
• removeChild
• removeNode
• replaceAdjacentText
• replaceChild
• replaceNode
• swapNode

EVENT_OBJECT_STATECHANGE

このイベントは、ユーザーが入力要素およびボタンを操作した場合に生成されます。次の例外があります。

• 入力タイプが file で、なおかつユーザーがテキストボックスにフォーカスを設定した場合には、テキストボックスではなく、ボタンでイベントが生成されます。
• 入力タイプが radio で、なおかつユーザーが左または右矢印キーを押した場合には、グループ内のすべてのオプション ボタンではなく、現在選択されているオプション ボタンでイベントが生成されます。

span が縮小された (非表示になった) 場合にも、このイベントが送信されます。

EVENT_OBJECT_LOCATIONCHANGE

このイベントは、ユーザーが file、password、text タイプ、または TEXTAREA 内の入力要素のテキストを選択した場合に発生します。

EVENT_OBJECT_VALUECHANGE

このイベントは、ユーザーが file、password、text タイプ、または TEXTAREA 内の入力要素の文字を入力または削除した場合に発生します。

MSAA ロール

HTML 要素と MSAA ロールの対応関係を、次の表に示します。

HTML	MSAA	注意
th	ROLE_SYSTEM_ROWHEADER and ROLE_SYSTEM_COLUMNHEADER
tr	ROLE_SYSTEM_ROW
fieldSet	ROLE_GROUPING	fieldSet の場合、legend 要素を使用して名前が公開されます。
hr	ROLE_SEPARATOR
ol, ul	ROLE_LIST	STATE_READONLY はオンです。
li, option, optGroup	ROLE_LISTITEM	現在のリスト項目が選択されている場合、STATE_SELECTED が設定されます。
label	ROLE_STATICTEXT	IAccessible::accNavigate で NAVRELATION_LABEL_FOR および NAVRELATION_DESCRIPTION_FOR をサポートします。
col	ROLE_SYSTEM_COLUMN
caption	ROLE_STATICTEXT	caption 要素は、table の MSAA 名を提供する必要があります。
dl	ROLE_LIST
dt, dd	ROLE_LIST_ITEM

関連トピック

• DHTML によるアクセシブルな Web ページの作成
• Active Accessibility SDK