ADF Facesユーザー・インタフェース・コンポーネントは、視覚や身体に障害のあるユーザーがアクセスできます。ADF Facesでは、ほとんどのコンポーネントについてテキストの説明が用意されていますが、一部のコンポーネントでは、アクセスするために追加情報が必要です。
このトピックでは、非ビジュアル・メディアへのレンダリングを行うユーザー・エージェントがページを読み取り、障害のあるユーザーに役立つ情報を提供できるように、コンポーネントへのアクセスを可能にするための詳細を提供します。
ADF Facesでは、次の3レベルのアクセシビリティをサポートします。
default
: デフォルトでは、ADF Facesは、障害を持つユーザーがアクセス可能なHTMLコードを生成します。
screenReader
: ADF Facesは、スクリーン・リーダー使用のために最適化されたHTMLコードを生成します。このモードでは、障害を持つユーザーには有用ですが、通常のユーザーに対する出力の質は低下する場合があります。たとえば、スクリーン・リーダー・モードではアクセス・キーは使用できません。
inaccessible
: ADF Facesは、視力のあるユーザーに関係しないコードをすべて削除します。この最適化により、生成されるHTMLのサイズが小さくなります。ただし、障害を持つユーザーがアプリケーションにアクセスできなくなります。
アクセシビリティ・モードは、ADF構成ファイル(adf-faces-config.xml
)で<accessibility-mode>
要素に値を定義することで設定します。有効な値は、default
、screenReader
およびinaccessible
です。
次に例を示します。
<accessibility-mode>inaccessible</accessibility-mode>
ADF Faces構成に使用する他の要素の詳細は、「ADF Faces構成の使用」を参照してください。
ADF Facesは、ビジュアル・コンテンツのテキスト説明と状態(ボタンの有効/無効など)を提供することで、テキストをオーディオに変換するスクリーン・リーダーをサポートします。
ADF Facesで自動的に生成されるイメージには、スクリーン・リーダーまたは非ビジュアル・ブラウザで読み上げることができる説明が埋め込まれています。この例には、ADF Faces入力コンポーネントで生成されたエラーや警告のアイコンなどがあります。
ユーザーが提供するアイコンから生成されたイメージや、menuTabs
やmenuButtons
などの特定のコンポーネントで生成されたイメージの場合、ADF Facesでは、ユーザーが提供するtext
またはicon
属性の値を使用して、コンポーネントの名前と状態を説明するテキストが生成されます。たとえば、次のコード例では、2番目のタブについて生成された「Page 2: Currently selected tab」というテキストが読み上げられます。
<af:menuTabs>
<af:commandMenuItem text="Page 1" action="#{action.app1}"/>
<af:commandMenuItem text="Page 2" selected="true"/>
<af:commandMenuItem text="Page 3" action="#{action.app2}"/>
</af:menuTabs>
shortDesc
属性を使用して、オブジェクトに関する短い説明を提供します。このshortDesc
属性は、HTMLのalt
属性に変換されます。
背景のイメージ、黒丸、オブジェクト周囲のカーブした外枠は、視力のあるユーザーに視覚的に訴えるにすぎず、有効な情報を伝えるわけではありません。このようなイメージを使用する場合もイメージのshortDesc
属性を設定し、属性値として空の文字列を使用する必要があります。
selectInputText
懐中電灯アイコンには、searchDesc
属性を設定し、クライアント・エージェントによる読上げも可能なツールチップ・テキストを提供します。
フレームを使用する場合は、frameBorderLayout
のalternateContent
ファセットを使用して、フレームのない代替ページへのリンクを指定する必要があります。次に例を示します。
<afh:frameBorderLayout shortDesc="Shopping Cart Application">
...
<f:facet name="alternateContent">
<af:goLink text="Click here for a no-frames version" destination="noframes.html" />
</f:facet>
...
</afh:frameBorderLayout>
alternateContent
セクションはHTMLのNOFRAMESタグに相当し、そのコンテンツはフレーム対応ではないブラウザ・エージェントで表示されます。
各フレームには、フレーム・コンポーネントのshortDesc
またはlongDescURL
属性を使用して、コンテンツの一般的な説明を提供する必要もあります。longDescURL
属性は、フレームの長い説明へのリンクを指定します。この長い説明は、shortDesc
属性を使用して提供される短い説明を補足し、非ビジュアル・ユーザー・エージェントにも役立ちます。
<afh:frameBorderLayout> <f:facet name="left"> <afh:frame source="frame_leftTest.jspx" name="left" width="30%" shortDesc="Some brief text"/> </f:facet> <f:facet name="center"> <afh:frame source="frame_centerTest.jspx" name="contents" longDescURL="Link to some longer text"/> </f:facet> ... </afh:frameBorderLayout>
表を使用する場合は、summary
属性を使用して、表の目的に関する説明、表の構造と内容を、非ビジュアル・メディアにレンダリングするユーザー・エージェントに提供します。次に例を示します。
<af:table summary="This table describes the contents of your shopping bag: item name, unit price, quantity and subtotal"
value="#{myManagedBean.allItems}" var="shop">
<af:column>
<f:facet name="header">
<af:outputText value="Name"/>
</f:facet>
<af:outputText value="#{shop.item}"/>
</af:column>
<af:column>
<f:facet name="header">
<af:outputText value="Price"/>
</f:facet>
<af:outputText value="#{shop.price}"/>
</af:column>
</af:table>
注意: ADF Facesでは、summary
属性のテキストを使用して、エラー・メッセージも作成されます。詳細は、「ADF Facesでの変換および検証エラーについて」を参照してください、
outputText
コンポーネントには、スクリーン・リーダーや他のアクセシビリティ・エージェントの補足説明を添付できるdescription
属性があります。テキストはこれ以外の手段では表示されません。
ADF Faces入力コンポーネントでのラベルおよびメッセージ表示のサポートについて
Copyright © 1997, 2007, Oracle. All rights reserved.