Reference
Accessibility
레이블, 키보드, 포커스, 대비, 모션 구현 기준을 정리합니다.
공통 계약
- 버튼과 입력 요소에는 접근 가능한 이름을 제공합니다. 키보드로 접근할 수 있고 현재 포커스가 보여야 합니다.
- Field는 레이블, 설명, 오류 메시지를 입력 요소의 id와 ARIA 속성으로 연결합니다.
- Dialog와 Sheet는 열린 동안 포커스를 내부에 유지하고, 닫으면 열기 버튼으로 돌려보냅니다.
- 상태를 색상만으로 구분하지 않고 텍스트나 의미 있는 아이콘을 함께 제공합니다.
- 터치 화면에서는 주요 조작 영역을 최소 44px로 확보합니다.
- 사용자가 움직임 줄이기를 설정하면 장식적인 이동과 반복 애니메이션을 제거합니다.
사용 기준
권장하는 사용
- 컴포넌트의 HTML 의미와 ARIA 관계를 유지하고 제품 흐름에서 이름, 오류, 키보드 동작을 검사합니다.
피해야 할 사용
- 겉모양만으로 사용을 결정하지 마세요.
- 의미와 키보드 동작, 모바일에서의 흐름을 함께 확인하세요.