すでにラベル付けされた入力要素で「aria-labelledby」を使用する目的は？

多くのARIAデモWebサイトは、次のようなコードを使用しています。

<label for="name" id="label-name">Your Name</label>
<input id="name" aria-labelledby="label-name" type="text">

しかしaria-labelledby、この場合、属性を使用する目的は何ですか？input要素がすでにによって標識されているlabel使用している要素forの属性を、そうではありませんか？

MozillaDeveloperページでの使用の良い例がいくつかあります。おそらく、彼らの最良の例は、ポップアップメニューを親メニュー項目に関連付けるために使用される場合です-それはページの例7です：

<div role="menubar">  
    <div role="menuitem" aria-haspopup="true" id="fileMenu">File</div>  
    <div role="menu" aria-labelledby="fileMenu">  
        <div role="menuitem">Open</div>  
        <div role="menuitem">Save</div>  
       <div role="menuitem">Save as ...</div>  
       ...  
    </div>  
    ...  

ARIA属性は、アクセシブルなリッチインターネットアプリケーションの構築に最も役立つ傾向があります。標準のセマンティックHTMLに固執している限り、標準のラベルが付いたフォームを使用している限り、まったく必要ありません。したがって、で使用する理由はありません。 LABEL / INPUTペア。ただし、「リッチUI」を最初から構築する場合（DIVやJavaScriptがインタラクティブ機能を追加するその他の低レベル要素）、スクリーンリーダーに高レベルのインテントが何であるかを知らせるために不可欠です。

新しいものには常にUAサポートの問題があるため、開発者はプログレッシブエンハンスメントに注目しています。このARIA手法は、「for」属性を廃止する機能を提供し、他の要素をリッチフォームの一部にすることができます。これらのテクニックは一般的な方法になります。