Oracle® Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド 11gリリース2 (11.1.2.2.0) B66719-02 |
|
![]() 前 |
![]() 次 |
この章では、キーボードのショートカット、およびコンポーネント名や状態に関するテキストの説明を含むアクセシビリティ・サポートを、ADF Facesコンポーネントに追加する方法を説明します。この章では、部分ページ・レンダリング、スクリプト、スタイル、特定ページおよびナビゲーション構造を使用するADFページのアクセシビリティ・ガイドラインについても説明されています。
この章では、次の項目について説明します。
アクセシビリティとは、弱視や全盲、難聴またはその他の身体的な制限などの障害を持つユーザーが、アプリケーションを使用できるようにすることです。つまり、マウスなし(キーボードのみ)で使用でき、全盲または弱視のユーザーはスクリーン・リーダーを使用でき、音、色またはアニメーションやタイミングに依存せずに使用できるアプリケーションを作成することです。
ADF Facesのユーザー・インタフェース・コンポーネントには、視覚的および身体的な障害のあるユーザーのために、組込みのアクセシビリティ・サポートが用意されています。スクリーン・リーダーのような非視覚的なメディアへのレンダリングを行うWebブラウザなどのユーザー・エージェントにより、コンポーネントのテキスト説明が読み上げられ、障害を持つユーザーに有益な情報が提供されます。
コンポーネントのADF Facesのアクセシビリティ・ガイドライン、ページやナビゲーション構造は便利ですが、アクセシビリティ標準に関する理解を深めることや、支援技術を使用したアクセシビリティのテスト実行のかわりにはなりません。
身体的に障害のあるユーザーのために、ADF Facesは支援技術のスクリーン・リーダーのJAWSとの連係がテストされてきました。JAWSスクリーン・リーダー・ソフトウェアの詳細は、http://www.freedomscientific.com
で入手できます。
アクセス・キー・サポートは、キーボードのみを使用してコンポーネントやリンクにアクセスする代替の方法を提供します。ADF Facesのアクセシビリティ監査ルールにより、アクセス可能なHTMLマークアップを使用して、アクセス可能なイメージ、表、フレーム、フォーム、エラー・メッセージおよびポップアップ・ウィンドウの作成が指示されます。クライアント側のスクリプト、特に非同期のJavaScriptおよびXML(AJAX)を使用した場合に生じていたフレームワークとプラットフォームのさらなる問題は、オラクル社のアクセシビリティ・ストラテジで対応しています。
Oracleソフトウェアでは、Web Content Accessibility Guidelines (WCAG) 1.0 AA標準が実装されます。これらの標準の解釈は、http://www.oracle.com/accessibility/standards.html
で入手できます。
ADF Facesには、スクリーン・リーダー、高コントラスト・モードおよび大きいフォント・モードの3タイプのアプリケーション・アクセシビリティ・サポートが用意されています。図30-1に、ドロップダウン・メニューのアクセシビリティ・オプションの例を示します。ユーザーは、3つのオプションすべての組合せを必要に応じて選択できます。
図30-2に、スクリーン・リーダー・モードのアクセシビリティ・オプションの例を示します。
アプリケーションをアクセス可能にする前に、その他のADF Faces機能を理解しておくことも役に立ちます。アクセシビリティと連係するその他の機能へのリンクは、次のとおりです。
国際化およびローカライズ: アプリケーションに適用するために作成するADFスキンは、ADF Facesページを国際化およびローカライズするためのプロセスの一部としてカスタマイズできます。このプロセスの詳細は、第29章「ページの国際化およびローカライズ」を参照してください。
キーボードのショートカット: ポインティング・デバイスのかわりにキーボード・ショートカットを使用してページでの移動を行えます。キーボード・ショートカットをアクセシビリティとともに使用する方法の詳細は、付録C「キーボード・ショートカット」を参照してください。
ADF Facesには、2つのレベルのアプリケーション・アクセシビリティ・サポートが、<accessibility-mode>
要素を使用してtrinidad-config.xml
ファイルに構成されています。<accessibility-mode>
に使用可能な値は次のとおりです。
default
: デフォルトでは、ADF Facesにより、豊富なユーザー・インタフェース相互作用を持ち、キーボードからもアクセスできるコンポーネントが生成されます。デフォルト・モードでは、スクリーン・リーダーはすべてのADF Facesコンポーネントにアクセスできるとはかぎりません。視覚障害のあるユーザーがスクリーン・リーダーを使用している場合、screenReader
モードの使用をお薦めします。
screenReader
: ADF Facesにより、スクリーン・リーダーと使用するために最適化されるコンポーネントが生成されます。screenReader
モードにより、視覚障害を持つユーザー向けの表示が容易になりますが、目の見える(視覚障害のない)ユーザーにとっては表示の品質が低下します。
ユーザーが目的のタイプのアクセシビリティ・サポートを必要に応じて選択できるように、アプリケーションで前述のアクセシビリティ・サポート間の切り替え機能を提供することをお薦めします。
@accessibility-profile
要素を使用すれば、スタイルシートでより細かいアクセシビリティ・プリファレンスを定義でき、またtrinidad-config.xml
ファイルでアクセシビリティ・プロファイル・オプションを指定することもできます。オプションは、high-contrast
、large-fonts
またはその両方です。詳細は、第28章「スタイルおよびスキンを使用した外観のカスタマイズ」を参照してください。
<accessibility-profile>
に使用可能な値は次のとおりです。
high-contrast
: ADF Facesでは高コントラストに適した視覚的コンテンツを生成できます。高コントラスト・モードは、高コントラスト機能を有効にしているオペレーティング・システムまたはブラウザとの互換性をADF Facesアプリケーションに持たせることを目的としています。たとえば、ADF Facesでは、高コントラスト・モードでの背景イメージおよび背景色の使用を変更し、視覚情報の損失を防ぎます。ADF Faces高コントラスト・モードは、ブラウザまたはオペレーティング・システムの高コントラスト・モードと組み合せて使用するとより効果的です。一部のユーザーには、高コントラスト・モードを大きいフォント・モードと一緒に使用しても効果的です。
large-fonts
: ADF Facesではブラウザ・ズームに適したコンテンツを生成できます。デフォルト・モードでは、大部分のテキストおよび多くのコンテナでは固定フォント・サイズで、一貫した定義済の外観を提供します。大きいフォント・モードでは、テキストおよびコンテナはスケーラブル・フォント・サイズです。これによって、ADF Facesはより大きいフォント・サイズが設定されているブラウザと互換性を持ち、ブラウザのズーム機能に対応できます。大きいフォント・モードまたはブラウザのズーム機能を使用していない場合は、大きいフォント・モードを無効にする必要があります。一部のユーザーには、高コントラスト・モードを大きいフォント・モードと一緒に使用しても効果的です。
注意:
|
アプリケーションを開発する際、アプリケーションのサインイン後に、ユーザーにアクセシビリティの選択オプションを提供することをお薦めします。サインイン・アクセシビリティの流れは、次に説明するように、初めてのユーザーの場合は3つのページ、2回目以降のユーザーの場合は2つのページで構成されます。
サインイン・ページ
アクセシビリティ・モード選択ページ(初めてのユーザーには必須)
アプリケーションのホームページ
アクセシビリティのオプションは、初めてのユーザーと、後続の認証で省略しないことを選択したユーザーに対して表示されます。たとえば、次のオプションのあるページまたはダイアログを提供できます。
ヒント・テキスト: アクセシビリティのオプションについての簡単な情報を提供します。
チェック・ボックス
スクリーン・リーダー: スクリーン・リーダーと使用するために最適化されるADF Facesコンポーネントを生成します。
高コントラスト: 高コントラストに適した視覚的コンテンツを生成します。
大きいフォント: ブラウザのズームに適したコンテンツを生成します。
これらのオプションを再び表示しない: サインイン後にアクセシビリティのオプションを表示しません。
「続行」ボタン: アプリケーションのホームページに移動します。
図30-3に、アクセシビリティのオプションが表示されたページを示します。
ユーザーがこれらのオプションを再び表示しない
を選択して、サインイン時にアクセシビリティのオプションを表示しないことを選択した場合、ユーザーをアクセシビリティのオプションに移動させるためのページまたはダイアログを提供する必要もあります。たとえば、アプリケーションのユーザー設定ページなどです。図30-4に、アクセシビリティのオプションが表示されたプリファレンスページを示します。
アプリケーションには、アクセシビリティ・モード選択ページと製品固有のホームページとの間で設定された追加の認証セキュリティがある場合があります。
JDeveloperで、ADF FacesコンポーネントをJSFページへ初めて追加すると、trinidad-config.xml
の基礎ファイルが/WEB-INF
ディレクトリに自動的に作成されます。ファイルは、JSF式言語(EL)または静的値を使用して要素プロパティを定義できる単純なXML構造です。ファイル内の要素の順序は関係ありません。XMLファイルを直接編集するか、構造ウィンドウを使用することで、アクセシビリティ・サポートを構成できます。
始める前に:
ADF Facesのアクセシビリティ・サポートについて理解しておくと役立ちます。詳細は、30.2項「ADF Facesでのアクセシビリティ・サポートの構成」を参照してください。その他のADF Faces機能を使用して追加できる機能について理解しておくことも役に立ちます。詳細は、30.1.2項「ADFページでのアクセシビリティ・サポートの追加情報」を参照してください。
trinidad-config.xmlでアクセシビリティ・サポートを構成する手順:
アプリケーション・ナビゲータで、trinidad-skins.xmlファイルをダブルクリックします。
XMLエディタで、要素名<accessibility-mode>
およびアクセシビリティ・サポートの値(default
、screenReader
またはinaccessible
)を入力します。次に例を示します。
<accessibility-mode>screenReader</accessibility-mode>
このコードでは、アプリケーションのアクセシビリティ・サポートがスクリーン・リーダー・モードに設定されています。
要素名<accessibility-profile>
およびアクセシビリティ・プロファイル値(high-contrast
、large-fonts
)を入力します。
次に例を示します。
<!-- Enable both high-contrast and large-fonts content --> <accessibility-profile>high-contrast large-fonts</accessibility-profile>
このコードでは、アプリケーションのプロファイル・サポートが、high-contrast
およびlarge-fonts
の両方を使用するように設定されています。図30-5は、JDeveloperでのtrinidad-config.xml
ファイルを示しています。
または、構造ウィンドウを使用して値を入力できます。
アプリケーション・ナビゲータで、trinidad-skins.xmlファイルを選択します。
構造ウィンドウで、XMLファイルのルート要素を右クリックして「内部に挿入」メニュー項目を選択し、<accessibility-mode>要素をクリックします。
構造ウィンドウで新しく挿入された要素をダブルクリックし、プロパティ・インスペクタを開きます。値を入力するか、ドロップダウン・リストから1つ選択します。
trinidad-config.xml
ファイルの構成後、プログラムから、あるいはJSF EL式を使用してプロパティ値を取得できます。
たとえば、次のコードでは、アクセシビリティ・モードが明示的に設定されていない場合は、何も返されません。
String mode=ADFFacesContext.getCurrentInstance().getAccessibilityMode;
このEL式の例では、アクセシビリティ・モードが明示的に設定されていない場合は、NULL値が返されます。
<af:outputText value="*#{requestContext.accessibilityMode}"/>
アクセシビリティ選択オプションは、アプリケーションのサインイン時またはアプリケーションのユーザー・プリファレンス・ページで設定できます。詳細は、30.2.1項「サインイン時のアクセシビリティ・サポート・ガイドライン」を参照してください。
コンポーネント固有のアクセシビリティのガイドラインは、30.3.1項「ADF Facesコンポーネントのアクセシビリティ・ガイドライン」に説明されています。ガイドラインには、関連のプロパティの説明が例やヒントとともに含まれています。ADF Facesのアクセシビリティ・ルールに準拠していることを監査する方法の詳細は、30.5項「アクセシビリティ監査ルールの実行」を参照してください。
af:inputText
、af:commandButton
およびaf:goLink
など、ADF Facesの入力、コマンドおよび実行コンポーネントに対するアクセス・キー・サポートには、ラベルの定義およびキーボード・ショートカットの指定が含まれます。[Tab]キーを使用してWebアプリケーションのあるコントロールから次のコントロールへ移動することが可能ですが、キーボード・ショートカットはより便利で効率的です。
コンポーネントのアクセス・キーを指定するには、コンポーネントのaccessKey
属性を、コンポーネントに簡単にアクセスするために使用するキーボード文字(またはニーモニック)に設定します。属性は、プロパティ・インスペクタ、または&
エンコーディングを使用してページ・ソースで設定できます。
同じアクセス・キーを複数のコンポーネントにバインドできます。同じアクセス・キーが同一ページ内の複数の場所に表示される場合、レンダリング・エージェントは同じキーでアクセスできるコンポーネントを巡回します。つまり、アクセス・キーが押されるたびに、フォーカスがコンポーネント間を移動します。最後のコンポーネントに到達すると、フォーカスは最初のコンポーネントに戻ります。
af:goButton
およびaf:goLink
コンポーネントでアクセス・キーを使用すると、一部のブラウザではアクセス・キーがすぐにアクティブ化されます。ブラウザによっては、ページの2つ以上の実行コンポーネントに同じアクセス・キーが割り当てられている場合、同じアクセス・キーでアクセスできるコンポーネントを巡回せずに、最初のコンポーネントがアクティブ化されます。
アクセス可能なページおよびナビゲーション構造を開発するには、30.4項「アクセス可能なページの作成」で説明されている追加のアクセシビリティ・ガイドラインに従います。
アクセス可能なADF Facesコンポーネントを開発するには、表30-1に説明されているガイドラインに従います。リストされていないコンポーネントには、アクセシビリティ・ガイドラインはありません。
注意: アクセシビリティ・ガイドラインで 特に記載がないかぎり、次のようにして、ADF Facesの入力および選択のコントロールにもラベルを設定できます。
|
表30-1 ADF Facesコンポーネントのアクセシビリティ・ガイドライン
コンポーネント | ガイドライン |
---|---|
|
アイコンをサポートするすべてのツールバー・ボタンおよびリンクには、 |
|
イメージを修飾目的のみで使用し、伝える情報がない場合は、 |
|
すべての |
|
すべての |
|
表で、 子入力コンポーネントごとに、 列のヘルプ情報を提供する場合は、 列にフィルタを設定するためにフィルタ・ファセットを使用する場合、そのフィルタ・コンポーネントにラベルが割り当てられていることを確認します。 |
|
通常、 |
|
通常、 |
|
通常、 |
|
ヘルプ情報を提供する場合は、 |
|
通常、 |
|
通常、 |
|
|
|
複雑な説明が必要なイメージには、 |
|
|
|
ヘルプ情報を提供する場合は、 |
|
|
|
|
|
ヘルプ情報を提供する場合は、 |
|
ヘルプ情報を提供する場合は、 |
|
30.4.4項「ページ構造およびナビゲーションの使用方法」を参照してください。 |
|
ヘルプ情報を提供する場合は、 |
|
コンテンツを更新するためにポーリングを使用する場合は、エンド・ユーザーが間隔を制御できるようにするか、ポーリングではなく更新を明示的に開始できるようにします。 |
|
次のプロパティを指定します。
ヘルプ情報を提供する場合は、 |
|
ヘルプ情報を提供する場合は、 |
|
ヘルプ情報を提供する場合は、 |
|
通常、 |
|
ヘルプ情報を提供する場合は、 |
|
ヘルプ情報を提供する場合は、 |
|
|
|
ヘルプ情報を提供する場合は、 |
|
ヘルプ情報を提供する場合は、 |
|
|
|
|
|
すべての表の列に列ヘッダーを作成する必要があります。 スクリーン・リーダー・モードでは、 |
WebアプリケーションでADF Faces表コンポーネントを使用している場合、1つの列をスクリーン・リーダー・モード用の行ヘッダーとして指定する必要があります。その行ヘッダーは、スクリーン・リーダー・ソフトウェアによって、エンド・ユーザーが選択した行を告げるために使用されます。通常は、複数の選択ができる行ヘッダーとして1つの列が使用されますが、行ヘッダーとして複数の列をマークすることもできます。複数の列を行ヘッダーとしてマークすると、それらは表の初期列として表示され、固定されます。
場合によっては、表示目的で、行ヘッダーを表示しないこともあります。そのような場合には、表の1つの列をrowHeader
属性がunstyled
に設定されているように定義する必要があります。スクリーン・リーダー・モードでは、unstyled
行ヘッダーを持つ表またはツリー表コンポーネントは、displayIndex
が0
に設定された開始位置に移動し、固定されます。デフォルト・モードでは、unstyled
行ヘッダー列を持つ表またはツリー表は、開始位置に移動せず、固定されずに、行ヘッダーのCSSスタイルなしでレンダリングされます。
アクセス可能なデータ視覚化コンポーネントを開発するには、表30-2に説明されているアクセシビリティ・ガイドラインに従います。リストされていないコンポーネントには、アクセシビリティ・ガイドラインはありません。
表30-2 データ視覚化コンポーネントのアクセシビリティ・ガイドライン
コンポーネント | ガイドライン |
---|---|
|
|
|
|
|
スクリーン・リーダー・モードの場合、ピボット・テーブルのインスタンスがグラフ・コンポーネントのかわりになるため、エンド・ユーザーは標準カーソル・キーを使用して、データ内を移動できます。 スクリーン・モードでは、グラフ・コンポーネントの次の視覚化機能はサポートされません。
スクリーン・モードでは、グラフ・コンポーネントの次の対話機能はサポートされません。
|
|
スクリーン・リーダー・モードの場合、ツリー表コンポーネントのインスタンスが階層ビューア・コンポーネントのかわりになるため、エンド・ユーザーは標準カーソル・キーを使用して、データ内を移動できます。 |
|
スクリーン・リーダー・モードの場合、表コンポーネントのインスタンスがマップ・コンポーネントのかわりになるため、エンド・ユーザーは標準カーソル・キーを使用して、データ内を移動できます。 |
|
スクリーン・リーダー・モードの場合、表コンポーネントのインスタンスが各 テーマ・マップ・インスタンスに複数の |
|
|
|
|
アクセス・キーを定義するコンポーネントのプロパティ・インスペクタで、accessKey
属性フィールドにニーモニック文字を入力します。テキスト、ラベル、値およびニーモニック文字を同時に設定する場合は、関連する属性フィールドのニーモニック文字の前にアンパサンド(&
)文字を使用します。
始める前に:
コンポーネント・レベルのアクセシビリティ・ガイドラインについて理解しておくと役立ちます。詳細は、30.3項「コンポーネント・レベルのアクセシビリティ・プロパティの指定」を参照してください。その他のADF Faces機能を使用して追加できる機能について理解しておくことも役に立ちます。詳細は、30.1.2項「ADFページでのアクセシビリティ・サポートの追加情報」を参照してください。
アクセス・キーの定義
ADF Facesの入力、コマンドおよび実行コンポーネントにキーボード文字を指定するには、次の4つの属性のいずれか1つを使用します。
accessKey
: コンポーネントへの簡単なアクセスに使用するニーモニック文字の設定に使用します。コマンド・コンポーネントと移動コンポーネントの場合、属性によって指定される文字は、インスタンス・コンポーネントのtext属性の中に存在する必要があり、ない場合は、ADF Facesではコンポーネントにアクセス・キーがないことを視覚的に示す表示は行われません。
例30-1に、af:goLink
コンポーネントのアクセス・キーを文字h
に設定するコードを示します。ユーザーが[Alt]と[H]キーを押すと、コンポーネントのテキスト値がフォーカスされます。
textAndAccessKey
: アンパサンド(&
)文字を使用して、コンポーネントのテキストとニーモニック文字を同時に設定する場合に使用します。JSPXファイルでは、従来のアンパサンド表記は&
です。JSPファイルでは、アンパサンド表記は単純に&
です。プロパティ・インスペクタでは&
のみが必要です。
例30-2に、ボタン・テキストをHome
に指定し、アンパサンド文字の直後の文字であるH
を、af:commandButton
コンポーネントのアクセス・キーに設定するコードを示します。
labelAndAccessKey
: 従来のアンパサンド表記を使用して、入力コンポーネントのlabel
属性およびアクセス・キーを同時に設定する場合に使用します。
例30-3に、ラベルをDate
に指定し、アンパサンド文字の直後の文字であるa
を、af:selectInputDate
コンポーネントのアクセス・キーに設定するコードを示します。
valueAndAccessKey
: 従来のアンパサンド表記を使用して、value
属性およびアクセス・キーを同時に設定する場合に使用します。
例30-4に、ラベルをSelect Date
に指定し、アンパサンド文字の直後の文字であるe
を、af:outputLabel
コンポーネントのアクセス・キーに設定するコードを示します。
アクセス・キー修飾子は、ブラウザおよびプラットフォームによって異なります。すでにブラウザのメニュー・ショートカットとして定義されているアクセス・キーを割り当てると、ADF Facesコンポーネントのアクセス・キーが優先されます。詳細は、特定ブラウザのドキュメントを参照してください。
一部のブラウザでは、空白をアクセス・キーとして使用する場合は、コンポーネントのラベルまたはテキスト・ラベルで空白をビジュアルに表現する方法がないため、[Alt]+[Space]または[Alt]+スペースバーがアクセス・キーであるという情報をユーザーに提供する必要があります。そのようなブラウザの場合は、shortDesc
属性を使用してコンポーネントのツールチップにテキストを指定できます。
異なる言語で表示する必要のあるラベルおよびアクセス・キーは、必要に応じて様々な言語バージョンの表示が可能なリソース・バンドルに格納できます。JSF 1.2で使用可能なJSF構成ファイルに<resource-bundle>
要素を使用すると、各ページにf:loadBundle
タグを使用せずに、アプリケーションのすべてのページに対してリソース・バンドルを使用可能にできます。
始める前に:
コンポーネント・レベルのアクセシビリティ・ガイドラインについて理解しておくと役立ちます。詳細は、30.3項「コンポーネント・レベルのアクセシビリティ・プロパティの指定」を参照してください。その他のADF Faces機能を使用して追加できる機能について理解しておくことも役に立ちます。詳細は、30.1.2項「ADFページでのアクセシビリティ・サポートの追加情報」を参照してください。
ローカライズされたラベルおよびアクセス・キーを定義する手順:
リソース・バンドルを単純な.properties
ファイルとして作成し、ラベルおよびアクセス・キーの各言語バージョンを保持します。詳細は、29.3.1項「ベース・リソース・バンドルの定義方法」を参照してください。
faces-config.xml
ファイルに<locale-config>
要素を追加し、アプリケーションのデフォルトおよびサポートされるロケールを定義します。詳細は、29.3.3項「アプリケーションへのロケールおよびリソース・バンドルの登録方法」を参照してください。
各リソース・バンドルの静的テキストの文字列ごとに、キーと値を作成します。キーは、文字列の一意の識別子です。値は、バンドルの言語でのテキスト文字列です。各値で、アクセス・キーとして定義する文字の前にアンパサンド(&
またはamp
)を配置します。
たとえば、次のコードでは、UIStrings.properties
ベース・リソース・バンドルの「Edit」ボタン・フィールドのラベルおよびアクセス・キーが、「Edit」と定義されています。
srlist.buttonbar.edit=&Edit
イタリア語のリソース・バンドルUIStrings_it.properties
では、次のコードにより、変換可能なラベルおよびアクセス・キーが「Aggiorna」と指定されています。
srlist.buttonbar.edit=A&ggiorna
アプリケーションのfaces-config.xml
ファイルに<resource-bundle>
要素を追加します。例30-5に、リソース・バンドルに対するJSF構成ファイルのエントリを示します。
リソース・バンドルを使用するようにアプリケーションを設定すると、リソース・バンドル・キーが式言語(EL)エディタに表示され、宣言的に割り当てられるようになります。
次の例では、UIコンポーネントがリソース・バンドルにアクセスしています。
<af:outputText value="#{res['login.date']}"/
詳細は、第29章「ページの国際化およびローカライズ」を参照してください。
コンポーネント・レベルのアクセシビリティ・ガイドラインに加えて、アプリケーションの設計時には、ページ・レベルのアクセシビリティ・ガイドラインにも従う必要があります。コンポーネント・レベルのガイドラインでコンポーネントの使用方法が決まるのに対して、ページ・レベルのアクセシビリティ・ガイドラインは、全体として、アプリケーションの全体的な設計および機能により関係があります。
ページ・レベルのアクセシビリティ・ガイドラインには次のものがあります。
部分ページ・レンダリングの使用
スクリプトの使用
スタイルの使用
ページ構造およびナビゲーションの使用
WAI-ARIAランドマーク・リージョンの使用
アプリケーション・ページの設計時には、表30-3で説明されている一般的なアクセシビリティ・ガイドラインに従う必要があります。
表30-3 一般的なアクセシビリティ・ガイドライン
ガイドライン | アクション |
---|---|
Raw HTMLコンテンツを使用しないこと |
できれば、Raw HTMLコンテンツの使用を避けます。Raw HTMLコンテンツが必要な場合は、 |
サイトのコンテンツに適した最も明確で簡単な言語を使用すること |
アプリケーション全体での言語の明確さおよび簡潔さを確保します。 |
キーボードによるドラッグ・アンド・ドロップの代替方法を提供すること |
ドラッグ・アンド・ドロップ操作を使用するすべての機能を、キーボードでアクセス可能なインタフェース(「切取り」、「コピー」および「貼付け」メニュー項目など)でも、公開する必要があります。 |
アクセシビリティ・モードへのアクセスを提供すること |
ADF Facesでは、次のアクセシビリティ・モードが公開されています。
必要に応じて、エンド・ユーザーがスクリーン・リーダーを選択できるように、Webアプリケーションを設計する必要があります。ADF Facesでのスクリーン・リーダー・モードの構成の詳細は、30.2項「ADF Facesでのアクセシビリティ・サポートの構成」を参照してください。 Webアプリケーションの設計時には、追加のアクセシビリティ・モード(高コントラスト・アクセシビリティ・モードや大きいフォント・モードなど)の追加が必要になる場合があリます。 |
アクセシビリティ標準を復習すること |
関連のアクセシビリティ標準(Web Content Accessibility Guidelinesなど)について知っている必要があります。ADF Facesフレームワークおよびコンポーネントでは、実装詳細の多くが非表示になっていますが、これらのガイドラインに精通しておくことをお薦めします。 |
リンクの目的を説明するテキストを記述すること |
リンクの目的が一般にユーザーにとって不明瞭な場合を除き、各リンクの目的を、リンク・テキストのみから、またはリンク・テキストとプログラムで指定されたリンク・コンテキストから確認できるようにします。 |
サイトの一般的なレイアウト(サイト・マップまたは目次など)についての情報を提供すること |
サイト・レイアウトの要件が必ず満たされるようにします。 |
ページを見つけるための複数の方法を提供すること |
ページのアクセス要件が、アプリケーション全体で必ず満たされるようにします。プロセス、またはプロセス内のステップの結果であるページは除外できます。 |
隣り合ったリンク間を視覚的に分離すること |
隣り合うリンクが視覚的に分離されるようにし、空白を含む1つのリンクが複数のリンクとして表示されないようにします。 |
ADF以外のコンテンツにアクセシビリティ・サポートを提供すること |
ページ内のADF Faces以外のコンテンツがアクセス可能になるようにします。コンテンツは、他のOracle製品またはサードパーティの製品のものでもかまいません。 |
外部ドキュメントに対するアクセシビリティ・サポートを提供すること |
外部ドキュメント(WordドキュメントやPDFファイルなど)にアクセス可能になるようにします。ドキュメントはその製品によって生成されるか、製品に付属のものである可能性があり、最低1つのアクセス可能バージョンが必要です。 |
この項およびそのサブセクションで説明されているガイドラインは、セクション508のガイドラインとWebコンテンツ・アクセシビリティ・ガイドラインを組み合せたOracleグローバルHTMLアクセシビリティ・ガイドラインに従っています。ADF Facesコンポーネントはいくつかのアクセシビリティ・ガイドラインを暗黙的に満たしているため、開発者の負担が軽くなります。たとえば、ADF Facesではすべてのページにlang
属性をレンダリングし、ADF Facesコンポーネントによってレンダリングされたすべてヘッダーでは、適切なHTMLヘッダー要素が使用されます。
スクリーン・リーダーでは、部分ページ・リクエストで全ページの再読上げは実行されません。部分ページ・レンダリング(PPR)を使用する際は、表30-4で説明されているガイドラインに従う必要があります。
表30-4 部分ページ・レンダリングのアクセシビリティ・ガイドライン
ガイドライン | アクション |
---|---|
後ろの部分的なページ変更を優先すること |
部分ページ・レンダリングにより、スクリーン・リーダー・ソフトウェアではページを部分的アクションを起動したコンポーネントから読み上げます。したがって、ターゲット・コンポーネントは、部分リクエストを起動するコンポーネントの後に配置する必要があり、このようにしないと、更新したターゲットがスクリーン・リーダーに読み上げられません。 たとえば、最も一般的なPPRのユースケースは、マスター/ディテール・ユーザー・インタフェースで、マスター・コンポーネントで値を選択すると、ディテール・コンポーネントのページの一部が置き換えられます。このような場合、ドキュメントの順番において、マスター・コンポーネントが常にディテール・コンポーネントの前にあることが必要です。 |
部分的なページ変更のガイダンスを提供すること |
スクリーン・リーダーやスクリーン・マグニファイアのユーザーには、部分ページ・レンダリング・アクティビティの結果、どのコンテンツが変更されたかを正確に特定するのが難しい場合があります。ページ内のキー・コンポーネント間の関係を識別するインライン・テキスト説明という形で、説明を用意すると役に立ちます。たとえば、マスター/ディテール・シナリオでは、インライン・テキストで、マスター・コンポーネント上の行が更新されると、ディテール・コンポーネントも更新されることを説明します。または、ヘルプ・トピックがページの構造やコンポーネント間の関係を説明します。 |
クライアント側スクリプトは、宣言的ソリューションがあるアプリケーションの問題にはお薦めできないため、最小限にする必要があります。
部分ページ・スクリプトを使用する際は、表30-5で説明されているガイドラインに従う必要があります。
表30-5 スクリプトのアクセシビリティ・ガイドライン
ガイドライン | アクション |
---|---|
スクリプトを最小限に維持すること |
クライアント側のスクリプトを避けます。 |
コンポーネントDocument Object Model(DOM)と直接対話しないこと |
ADF Facesコンポーネントは、DOMが変更されると、スクリーン・リーダーと自動的に同期します。DOMとの直接の通信は許可されていません。 |
JavaScriptのタイムアウトを使用しないこと |
スクリーン・リーダーは、JavaScriptの |
キーボードで同等のものを提供すること |
マウスの入力デバイスを使用できないユーザーもいます。たとえば、キーボードしか使用できないユーザー、または代替の入力デバイスや音声認識ソフトウェアなどのテクノロジを使用するユーザーもいます。クライアント側リスナーを使用して機能を追加する場合、その機能には、デバイスに関係なくアクセスできるようにします。事実上、これは次のことを意味します。
|
フォーカス変更をしないこと |
フォーカスを変更すると、コンテキストが変わるため、スクリーン・リーダーのユーザーが混乱する可能性があります。フォーカスの変更、特にフォーカス・イベントに対しての変更を避けるようにアプリケーションを設計します。また、標準のタブ移動が中断されるため、フォーカス変更に応じてポップアップ・ウィンドウが表示されないように設定してください。 |
ポップアップ・トリガーを明示的に指定すること |
スクリーン・リーダーは、インライン・ポップアップの起動に自動的には応答しません。スクリーン・リーダー・モードの際に、スクリーン・リーダー・ソフトウェアがポップアップ・コンテンツを読み上げるよう強制するため、ポップアップ・ウィンドウが開かれた直後に、ADF Facesフレームワークによりキーボード・フォーカスがそのウィンドウに明示的に移動されます。リンクやボタンなどの明示的なポップアップ・トリガーを用意するか、キーボードやスクリーン・リーダーでアクセスできるその他の方法で同じ情報を使用できる必要があります。 |
埋込みオブジェクトのテキスト説明を提供すること |
各埋込みオブジェクトに、必ず適切なテキスト説明を関連付けるようにします。
|
必須のプラグインをダウンロードするリンクを提供すること |
ADF Facesでは、Java、FlashまたはPDFなどのプラグインを使用しません。アプリケーションで必要となるプラグイン用の適切なリンクが確実に提供されるようにする必要があります。 |
プラグイン用のアクセス可能なコンテンツを提供すること |
アプレットやプラグインによって送られるすべてのコンテンツがアクセス可能であることを確認するか、同等のコンテンツにアクセスするかわりの方法を提供します。 |
イベント・ハンドラの入力デバイス依存を避けること |
コンテンツの理解やアプリケーション操作に不可欠ではないイベント(マウスのロールオーバーによる画像の切替えなど)を除いて、イベント・ハンドラが入力デバイスに依存しないようにします。 |
スクリプト・ガイドラインに加えて、いくつかのプログラミング・ガイドラインも提供する必要があります。これらのガイドラインの多くは、ADF Facesに暗黙的に採用されており、それらを実装するための処置は必要ありません。プログラミング・ガイドラインは、表30-6に示されています。
表30-6 アプリケーション・プログラミングのアクセシビリティ・ガイドライン
ガイドライン | アクション |
---|---|
マークアップを使用したページのリダイレクトの避けること |
処置は必要ありません。ADF Facesではページのリダイレクトにマークアップを使用しません。 |
各ページの |
処置は必要ありません。ADF Facesでは、ページごとに |
絵や図のレンダリングにASCII文字の使用を避けること |
アプリケーションにアスキーアート(文字絵)が含まれないようにします。 |
アプリケーション開発者向けのドキュメントでアクセシビリティを使用するものとして定義されているプラットフォームの機能を中断しないこと |
処置は必要ありません。ADF Facesでは、ADF Facesコンポーネントで生成されたコンテンツによりプラットフォームのアクセシビリティ機能が中断されないようにします。 |
他のコンポーネントの外観を制御するコンポーネントについて説明すること |
他のコンポーネントを制御するADF Facesコンポーネントが正しく説明されるようにします。他のコンポーネントに対する制御には、他のコンポーネントの有効化または無効化、非表示または表示、あるいはデフォルト値の変更などがあります。 |
常に適格なHTMLコードを使用すること |
処置は必要ありません。ADF Facesには、コンポーネントにより適格なHTMLコードが生成されるようにする役割があります。 |
非推奨のHTML要素を使用しないこと |
処置は必要ありません。ADF Facesには、コンポーネントで非推奨のHTML要素が使用されないようにする役割があります。 |
セクションのヘッダーが非常にわかりやすく、ヘッダー要素 |
処置は必要ありません。ADF Facesコンポーネントによってレンダリングされたすべてヘッダーでは、適切なHTMLヘッダー要素が使用されます。 |
リスト・コンテンツに適切なHTMLリスト要素が使用されるようにすること |
処置は必要ありません。ADF Facesコンポーネントによってレンダリングされるすべてのリストでは、適切なHTMLリスト要素( |
引用は適切な要素でマークすること |
引用は |
HTML要素上の |
処置は必要ありません。ADF Facesでは、すべてのページで |
すべてのフォーム要素にマークアップを使用してラベルが関連付けられているようにすること |
監査レポートを実行します。 |
各 |
監査レポートを実行します。 ADF Faces |
フレーム各ページにタイトルを付けること |
監査レポートを実行します。 |
ポップアップ・ウィンドウが開くと必ずフォーカスされ、閉じるとフォーカスが論理的な場所に戻るようにすること |
ADF Facesコンポーネントによって提供されるポップアップ・ウィンドウは、常に明示的なユーザー処理に応じて表示されます。ADF Facesでは、フォーカスが起動時に正しくポップアップ・ウィンドウに移動し、終了時に元に戻るようにもします。ただし、 |
ADF Facesコンポーネントはすでにスタイルが設定されており、変更の必要はありません。カスケード・スタイル・シート(CSS)を使用してADF Facesコンポーネントのデフォルトの外観を直接変更する場合、表30-7で説明されているガイドラインに従う必要があります。
表30-7 アクセシビリティのスタイル・ガイドライン
ガイドライン | アクション |
---|---|
CSSの使用を最小限に維持すること |
すでにスタイルが設定されているので、CSSを直接ADFコンポーネントに指定する必要はありません。 |
コンポーネントのデフォルトの外観をオーバーライドしないこと |
コンポーネントのデフォルトの外観をオーバーライドする場合、アクセシビリティへの影響を意識してください。CSSを使用してコンポーネントの外観を変更すると、アクセシビリティに影響する可能性があります。たとえば、色を変更すると色の対比の問題が発生します。 |
拡大縮小が可能なサイズ単位を使用すること |
CSSを使用してサイズを指定する場合は、絶対単位ではなく、フォント・サイズに対して拡大縮小が可能なサイズ単位を使用します。たとえば、 |
CSSの位置設定は使用しないこと |
CSSの位置設定は、拡大されたレイアウト・コンポーネントの位置設定の場合にのみ使用してください。それ以外にはCSSの位置設定を使用しないでください。 |
画面のレイアウトおよび表示の変更にはスタイル・シートを使用すること |
処置は必要ありません。ADF Facesでは、レイアウトの実装にスタイル・シートのある構造要素が使用されます。 |
すべてのページにわたって均一の表示のスタイルを作成すること |
処置は必要ありません。ADF Facesでは、そのスキニング・アーキテクチャにより均一の表示スタイルを提供します。 |
情報の伝達または処理の指示に色やフォント・スタイルを使用しないこと |
情報伝達、処理の指示、レスポンスの要求または視覚的要素の区別の唯一の視覚的手段として、色またはフォント・スタイルが使用されないようにしてください。 |
ページ構造およびナビゲーション・ツールを使用する際は、表30-8で説明されているガイドラインに従う必要があります。
表30-8 ページ構造およびナビゲーションのスタイル・ガイドライン
ガイドライン | アクション |
---|---|
レイアウトに |
ジオメトリ管理レイアウトを実装する際、
|
フロー・レイアウト・コンテンツのスクロールを有効にすること |
フロー・レイアウト・コンテンツ( |
ページ構造の識別にはヘッダー・ベースのコンポーネントを使用すること |
HTMLヘッダー要素は、画面の可読性において重要な役割を果します。通常、スクリーン・リーダーを使用すると、HTMLヘッダー全体を調査または移動して、ユーザーはページの全体的な構造を理解できます。次のコンポーネントを含め、HTMLヘッダーのコンテンツをレンダリングするコンポーネントを介して、ページの主要部分を確認します。
|
ページ位置の識別には |
アクセシビリティ標準では、ユーザーがWebサイトまたはアプリケーション内での位置を確認できる必要があります。 |
スキップ・リンク・ターゲットの指定にはaf:skipLinkTargetを使用すること |
|
複数のページで繰り返されるナビゲーション・メカニズムの一貫性を維持すること |
ADF Facesナビゲーション・コンポーネントを使用することで、ナビゲーションの一貫性を確保します。 |
繰り返されるコンテンツをスキップするための方法を提供すること |
ページの先頭で繰り返されるコンテンツ(ナビゲーション・リンクなど)がある場合、繰り返されるコンテンツをスキップするために |
イメージを使用する際は、表30-9で説明されているガイドラインに従う必要があります。
表30-9 イメージのスタイル・ガイドライン
ガイドライン | アクション |
---|---|
装飾用でないイメージの |
監査レポートを実行します。 |
装飾的なイメージ(スペーサー・イメージなど)では必ず |
監査レポートを実行します。 |
グラフなどの複雑なイメージの |
複雑な スクリーン・リーダー・モードでは、グラフを表などのアクセス可能なコンポーネントに置き換えることを検討してもかまいません。 |
録音され同期化されたメディア(ビデオなど)にかわる音声またはテキストによる手段を提供すること |
適切な音声またはテキストの代替手段が提供されていることを確認します。 |
録音され同期化されたメディアにキャプションを付けること |
適切なキャプションが付いていることを確認します。同期化されたメディアがテキストの代替手段で、明確なラベルが付いている場合、キャプションは不要です。 |
表を使用する際は、表30-10で説明されているガイドラインに従う必要があります。
表30-10 表のスタイル・ガイドライン
ガイドライン | アクション |
---|---|
常に表内の行または列にヘッダーを付けること |
ADF Facesの表ベースのコンポーネントでは、行または列ヘッダー・データの適切なHTMLマークアップが用意されています。 監査レポートを実行します。 |
|
監査レポートを実行します。 |
レイアウト表に |
処置は必要ありません。ADF Facesでは、レイアウト・コンポーネントによりレイアウト表に |
レイアウト表で |
処置は必要ありません。ADF Facesでは、レイアウト・コンポーネントでレイアウト表に空のサマリーが生成されることを確認します。 |
レイアウト表で正しい読上げ順序を指定すること |
処置は必要ありません。ADF Facesでは、生成するすべてのレイアウト表で読上げ順序が正しいことを確認します。 |
WAI-ARIA標準では、ページの異なるセクションが異なるランドマーク・リージョンとして定義されます。WAI-ARIAロールとともに、それらが高度なページ構造についての情報を伝え、ランドマーク領域全体にわたる移動を容易にします。これは特に、スクリーン・リーダーなどの支援技術のユーザーにとって便利です。
ADF Facesには、表30-11に示すように、いくつかのレイアウト・コンポーネント用のランドマーク属性が含まれています。
表30-11 ランドマーク属性のあるADF Facesコンポーネント
コンポーネント | 属性 |
---|---|
|
|
|
|
|
|
|
|
これらの属性には、次のようなWAI-ARIAランドマーク・ロールのいずれかを設定できます。
banner
complimentary
contentinfo
main
navigation
search
ランドマーク関連の属性のいずれかが設定されている場合、ADF Facesでは指定された値でロール属性をレンダリングします。
JDeveloperには、ADF Facesのアクセシビリティ監査ルールが用意されており、30.3.1項「ADF Facesコンポーネントのアクセシビリティ・ガイドライン」で説明されている、多くの一般的な要件に準拠しているかどうかが調査および報告されます。
監査レポートの実行では、監査プロファイルの作成および実行が必要です。
始める前に:
アクセシビリティ監査ルールについて理解しておくと役立ちます。詳細は、30.5項「アクセシビリティ監査ルールの実行」を参照してください。その他のADF Faces機能を使用して追加できる機能について理解しておくことも役に立ちます。詳細は、30.1.2項「ADFページでのアクセシビリティ・サポートの追加情報」を参照してください。
監査プロファイルを作成する手順:
メイン・メニューから、「ツール」→「プリファレンス」を選択します。
「プリファレンス」ダイアログで、「監査」→「プロファイル」を選択します。
「監査: プロファイル」ダイアログで、すべてのチェック・ボックスの選択を解除してから、「ADF Faces」→「アクセシビリティ」チェック・ボックスを選択します。
「別名保存」をクリックし、プロファイルに一意の名前を付けて保存します。
図30-6に、アクセシビリティ監査プロファイルを作成するための「監査: プロファイル」ダイアログの設定を示します。
「OK」をクリックします。
監査レポートを実行する手順:
メイン・メニューから「ビルド」→監査ターゲットを選択します。
「監査プロファイル」ダイアログで、「プロファイル」ドロップダウン・メニューから、作成したADF Facesアクセシビリティ監査プロファイルを選択します。
「実行」をクリックして、レポートを生成します。
監査レポートの結果は、ログ・ウィンドウに表示されます。レポート生成が完了したら、「ログ」ウィンドウ・ツールバーにある「エクスポート」アイコンをクリックして、レポートをHTMLファイルにエクスポートできます。