많은 ARIA 데모 웹 사이트는 다음과 같은 코드를 사용합니다.
<label for="name" id="label-name">Your Name</label>
<input id="name" aria-labelledby="label-name" type="text">
하지만 aria-labelledby이 경우 속성 을 사용하는 목적은 무엇 입니까? input소자 이미별로 표시되어 label사용되어 소자 for특성, 그렇지?
답변
Mozilla 개발자 페이지에 사용에 대한 몇 가지 좋은 예가 있습니다 . 아마도 가장 좋은 예는 팝업 메뉴를 상위 메뉴 항목과 연결하는 데 사용되는 곳일 것입니다. 페이지의 예 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 및 기타 저수준 요소), 스크린 리더에게 상위 수준 의도가 무엇인지 알려주는 것이 필수적입니다.
답변
새로운 것은 항상 UA 지원 문제가 있으므로 개발자는 점진적 향상을 고려합니다. 이 ARIA 기술은 “for”속성을 제거 할 수있는 기능을 제공하고 다른 요소가 풍부한 양식의 일부가 될 수 있도록합니다. 이러한 기술은 일반적인 관행이 될 것입니다.
