학생 주도 설문 조사를 위해 보이지 않는 요소 키보드를 집중화하고 스크린 리더가 읽을 수있게 만드는 방법을 알고 있습니다. 스크린 리더/키보드 포커스가 눈에 띄지 않게하려면 튜터가 마우스를 사용하여 볼 수있게해야합니다.요소를 스크린 리더/키보드 포커스에 보이지 않게 보이지만 마우스 클릭으로 볼 수 있음
iframe을 사용해 보았지만 키보드에서 여전히 '탭'을 사용할 수 있습니다. 부모 창을 제어 할 수있는 팝업 창을 고려하고 있었습니까? - 차단기 등에 문제가있을 수 있습니다.
많은 감사! Mike
화면 판독기에서 내용을 무시하는 가장 간단한 방법 중 하나는 HTML을 이미지에 배치 한 다음 이미지의 alt 텍스트를 ""HTML로 설정하는 것입니다. 이로 인해 화면 판독기가이를 해석 할 수 없으므로이 내용을 건너 뛸 수 있습니다. 이렇게하면 웹 브라우저가 페이지의 다른 이미지처럼 취급하므로 탭이나 키보드 포커스를 제거합니다.
이렇게하는 또 다른 방법은 좀 더 복잡합니다. 페이지가 브라우저를 읽는 화면에 들어가는 지 감지하고 독자가 읽지 않으려는 콘텐츠의 CSS 속성을 설정하는 것입니다.
visibility: hidden; display:none;
화면 판독기는 보이지 않거나 표시되지 않는 항목을 무시하므로 사용자에게 읽지 않습니다. 이것은 페이지의 SEO 순위를 파괴하지 않고 보거나 듣지 않아도되는 사용자에게 표시되는 콘텐츠를 수정하기 때문에 조금 더 깨끗합니다.
화면 판독기가 요소를 볼 수 없게하는 좋은 방법은 aria-hidden = "true"속성을 적용하는 것입니다. 이것은 브라우저에서 상당히 잘 지원되며 JAWS 및 다른 화면 판독기에 내용을 건너 뛰도록 프롬프트합니다. role = "presentation"을 사용할 수도 있습니다. 여기에 좋은 기사가 있습니다 : http://john.foliot.ca/aria-hidden/ tabindex = -1을 적용하면 스크립트 입력이 아닌 키보드 입력 만 허용되므로이 기능도 작동합니다 . 또한, 나는 그것을 권장하지 않지만 다른 사람의 스크립트를 통해 내 머리카락을 찢어 버리는 동안 찾았습니다. 링크 요소에 대해 정의 된 'href'속성이 없으면 (잘못된 값으로 설정 됨) 이로 인해 포커스도 방지됩니다.
img가 태그 안에있을 것이므로 이미지 아이디어를 뺀 대체 텍스트가 작동 할 수 있습니다. 그러나 키보드에서 onclick 대신 javascipt를 사용하지 않으면 키보드가 여전히 초점을 맞 춥니 다. ??? 생각에 대한 피드를 주면서 - 많은 감사합니다! –
이미지가 태그 내에 있어야한다는 것은 아무것도 없지만 키보드 포커스가 발생하는 것은 맞습니다. 포커스를 얻지 않으려면 앵커 태그에 넣지 마십시오. 앵커 링크를 사용해야 할 경우이 StackOverflow 기사 (http://stackoverflow.com/questions/1561021/prevent-tabstop-on-a-element-anchor-link-in-html)에서는 "해킹"에 대해 언급합니다. Tabindex = -1은 키보드 포커스/탭을 허용하는 브라우저를 방지하는 수단입니다. JavaScript가 필요하지 않습니다. – Liam