포인터 입력 취소 - by. UXKM

  • A11Y
  • A11y Creation Tech
  • 모바일 접근성 제작 기법
  • 포인터 입력 취소
요약 설명

관련 지침(입력 방식) : 단일 포인터 입력으로 실행되는 기능의 오입력을 취소·중단·되돌릴 수 있는가?
손떨림·큰 손가락·보조 터치 도구 사용자는 의도하지 않은 탭이나 스와이프를 더 자주 겪습니다. 실행 전 확인이나 실행 후 취소 경로가 필요합니다.

모바일 앱 접근성 체크리스트(MACAG) 전체 보기
WCAG 2.2 — Pointer Cancellation

필요성

되돌리기(Undo), 삭제 확인, 슬라이더의 값 복원 등은 치명적 오류를 줄이는 기본 패턴입니다. 제스처가 즉시 반응하는 대신 짧은 유예나 ‘놓을 때 확정’ 패턴을 고려합니다.

대상

  • 파킨슨·떨림이 있는 사용자

    탭이 이중으로 들어가기 쉬운 사용자.

  • 터치 도구 사용자

    손가락 대신 스타일러스·입술 스틱으로 정밀도가 달라지는 사용자.

  • 시각 장애인

    타깃 중심을 맞추기 어려워 인접 버튼을 누르기 쉬운 사용자.

  • 전체 사용자

    이동 중 한 손으로 잘못 누르는 일반적인 실수를 줄이려는 사용자.

체크리스트

  • 업 실행 전 취소

    손가락을 뗄 때까지 실행이 확정되지 않는가?

  • 실행 후 취소

    삭제·전송 등에 실행 취소 스낵바나 되돌리기가 있는가?

  • 중요 동작

    결제·계약에는 확인 단계가 있는가?

  • 드래그 충돌

    맵·캔버스에서 드래그와 탭이 서로 오작동하지 않는가?

구현 시 참고

  • 스와이프로 삭제되는 리스트는 실행 취소 스낵바 등을 제공합니다.
  • 맵·캔버스에서 드래그와 탭이 겹칠 때 히트 영역과 제스처 임계값을 조정합니다.
  • 결제·전송 등 되돌릴 수 없는 동작은 반드시 확인 단계를 둡니다.

점검 방법

  • 의도적으로 살짝 빗겨 탭·빠르게 두 번 탭하는 등 실수 패턴을 재현합니다.
  • 스위치 제어·느린 탭 시뮬레이션에서도 동작이 안전한지 확인합니다.

개발방법

아래 코드는 포인터 입력 취소 검사항목을 실제 UI 동작에 반영할 때 참고할 수 있는 예시입니다. 삭제·전송 같은 동작은 즉시 확정하지 말고 취소/되돌리기 경로를 제공합니다.

네이티브

iOS (Swift)

Android

하이브리드

html

Vue

React

접근성 테스트 도구 활용 점검방법

결론

접근성은 시작은 있지만 끝이 없는 작업입니다.
오류 항목을 정기적으로 점검하여 접근성 개선을 한다면 점차 검사를 할 항목이 줄어들게 될 것입니다. 모두가 차별 없이 서비스를 이용할 수 있도록 접근성 유지를 위한 모두의 노력이 필요합니다. 무엇보다 접근성 작업은 서비스를 제공한다면 선택이 아닌 필수로 지켜야하는 항목임을 잊지 말아야 합니다.

접근성 작업 시 점검 필수사항

  • 접근성 가이드(WCAG, KWCAG, WAI-ARIA) 내용 숙지
  • 접근성 체크리스트 작성
  • 접근성 자동 및 수동 검사(스크린리더) 진행
  • 접근성 검사 툴(Lighthouse Accessibility 등) 활용 오류 항목 개선 및 내용 정리
  • 접근성 사용자 테스트
  • 접근성 정기적인 모니터링