アプリケーションのアクセシビリティ

アクセシビリティを考慮した設計を行うことで、アプリケーションがより多くのユーザーをサポートできるようになります。 英国の2010年平等法や米国のリハビリテーション法第508条などの政府による規制により、アプリケーションのアクセシビリティが要求される場合もあります。

アクセシビリティの役割

Pega Platform™は、Web Accessibility Initiative-Accessible Rich Internet Applications（WAI-ARIA）規格をサポートしています。 WAI-ARIAは、WAI-ARIAのロールを使用することで、障害を持つユーザーがデジタルコンテンツやウェブアプリケーションを利用しやすくする方法を定義した技術仕様です。

WAI-ARIAのロールは、ユーザーインターフェイス要素に適用される特定の属性です。 ロールは、UI要素に関する補助デバイスとPega Platformのアプリケーションとの間でコミュニケーションができるようにします。 例えば、ロールはスクリーンリーダーに対し、チェックボックスとボタンを区別し、それぞれのコントロールに対し適切なエクスペリエンスをユーザーに提供するよう指示します。

Pega Platformは、3種類のWAI-ARIAロールをサポートしています。 各ロールタイプは、ポータル内の特定のエリアのコンテンツや機能について説明します。

• ランドマーク – ランドマークのロールは、ポータル内のコンテンツを整理し、ページ内の特定のエリアに素早くアクセスできるようにすることで、スクリーンリーダーを使用する際のナビゲーションを改善します。 ランドマークコンテンツは、コンテンツのナビゲーション、検索、消費に関連する目的別のコンテンツです。 Pega Platformのポータルがランドマークのロールを使用してアクセシビリティをサポートする方法の詳細情報については、Pega Communityのトピック「WAI-ARIA roles in a screen layout」を参照してください。
• ドキュメント構造 – ドキュメント構造のロールは、ページコンテンツの構造を説明することです。 一般的に、ドキュメント構造の役割はインタラクティブではありません。 ドキュメント構造には、行や列の見出し、メモ、プレゼンテーションなどの要素があります。
• コンポーネント/ウィジェット – コンポーネントやウィジェットは、インタラクティブなインターフェイスオブジェクトの一つです。 ウィジェットのロールは、アクセシビリティAPIの標準機能に対応しています。 ユーザーがウィジェットに移動すると、補助テクノロジーはキーボードイベントを傍受し、ウェブアプリケーションを通してウィジェットに渡します。

セクション内のダイナミックレイアウトにロールタイプを割り当てることができます。 デフォルトでは、Pega PlatformはWAI-ARIAロールをUIコントロールや、画面レイアウトやダイナミックコンテナなどのその他のコンポーネントに割り当てます。

Pega Platformのアプリケーションにおけるアクセシビリティの詳細情報については、Pega CommunityのトピックAccessibility and Pega Platformを参照してください。 ウェブアクセシビリティに関する詳細情報は、W3Cにあります。

アクセシビリティの機能とアップデートされたアプリケーション

デフォルトでは、Pega Platformのすべてのユーザーに対してアクセシビリティが有効になっています。 Pega Platformの以前のバージョンでは、開発者は、個々のアクセスグループに対してアクセシビリティ機能を有効にする必要がありました。 Pega Platformの以前のバージョンからアプリケーションをアップデートした場合、すべてのアクセスグループをアップデートしてEnable accessibility add-onチェックボックスをオフにし、アプリケーションとすべてのアクセスグループのプロダクションルールセットのリストからPegaWAI ルールセットを削除します。

次の問題に答えて、理解度をチェックしましょう。

また、Pegaは、補助デバイスの使用をサポートするアクセシビリティのベストプラクティスを推奨しています。 次のテーブルは、アプリケーションのアクセシビリティを改善する目的で開発者が実行できるいくつかの設定オプションのリストを挙げています。

アクセスできるアプリケーションの設計を構成するためのベストプラクティスに関する追加ガイダンスについては、Pega Communityのトピック「Best practices for accessibility」を参照してください。 個々のコントロールやアクションがどのようにアクセシビリティをサポートしているかの詳細情報については、Pega Communityのトピック「Supported accessible run-time behavior」を参照してください。

Accessibility Inspectorツールを使用すると、アプリケーション内のアクセシビリティに関する問題を特定し、修正できます。 Accessibility Inspectorは、App StudioとDev Studioの両方で利用できます。Dev Studioから起動した場合、ユーザーポータルでも利用できます。

ベストプラクティスに対するコンプライアンスの監査

Accessibility Inspectorがアクティブになっている場合、アプリケーションのアクセシビリティに悪影響を及ぼす可能性がある設定を特定します。

Accessibility Inspectorは、見つかった問題を、以下の4つのカテゴリーに分類します。

1. コンテンツ – コントロールの設定に関する問題。 アイコンにヘルパーテキストやラベルがない、などの問題が挙げられます。
2. 構造 – ポータル内のコンテンツの構成に関する問題。 見出しレベルの階層が順番通りに並べられていないことが原因で、スクリーンリーダーが混乱する可能性がある、などの問題が挙げられます。
3. 双方向性 – 補助デバイスがUIを操作する方法に影響を与える問題。 ポータルの設定に、コンテンツにスキップするナビゲーションがないため、ユーザーがEnterキーを使ってメインコンテンツに移動できない、などの問題が挙げられます。
4. 互換性 – フォームで使用されるPegaのUI要素に関する問題。 フォームがレイアウトグループではなく、廃止されたタブグループレイアウトを使用している、などの問題が挙げられます。

アプリケーションのアクセシビリティを低下させるUI構成を検査するには、Content、Structural、Interactivity、Compatibilityの見出しの左側にある矢印を展開してください。 展開すると、各問題の説明が表示されます。 問題を展開すると、影響を受けるUI要素が表示されます。 UI要素の上にマウスのカーソルを置き、十字線のアイコンをクリックすると、その要素がDev Studioで開き、問題が対処されます。

色覚異常に関するプレビュー

Disability previewオプションを使用すると、4種類の色覚異常を持つユーザーにアプリケーションがどのように表示されるかを確認できます。 Disability previewでは、色覚異常をシミュレーションするための以下の4つのモードが用意されています。 

1. Achromatopsia（色覚異常、色が判別できない）
2. Deuteranopia（D型色覚、赤緑色弱）
3. Protanopia（P型色覚、赤緑色弱）
4. Tritanopia（T型色覚、青黄色弱）

色覚異常があるユーザーに見えるアプリケーションの外観を模倣するには、「Disability preview」ラベルの右側にあるドロップダウンをクリックします。 デフォルトでは、Disability previewはNoneに設定されています。 プレビュー設定を変更すると、選択した色覚異常に合わせてカラーパレットが一時的に変更されます。 元のカラーパレットに戻すには、Noneを選択するか、Accessibility Inspectorを閉じます。

次の画像では、スライダーを動かすと、標準的なフォームの表示と、T型色覚を持つユーザーが見られる表示を比較できるようになっています。