화면 밖 콘텐츠가 보조 기술에서 숨겨집니다.

페이지에서 관련 부분만 스크린 리더 및 기타 보조 기술에 노출되도록 합니다. 예를 들어 화면 밖에 있는 콘텐츠는 보조 기술에서 숨겨져야 합니다.

수동 테스트 방법

화면 밖 콘텐츠가 숨겨져 있는지 확인하려면 스크린 리더 스크린 리더로 테스트해야 합니다.

페이지를 탐색하려면 TAB 키를 사용하세요. 스크린 리더는 숨겨진 콘텐츠를 안내해서는 안 됩니다.

해결 방법

화면 밖 콘텐츠를 숨기려면 display: none 또는 visibility: hidden로 설정하여 탭 순서에서 해당 콘텐츠가 포함된 요소를 삭제합니다.

예를 들면 다음과 같습니다.

.remove-me {
  visibility: hidden;
}

<button class="remove-me">Can't reach me with the TAB key!</button>

화면 밖 콘텐츠의 공개 상태를 올바르게 설정하기도 참고하세요.

리소스

화면 밖 콘텐츠가 보조 기술에서 숨겨져 있음 감사를 위한 소스 코드