2012-12-05 2 views
1

화면 판독기 및 기타 보조 기술로 내 웹 사이트를 더욱 쉽게 사용할 수 있도록하기로 결정했습니다. 지금 나는 나의 탐색에 정말로 초점을 맞추고있다. 당신이 정말로 원하는 항목이 깊고 중첩되어 있으면 메뉴에있는 모든 항목을 반복하고 싶은 사람은 누구입니까?메뉴가 순수 CSS로 구동되는 경우 아리아 숨김 속성 업데이트

내가 작업하고있는 웹 사이트에는 완전히 CSS 기반의 드롭 다운 메뉴가 있습니다. 자바 스크립트를 사용하여 키보드에 액세스 할 수있게 만들고 아리아 속성을 추가하여 스크린 리더를 도울 수 있습니다.

내 질문은 기존 메뉴 순수 CSS, 나는 지금 메뉴의 일부가 될 때마다 아리아 숨겨진 속성을 업데이트하기 위해 자바 스크립트 내 메뉴를 증대해야하는 경우 알고 싶은 것을

을 감안할 때입니다 명백한? 또는 첫 번째 인스턴스에서 aria-hidden = "true"로 설정하고 화면 판독기에 기본 상태를 나타내는 것만 둡니다.

콘텐츠를 표시/숨기기 위해 순수 CSS를 사용하는 모든 것이 이제는 자바 스크립트로 보강되어야한다는 점은 저와 잘 어울리지 않습니다. 순수 CSS 디스플레이 전환의 모든 목적을 저버린 것처럼 느낍니다.

+0

CSS에서 'display : none' (또는'visibility : hidden')을 올바르게 사용하고 키보드로 완벽하게 작동하는 경우 ARIA를 사용해야합니다 ('role = "navigation"'랜드 마크 제외) 정렬되지 않은 목록에 마우스가 있습니까? div와 span의 무리는 ARIA가 틀림없이 필요합니다. – FelipeAls

+0

이 특별한 경우에, 나는 모든 이유로 올바른 역할을 사용했지만, 아리아 숨김을 사용하지 않기로 결정했습니다. 어쨌든 어떤 사람들은 그것을 사용하지만, 비주얼 렌더링에 숨어 있지 않은 스크린 리더로부터 물건을 숨길 의도가 있다고 생각합니다. 화면 판독기는 DOM을 통해 표시되는지 여부를 쉽게 알 수 있어야합니다 (SHOULD). 그렇지 않다면 나는이 버그 투성이의 행동을 고려할 것입니다. –

답변

2

예. 상태가 변경 될 때 aria-hidden을 설정해야합니다.

제작자는 표시되지 않는 콘텐츠에 대해 aria-hidden = "true"를 설정해야합니다 (숨겨진 메커니즘에 관계 없음).

aria-hidden specification

그 표현은 가시성을 전환 CSS 나 자바 스크립트를 사용하는지, 당신은 아리아 숨겨진 값을 업데이트 할 필요가 저에게 제안합니다.

+0

그것은 정확합니다. Aria-hidden = 'false'는 화면 판독기에 해당 요소의 내용이 없음을 나타냅니다. –

+1

아리아는 위대합니다. 그러나 화면 판독기는 display : none을 사용하여 올바르게 숨겨진 내용을 건너 뜁니다. 가시성 : 숨김; –

관련 문제