2011-10-18 2 views
1

이 내가 함께 넣어 jQuery를 아코디언입니다 : 나는 그것이 화면 판독기 및 기타 보조 기술과 함께 작동 여부를 알고 싶어 http://jsfiddle.net/cutcopypaste/xAPSz/내 JS 아코디언에 액세스 할 수 있습니까?

.

저는 자바 스크립트가 없으므로 모든 것이 확장된다는 것을 알고 있습니다.

헤더를 클릭 할 수 있음을 나타 내기 위해 링크 호버 효과를 추가했지만 스크린 리더로 어떤 결과가 발생할지 모르겠다 ... 모든 콘텐츠가 처음부터 표시됩니까? (괜찮습니까?) 또는 목록 항목을 클릭해야한다는 표시없이 축소됩니까? 이 문제를 해결하기위한 좋은 방법은 무엇일까요?

js를 사용하여 헤더 주위에 실제 앵커 태그를 추가하여 클릭 할 수 있음을 나타 내기 위해 (지금은 사용하고있는 호버 스타일이 아니라) 가치가 있는지 확실하지 않습니다.

+1

JAWS 및 NVDA를 다운로드하여 시험해보십시오. – albert

+0

[여기] (https://www.w3.org/TR/wai-aria-practices/#accordion)을 읽고 구현하지 않은 것을 확인하십시오. – FreeLightman

답변

2

스크린 리더는 다양하지만 화면에 보이는 내용 만 읽는 경향이 있습니다. 아코디언이 닫히기 시작하면 표제를 링크로 바꾸거나 표제 텍스트 주위의 링크를 감싸는 것이 좋습니다. 그렇게하면 스크린 리더에서 클릭 가능한 항목이되어 사용자가 제목/링크를 건너 뛰거나 내용을 열 수 있습니다.

링크를 추가하면 아코디언 키보드에 액세스 할 수있게됩니다. 일반적으로 사람들이 결과를 얻기 위해 사물을 클릭하게하려면 링크를 만든 다음 CSS로 스타일을 지정하여 원하는 방식으로 볼 수있는 것이 가장 좋습니다. 다른 요소를 사용하여 초점을 다시 추가하고 스크립팅 기능을 활성화하는 것보다 작업이 적습니다. Enter 키를 눌러 링크를 탭하고 활성화하면 시력이나 이동 장애가있는 사용자가 쉽게 접근 할 수 있습니다.

+0

내 관심사 중 하나는 화면 판독기가 페이지의 내용을 잘 변경하는 데 적용되는지 여부입니다. 요즘 꽤 표준적인 기능입니까? (내 연구의 대부분은 날짜가 다양했기 때문에 요즘처럼 풍경이 어떻게 보이는지 잘 알 수 없었습니다.) – Damon

+0

아코디언을 사용하면 내용이 시작부터 숨겨지기 때문에 대처합니다. 오케이. JAWS와 NVDA는 현재 인기있는 스크린 리더이며, NVDA는 온라인에서 좋은 자습서로 무료입니다. – stringy

+0

와우, 너무 빨리 입력하십시오. 일반적으로 접근성을 점진적 향상의 일부로 취급하면 개발하기가 더 쉽습니다. js/이미지/시력/이동성/대형 화면 (대개 평범한 html/css 및 많은 앵커 링크가있는 사람들)을위한 페이지를 빌드 한 다음 브라우저를 위해 처리 할 수있는 스타일과 스크립팅을 추가하십시오. – stringy

관련 문제