概要

アクセシブルなフォームとは、特別な手助けを必要とするユーザーを含むすべてのユーザーが使用できるフォームを意味します。Adobe Experience Manager (AEM) は、障害を持つ様々なユーザーに対するアダプティブフォームの可用性を向上するためのさまざまな特長や機能を備えています。このソリューションは、アクセシブルなアダプティブフォームを作成するときにフォーム作成者を支援する役にも立ちます。

アクセシビリティをアダプティブフォームに組み入れることは、可能な限り多くの人がコンテンツにアクセスできるようになるだけでなく、アクセシビリティ標準への準拠が法律で義務付けられている地域にドキュメントを供給するときの必要条件でもあります。AEM Forms では、フォーム開発者がアクセシビリティ標準に準拠できるよう支援します。

アダプティブフォームの作成時に、作成者は次の事項を考慮してアクセシブルなアダプティブフォームを作成する必要があります。

  • フォームのコントロールに対する正しいラベルの提供
  • 画像の代替テキストの提供
  • 十分なカラーコントラストの提供
  • フォームのコントロールがキーボードでアクセスできることの確認

フォームのコントロールに対する正しいラベルの提供

コンポーネントのラベルまたはタイトルにより、フォームコンポーネントの内容が分かります。例えば、「名」というテキストを付ければ、テキストフィールドに名前を入力するようにユーザーに指示することができます。スクリーンリーダーによってアクセシブルにするために、ラベルはフォームコンポーネントにプログラム的に関連付けられます。あるいは、フォームのコントロールは追加のアクセシブル情報で設定されます。

スクリーンリーダーによって認識されるラベルは、表示キャプションと必ずしも同じである必要はありません。場合によっては、コントロールの目的をさらに具体的に説明するものにすることもできます。フォームの各フィールドオブジェクトごとに、アクセシビリティオプションを使用して、スクリーンリーダーがその特定のフォームフィールドを識別するためのものを指定することができます。

アクセシビリティオプションを使用するには、次の手順に従います。

  1. コンポーネントを選択して、 をタップします。
  2. サイドバーのアクセシビリティをクリックして、必要なアクセシビリティオプションを選択します。

フォームコンポーネントのアクセシビリティオプション

フォームコンポーネントのアクセシビリティオプション

カスタムテキスト

フォーム作成者は、アクセシビリティオプションカスタムテキストフィールドにコンテンツを入力します。スクリーンリーダーなどの支援機能は、このカスタムテキストを使用します。ほとんどの事例の場合、タイトル設定を使用することが最も適切です。カスタムのスクリーンリーダーテキストを作成するのは、タイトルや簡単な説明を使用できない場合のみにすることに留意してください。

簡単な説明

ほとんどのコンポーネントでは、ユーザーがコンポーネントの上にポインターを置くと、簡単な説明が実行時に表示されます。このオプションは、ヘルプコンテンツオプションの簡単な説明フィールドで設定できます。

タイトル

このオプションを使用すると、AEM Forms はフォームフィールドに関連付けられている表示ラベルをスクリーンリーダーのテキストとして使用できます。

名前

バインディングタブの名前フィールドに値を指定できます。名前には空白を含めることはできません。

なし

「なし」を選択すると、フォームオブジェクトは発行されたフォームに名前を持ちません。フォームのコントロールに対して「なし」を設定することは推奨できません。

注意:

ラジオボタンとチェックボックスは、アクセシビリティのために 2 つだけのオプション(カスタムテキストとタイトル)を持つことができます。

注意:

FXA ベースのアダプティブフォームの場合、アクセシビリティオプションは、XDP に設定されているアクセシビリティオプションから継承されます。XDP のツールヒントは簡単な説明にマッピングされ、キャプションはタイトルにマッピングされます。その他のオプションはそのまま機能します。

画像の代替テキストの提供

画像を使用すると、一部のユーザーに対して理解度を向上することに役立ちます。ただし、スクリーンリーダーを使用するユーザーに対しては、画像の使用はフォームのアクセシビリティを低下させます。画像を使用する場合は、すべての画像に対して代替テキストを提供してください。

このテキストは、フォーム内のオブジェクトとその目的を説明する内容である必要があります。スクリーンリーダーが画像を検出すると、この代替テキストを読み上げます。画像は常に代替テキストが指定される必要があります。

画像コンポーネントを選択し をタップします。サイドバーのプロパティで、画像の代替テキストを指定します。

画像の代替テキスト

十分なカラーコントラストの提供

アクセシビリティデザインでは、カラーの使用に対する特別なガイドラインを考慮する必要があります。フォーム作成者は、カラーを使用しさまざまなフォームのコンポーネントを強調表示することで、フォームの外観を向上できます。ただし、カラーの使い方が不適切だと、障害を持つ人たちがフォームを読むことを困難あるいは不可能にしてしまうことがあります。

視覚障害を持つユーザーは、デジタルコンテンツを読むときに、テキストと背景の間に高いコントラストを必要とします。十分なコントラストがないと、一部のユーザーがフォームを読むことが不可能ではないにしても困難になる場合があります。

デフォルトのフォントと背景(白の背景に黒のコンテンツ)を使用することが推奨されます。デフォルトカラーを変更する場合は、明るい背景に暗い前景またはその逆を選択してください。

アダプティブフォームのカラーコントラストとテーマを変更することについて詳しくは、アダプティブフォームのカスタムテーマの作成を参照してください。

フォームのコントロールがキーボードでアクセスできることの確認

アクセシブルフォームは、キーボードまたは相当の入力デバイスのみを使用してすべて記入できます。四肢や視覚に障害を持つユーザーはキーボードのみで入力を行わなければならない場合があります。また、マウスを使用できるユーザーでもキーボード入力を好むひとが多くいます。入力の方法を複数用意することで、アクセシブルなフォームが作成できるだけではなく、すべてのユーザーの要望に応えられるフォームが作成できます。

AEM Forms では次のキーボードショートカットが使用できます。

操作 キーボードショートカット
次のフォームへカーソルを移動させます。 Tab
前のフォームへカーソルを移動させます。 Shift + Tab
次のパネルに移動します。 Alt + 右向き矢印
前のパネルに移動します。 Alt + 左向き矢印
フォーム内の記入済みデータをリセットします。 Alt + R
フォームを送信します。 Alt + S

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー