TeamWicked Design System / 기초

접근성·키보드

WCAG 2.2 AA를 목표 기준으로 삼되, 검증되지 않은 준수 주장을 하지 않습니다.

적용 범위: TeamWicked 자체 브랜드·웹사이트. 호스팅 제품의 외형은 포함하지 않습니다. 공통 동작 규칙을 재사용하며, 다른 체계의 사례는 비교 근거일 뿐 스타일 상속이 아닙니다.

목표와 현재 상태

신규·변경 범위의 목표는 WCAG 2.2 AA입니다. 이것은 세 운영 사이트의 인증·준수 선언이 아닙니다. 소스 검사, 자동 검사, 키보드·화면 낭독기 수동 검사, 실제 업무 경로 증거가 별도로 필요합니다.

  • A11Y-01 MUST: 모든 기능을 키보드로 조작 가능하게 하고, Tab 순서는 시각적 작업 순서와 맞춥니다. 양수 tabindex로 순서를 수리하지 않습니다.
  • A11Y-02 MUST: 포커스를 보이게 하고 고정 UI 뒤에 완전히 가리지 않게 합니다.
  • A11Y-03 MUST: 버튼·링크·입력은 가능한 한 네이티브 의미 요소를 사용하고 이름·역할·상태를 제공합니다.
  • A11Y-04 MUST: 입력마다 영구 라벨과 필요한 설명을 연결합니다. placeholder는 라벨이 아닙니다.
  • A11Y-05 MUST: 오류 필드는 aria-invalid와 해당 오류의 aria-describedby 관계를 제공합니다.
  • A11Y-06 MUST: 동적 결과는 문맥에 맞는 status/alert로 알리되 중복 낭독을 줄입니다.
  • A11Y-07 MUST: 모달은 초기 포커스·포커스 제한·닫기·복귀를 정의합니다. 문맥이 제거됐다면 논리적인 다음 위치로 복귀합니다.
  • A11Y-08 MUST: 드래그에는 클릭/버튼/키보드 대안을 제공합니다.
  • A11Y-09 MUST: 로그인에서 붙여넣기·자동완성·비밀번호 관리자를 불필요하게 막지 않습니다.
  • A11Y-10 MUST: 확대·reflow·대비·대상 크기 기준은 색상, 레이아웃을 함께 적용합니다.

위젯별 키보드 계약

요소 기본 조작
버튼 Enter / Space
링크 Enter, 브라우저 기본 동작 유지
체크박스·스위치 Space
라디오 방향키 이동·선택, 그룹 진입/이탈 Tab
메뉴 방향키, Enter, Escape
탭 방향키로 탭 이동; 활성화 방식 명시
모달 내부 Tab 순환, 닫기 후 호출 위치
트리 방향키 계층 이동, 펼침/접힘

선택한 제품 라이브러리의 실제 동작을 검증하고 다른 위젯 역할을 임의로 혼합하지 않습니다.

체크리스트

키보드만으로 주문·서버 탐색·티켓 작성 초안까지 접근하는 경로를 검토합니다. 실제 결제·고객 기록 생성은 승인된 테스트 환경에 한합니다. NVDA/VoiceOver 중 사용한 도구와 버전을 검증 기록에 남깁니다. 자동 검사 통과가 수동 검사 대체는 아닙니다.

외부 기준: WCAG 2.2, ARIA APG.

출처와 적용 범위

원본 확인 범위와 운영 적용 여부를 구분합니다. 실행형 예제의 동작 확인은 모든 운영 화면의 접근성 검증을 의미하지 않습니다.

Markdown 원본 다운로드