사용자 포커스가 실수로 특정 리전에 갇히지 않음

한 특정 페이지 요소에 키보드 포커스를 잠그거나 가두어 두면 안 됩니다. 사용자가 키보드만 사용하여 모든 페이지 요소를 자유롭게 탐색할 수 있어야 합니다.

수동 테스트 방법

사용자가 실수로 포커스를 가두지 못하도록 테스트하려면 키보드만 사용하여 모든 페이지 요소를 탐색합니다. TAB을 사용하여 '앞으로'로 이동하고 SHIFT+TAB을 사용하여 '뒤로'로 이동합니다.

모든 페이지 요소를 탭할 수 없으면 키보드 탐색이 제대로 작동하지 않는 것입니다. 키보드 포커스가 멈출 수 있으므로 자동 완성 위젯에 주의하세요.

수동 접근성 테스트에 관해 자세히 알아보세요.

해결 방법

모달 대화상자 및 위젯과 같이 여러 형식으로 콘텐츠를 표시하는 페이지는 포커스 트랩의 위험이 있습니다.

상호작용이 필요한 모달이 있고 사용자가 확인할 때까지 페이지의 나머지 부분과 상호작용하지 못하도록 하려는 경우에만 사용자를 일시적으로 가두는 것이 좋습니다. 하지만 모달을 이스케이프하는 키보드 액세스 가능한 메서드를 제공하는 것이 좋습니다.

다음은 접근 가능한 모달을 만드는 방법의 예입니다. 이 예에서는 사용자가 포커스 트랩에서 벗어나기 위해 페이지를 새로고침하도록 강제하지 않고도 모달의 의도된 동작을 가져올 수 있습니다.

모달 및 키보드 트랩도 읽어 보시기 바랍니다.

중요한 이유

마우스를 사용할 수 없거나 사용하지 않기로 선택하는 사용자의 경우 키보드 탐색은 화면의 모든 항목에 도달하는 기본 수단입니다. 좋은 키보드 사용 환경은 논리적인 탭 순서와 눈에 띄는 포커스 스타일을 기반으로 합니다. 키보드 사용자가 특정 페이지 요소에 갇히면 페이지와 상호작용할 방법이 없습니다.

보조 기술로 테스트하는 방법을 자세히 알아보세요.

리소스

사용자 포커스가 실수로 영역에 갇히지 않음 감사의 소스 코드