
프론트엔드
드래그 앤 드롭은 사실 편한 UX가 아니다?
두줄요약
드래그 앤 드롭 순서 변경 기능을 접근성 관점에서 재설계한 사례를 소개했습니다. 스크린 리더, 초점 이동, ARIA 적용과 디바이스별 대응 방법도 함께 정리했습니다.
핵심 내용
- 드래그 앤 드롭이 모든 사용자에게 편한 UX는 아니며, 장애가 있는 사용자에게는 순서 변경 기능 자체가 불편할 수 있는 접근성 문제
- 토스뱅크의 나눠모으기 통장 순서 변경 기능에서 디자이너, 접근성 컨설턴트, 개발자가 협업해 드래그 조작과 탭 조작을 함께 설계
- aria-pressed, aria-label, aria-live, focus 이동, title, disabled 처리 등으로 스크린 리더와 키보드/터치 환경의 사용성을 보완
- iOS, Android, 브라우저별 차이와 접근성 버그를 검증하며 role, tab order, alt, label, fieldset, ARIA 같은 기본 접근성 요소도 함께 정리
적용해볼 점
- 순서 변경 같은 단순 기능도 초점 이동과 상태 안내를 포함해 접근성 기준으로 다시 점검
- 기본적인 lang, role, alt, label, tabindex, aria 속성을 서비스 전반에 체계적으로 적용