WCAG 2.2 · 2. 운용의 용이성 · 2.5 입력 방식
2.5.2 포인터 취소
Pointer Cancellation
단일 포인터로 동작하는 기능은 누르는 순간(down) 실행되지 않거나, 실행을 취소·되돌릴 수 있어야 합니다.
수준 AWCAG 2.1
한눈에 보기
- 성공 기준
- 2.5.2 포인터 취소
- 수준
- 수준 A
- 원칙
- 2. 운용의 용이성
- 지침
- 2.5 입력 방식
- 도입
- WCAG 2.1
요구 사항
단일 포인터로 조작하는 기능은 다음 중 하나 이상을 만족해야 합니다.
- 다운 이벤트 없음: 포인터를 누르는 순간(down-event)에는 기능이 실행되지 않습니다.
- 중단 또는 되돌리기: 기능이 떼는 순간(up-event)에 완료되고, 완료 전에 중단하거나 완료 후 되돌리는 방법이 있습니다.
- 업 반전: 떼는 순간 누를 때의 결과가 반전됩니다(예: 누르는 동안만 보이는 미리보기).
- 필수: 누르는 순간 실행하는 것이 필수입니다(예: 피아노 건반 앱, 사격 게임).
키보드 입력을 흉내 내는 기능(화면 키보드의 키 입력 등)은 이 기준에 해당하지 않습니다.
왜 필요한가요
실수로 다른 곳을 눌렀을 때, 손을 떼기 전에 포인터를 밖으로 옮겨 실행을 취소할 수 있어야 합니다. 운동장애가 있는 사용자, 시각장애인, 인지장애가 있는 사용자가 잘못된 동작을 줄일 수 있습니다.
도움받는 사용자
- 운동장애가 있는 사용자(손 떨림, 근력 저하 등)
- 시각장애인(화면낭독기 사용자)
- 저시력 사용자(화면 확대 사용자)
- 인지·학습 장애가 있는 사용자
적용 방법
click이벤트를 사용합니다.click은 누른 뒤 같은 요소 위에서 뗄 때 발생하므로 기본적으로 이 기준을 만족합니다.mousedown,touchstart,pointerdown에서 실행되는 동작을 피합니다.
사례
누르는 순간 실행
deleteBtn.addEventListener('mousedown', deleteItem);클릭(누르고 뗄 때) 실행
deleteBtn.addEventListener('click', deleteItem);자주 하는 실수
mousedown·touchstart에서 페이지 이동, 삭제, 제출을 실행합니다.- 드래그하다 손을 놓는 위치와 관계없이 동작이 실행되고 되돌릴 수 없습니다.
검사 방법
- 버튼·링크를 누른 상태로 포인터를 요소 밖으로 옮긴 뒤 떼어, 동작이 실행되지 않는지 확인합니다.
- 실행된다면 되돌리기 수단이 있는지 확인합니다.