사용자가 선형 탐색을 사용하여 대화 상자 외부로 돌아 가지 않는지 확인할 수있는 방법이 있습니까? 탭 탐색에서이 문제를 처리하는 자바 스크립트가 있습니다.대화 상자 내에서 선형 탐색 트래핑
참고 :
선형 탐색 : 선형 탐색하여 내가 탭 키 그러나 화면 판독기가 제공하는 선형 탐색을 사용하여 탐색을 의미하지 않는다. (goolge 크롬에서 ChromevoxKey + 화살표로 앞으로 또는 뒤로 이동). 이것은 기본적으로 DOM을 통해 탐색하고 화면 판독기는 DOM 요소를 읽습니다.
onblur 이벤트를 사용하기 전에이 작업을 수행했습니다. Onblur 청취자는 초점을 유지하기를 원합니다 (onblur는 모든 브라우저에서 거품이 나지 않으므로 까다 롭지 만 가능할 수 있음). 귀하의 모달이 사용자의 어떤 행동으로 인해 초점을 잃었을 때, 당신이 모달에서 원하는 요소로 초점을 다시 되돌려 놓았 음을 발표하십시오. 사용성 관점에서 볼 때 모달 내에서 포커스가있는 마지막 객체 여야합니다. 특히 사이트가 아닌 사용자의 경우에는 AT가 사이트를 배치하도록 지시 한 지점에 집중할 것을 기대하면서 방해가 될 수 있으므로이를 수행했는지 구체적으로 발표해야합니다.
모달이 포커스를 잃었을 때 닫힌 상태임을 알리는 것이 훨씬 더 나은 방법입니다. AT 사용자는 모달을 다루는 데 익숙하며, AT가 웹 사이트 디자인으로 인해 모달 외부에서 탐색을 제공하는 경우 AT 사용자는 오랫동안 상호 작용의 초점이 될 때 모달 마감 자체에 대한 아이디어에 익숙해집니다. 사용자가 웹 페이지의 다른 부분으로 모달을 클릭하면 대부분의 모달처럼 사라집니다. 계속 진행하기 전에 모달에 절대적으로주의를 기울여야하는 경우가 아니라면이 방법은 훨씬 사용자에게 친숙합니다. 특히 위치 지정 키보드 사용자의 경우 탐색 도움말을 위해 AT를 사용합니다.
초점/흐림 이벤트 버블 링/캡처가 : http://www.quirksmode.org/blog/archives/2008/04/delegating_the.html
내 포인트를 분명히하지 않아서 유감입니다. '선형 내비게이션'이라는 용어가 실제로 정확한지 확실하지 않습니다. 기본적으로 액세스 가능성이있는 모든 Android 휴대 전화에서 왼쪽에서 오른쪽으로 스 와이프하여 AT가 페이지의 다음 요소를 읽습니다. 오른쪽에서 왼쪽으로 비슷한 경우 DOM의 이전 요소를 읽습니다.요소가 포커스를받을 수 있는지 여부는 중요하지 않습니다. 내가 얻으려고하는 것은 화면 판독기 포커스가 대화 상자의 끝에 도달하면 AT가 "대화 상자에 끝내기"를 읽고 백그라운드로 이동하는 대신 맨 위로 이동해야한다는 것입니다. – Sashwat
내 방법은 사용하는 선형 탐색의 정의와 독립적으로 작동하지만 사소한 수정이 필요할 수도 있지만 개념은 여전히 정상적입니다. 귀하의 대답에 내 방법을 선호하는 이유는 브라우저/AT 독립적입니다. 솔루션이 효과가 있다면 괜찮습니다.하지만 다른 브라우저/AT 조합에서 작동하지 않을 수 있습니다. 아리아 숨김 속성은 많은 브라우저에서 깨졌습니다. – ChrisCM
나는 이것을 달성하기 위해 해킹을 가로 질러왔다.
화면 판독기는 볼 수있는 요소 만 읽습니다. 따라서 HTML 요소에 "aria-hidden"="true" 속성을 추가하면 화면 판독기가 해당 요소에 선형 초점을 사용하지 않습니다 (화면 판독기는 div 및 해당 내용을 숨겨진 것으로 읽지 않습니다). 해킹
: 나는 body 내부의 다른 div로 대화 상자를 보여 body에서 별도의 div 내부의 주요 내용을 보관하고 내가 대화 상자를 표시 할 때마다 메인 컨텐츠 div에 aria-hidden="true"을 추가했다. 대화 상자를 닫으면 주 콘텐츠 div에서 아리아 숨겨진 attr을 제거합니다.
<body>
<div id="dialog box"> <--- This is the dialog box ----> </div>
<div id="main content" aria-hidden="true"> <-- This is the main content --> </div>
</body>
닉의 게시물이 도움이 될 수 http://www.nczonline.net/blog/2013/02/12/making-an-accessible-dialog-box/ –
감사 라이언 :)을. 나는 실제로 그것을 단지 따라 갔다. 선형 탐색에 대한 언급은 없습니다. 선형 탐색 및 탭 탐색은 다릅니다. 탭 탐색은 Tab 키로 작동합니다. 여기서 선형 탐색은 화면 판독기가 dom 요소의 각 노드를 읽는 데 특히 적합합니다. ChromeVox addon이있는 Google 크롬에서 Ctrl + 화살표 키를 사용하여 수행 할 수 있습니다. 휴대 전화 나 태블릿에서 앞으로 내비게이션을 할 때 왼쪽에서 오른쪽으로 스 와이프하거나 내비게이션으로 뒤로 스 와이프 – Sashwat