web-dev-qa-db-ja.com

視覚障害者に効果的な行動を促す方法を教えてください。

盲人のためのCTA(行動を促すフレーズ)のテクニックと優れた実践について知りたいのですが。

もちろん、私は WAI-ARIAsr-onlyを使用し、必要なテクニックを使用しますページにアクセスできますが、CTA「ジャンプ」を作成して、通常のCTAと同じように盲人の注意を引く方法はあるのでしょうか。

10
Devin

状況に応じて、できることがいくつかあります。

  1. ページが読み込まれると、最初のフォーカスの場所に応じて、最初のオブジェクト(aria-describedby)CTAとは何かをスクリーンリーダーに通知します。

  2. ライブリージョンである視覚的に非表示のコンテナ(例:<div class='sr-only' aria-live='polite'>)ページの読み込み時にテキストで更新されます。 (ライブ領域のテキストは、テキストが変更されるとスクリーンリーダーによってアナウンスされます。)

最初のフォーカス可能なオブジェクトまたはライブ領域に関連付けるテキストには、強調しようとしているオブジェクトの名前(通常はボタンまたはリンクのラベル)と、オブジェクトの「タイプ」(ボタン、リンク、チェックボックスなど)。タイプは非常に重要です。スクリーンリーダーのユーザーは、そのタイプのオブジェクトにすばやくジャンプできるからです。 (「B」を押すと次のボタンに移動し、「U」を押すと次の未訪問リンクに移動し、「X」を押すと次のチェックボックスに移動し、「T」を押すと次のテーブルに移動します)。そのタイプのオブジェクトのリストを含むダイアログを表示することもできます。たとえば、ページ上のすべてのボタンまたはページ上のすべてのリンクを表示できます。

したがって、オブジェクトのタイプを指定することが重要です。 CTAメッセージには、「必ず今すぐ登録button」を選択してください。

(私は自分の応答から実装の詳細を守ろうとしましたが、私の指摘をするためにいくつかを指定する必要がありました。このようなものを実装する方法についてさらに質問がある場合は、stackoverflowに投稿し、「アクセシビリティ」タグを必ず追加してくださいあなたがこれでやったような質問です。そうすれば私はそれを見るでしょう。)

4
slugolicious

これは実際に非常に良い質問であり、私はそこにあるアクセシビリティ専門家の1人がこれについても答えてくれることを願っています。

私の推測では、視覚的な手掛かりに頼ることができないユーザーがいる場合、その決定を行うために必要なコンテキストまたは情報を線形で提供する必要がある場合、コンテンツを設計して他のアクションよりも優先するコンテンツの柔軟性は低くなります。シーケンス/フロー。

つまり、理論的には、CTAを画面上の他の要素よりも優先することでCTAを「ジャンプ」することができますが(たとえば、CTAインタラクションで最初にオーディオを再生する)、おそらくユーザーに役立つ十分なコンテキストがありません。

たぶん、より柔軟なWebページを作成するためのより高度な手法があるかもしれませんが、ページをアクセス可能/使用可能にする境界を押し広げると思います。ページのコンテンツの量を減らしたり、ページの遷移中により多くのコンテキストを提供したりして、人々がCTAにスキップできるようにするなど、ページを異なる方法で設計する必要があると思いますそうする意味。

2
Michael Lai