성공기준 이해 2.4.7:초점 시각화 (Level AA)
요약
- 목표
- 사용자가 어떤 요소에 키보드 초점이 있는지 안다.
- 할 일
- 초점을 받는 각 항목에 지시자(indicator)가 표시되는지 확인하라.
- 중요성
- 초점 표시기(focus indicator)가 없으면 시력이 있는 키보드 사용자는 페이지를 조작할 수 없다.
의도
이 성공 기준의 목적은 키보드 초점이 있는 요소를 사용자가 알 수 있도록 돕는 것이다.
"운용 방식"은 항상 초점 표시기를 표시하지 않거나 키보드를 사용할 때만 초점 표시기를 표시할 수 있는 사용자 에이전트를 고려한다. 사용자 에이전트는 키보드를 사용할 때만 표시하는 등 초점 표시기 표시를 최적화할 수 있다. 저작자는 초점이 보이는 운용 방식을 하나 이상 제공할 책임이 있다. 대부분의 경우 운용 방식이 하나만 있으므로 이 성공 기준이 적용된다. 초점 표시기는 시간 제한을 두어서는 안 되며, 키보드 초점이 표시되면 그대로 유지되어야 한다.
키보드 초점 표시기는 다양한 형태를 취할 수 있다. WCAG 2.2의 새로운 기능: 초점 시각화는 해당 형식이 무엇인지 지정하지 않지만 2.4.13 초점 형태 (Level AAA)는 일관되고 가시적인 지시자를 만드는 데 대한 지침을 제공한다.
이점
- 이 성공 기준은 키보드 작업이 상호 작용할 구성 요소를 항상 시각적으로 판별함으로써 키보드를 사용하여 페이지를 작업하는 모든 사람에게 도움이 된다.
- 주의력 제한, 단기 기억 제한 또는 실행 프로세스 제한이 있는 사람들은 초점이 어디에 있는지 발견할 수 있으므로 이점을 얻을 수 있다.
예제
- 텍스트 필드에 초점이 맞춰지면 필드에 세로 막대가 표시되어 사용자가 텍스트를 삽입할 수 있음을 나타내거나 모든 텍스트가 강조 표시되어 사용자가 텍스트 위에 입력할 수 있음을 나타낸다.
- 사용자 인터페이스 컨트롤이 초점을 받으면 그 주위에 보이는 테두리가 표시된다.
관련 자료
자료는 정보 제공 목적으로만 제공되며 보증을 암시하지 않는다.
기법
이 섹션에서 번호가 매겨진 각 항목은 WCAG 실무 그룹이 이 성공 기준을 충족하기에 충분하다고 간주하는 기법 또는 기법의 조합을 나타낸다. 그러나 이러한 특정 기법을 사용할 필요는 없다. 다른 기법 사용에 대한 자세한 내용은 WCAG 성공 기준에 대한 기법 이해, 특히 "기타 기법" 섹션을 참고하라.
충분 기법
- G149: Using user interface components that are highlighted by the user agent when they receive focus
- C15: Using CSS to change the presentation of a user interface component when it receives focus
- G165: Using the default focus indicator for the platform so that high visibility default focus indicators will carry over
- G195: Using an author-supplied, visible focus indicator
- C40: Creating a two-color focus indicator to ensure sufficient contrast with all components
- SCR31: Using script to change the background color or border of the element with focus
오류
다음은 WCAG 실무 그룹에서 이 성공 기준의 실패로 간주하는 일반적인 실수이다.
점검 규칙
다음은 이 성공 기준의 특정 측면에 대한 점검 규칙이다. WCAG 준수 여부를 확인하기 위해 이러한 특정 점검 규칙을 사용할 필요는 없지만 이것은 정의되고 승인된 검사 방법이다. 점검 규칙 사용에 대한 자세한 내용은 WCAG 성공 기준에 대한 점검 규칙 이해를 참고하라.