WAI-ARIAの読み込みアニメーションにラベルを付けるにはどうすればいいですか？

Question

私はいくつかのアクセシビリティ問題をWebページで修正しようとしています。このdivはダイアログとして機能し、ある時点では読み込みアニメーションを含むdivと "Working ..."というテキストが表示されます。

私は、これらの2つの項目にどのようにラベルを付けるかについては不明ですが、進行中のアニメーションがあることを盲目のユーザーに正しく通知し、動作しており、彼は待つべきです。

<div id="loading" style="display: none;"> 
     <div class="mgBot15"><span class="txt16" role="alert">Working...</span></div> 
     <img src="loading.png" role="progressbar" aria-busy="true"/> 
    </div> 

私は（最初に親のdivにも）imgにroleとaria-busyプロパティを追加しようとしました。

表示スタイルプロパティを変更してこのdivが表示されると、正しく「作業中...」と表示されますが、ビジー状態であり、ユーザーが待機する必要があるとの表示が聞こえません。

これまでのところ、アニメーションを読み込むための例は見当たりませんでした。

注：私はNVDAをスクリーンリーダーとして使用してテストしています。

おかげ

Answer 1

最高の解決策は、ロールアラートとaria-busy = "true"を使用することでした。

<div id="loading" style="display: none;"> 
    <div class="mgBot15"><span class="txt16" role="alert" aria-busy="true">Working...</span></div> 
    <img src="loading.png" /> 
</div> 

Answer 2

あなたのスパンでrole="alertdialog" aria-busy="true"を使用してみましたか？

Answer 3

これもこのコンボとここHow do you make the Loading icon accessible for screen-readers like JAWS?に答えてきたことを注記：ARIA-忙しい= "true" のアリア・ライブ