화면 판독기에 동적으로 추가 된 요소 : aria-live Vs role-alert

Question

요소가 페이지에 동적으로 추가되는 응용 프로그램이 있으며 다른 버전의 브라우저 (예 : IE 8/9/10)에서 화면 판독기가이를 읽도록하고 싶습니다. , FF 및 Chrome).

다음 두 가지의 차이점은 다음과 같습니다. 'role = alert'속성을 추가하십시오. 'aria-live = assertive'?

$("<div role='alert'>Sample message.</div>").appendTo($existingElement); 

$("<div aria-live='assertive'>Sample message.</div>").appendTo($existingElement); 

Answer 1

은 기본적으로 role='alert' 그래서 가 사용자의 관점에서 유사하게 동작한다, assertive 값 aria-atomic 및 aria-live 상속합니다. 그러나 모든 사용자 에이전트가 동일한 방식으로 사양을 구현하는 것은 아닙니다.

w3c recommends 일반 아리아 라이브 지역보다 사용 가능한 경우 적절한 역할을 사용합니다. 이것은 사용 도구가 역사적으로이 둘 사이에 inconsistent behaviors을 표시했다는 경고와 함께 나온다.

HTML5 Accessibility's alert test page에 대한 테스트 결과 ChromeVox 1.27.0은 사용자가 보여준 기술을 지원하는 반면 Safari에서는 VoiceOver on OS X 10.8.4가 지원하지 않음을 보여줍니다.