WCAG 2.2 Standards & A11y Audit
웹 콘텐츠 접근성 가이드라인(WCAG)의 최신 수리적 준수 사항을 분석하고, 인터페이스의 물리적 접근 장벽을 체계적으로 검수($Audit$)하여 하이엔드 품질을 확보하는 공학을 다룹니다.
sys.entry
M
Me
hyunyoun's Blog
posts7 min read
1. Overview
WCAG 2.2 표준 및 접근성 심사(WCAG 2.2 Standards & A11y Audit, WAA)는 디지털 정보의 수리적 전달 가능성을 국제적인 '물리적 최저선'에 비추어 검증하고, 모든 사용자의 눈과 귀 하드웨어가 정보를 수용할 수 있는 수치적 권리를 수호하는 '품질 보증 물리학'입니다.
학습자는 정보 인지의 4대 원칙인 **POUR (Perceivable, Operable, Understandable, Robust)**의 수리적 명세와, WCAG 2.2에서 새롭게 추가된 물리적 조작 수순(Focus Appearance 등)을 배웁니다. 특히, 자동화 도구와 수동 검수 수순을 결합하여 접근성 결함 수치를 0에 수렴시키는 심사 방법론을 익힙니다. 이를 통해 기술적 우수성을 넘어 사회적 가치를 수리적 엄밀함으로 증명하는 하이엔드 준거 거버넌스 역량을 확보합니다.
2. Scope & Boundaries
In-Scope
- WCAG 2.2 POUR Framework: 인지 가능성, 운용 가능성, 이해 가능성, 견고성의 수리적 원칙
- Success Criteria (SC) Analytics: 레벨 A, AA, AAA의 수치적 준수 항목 및 물리적 파급력 분석
- A11y Audit Methodology: 자동 스캔, 키보드 검수, 스크린 리더 테스트의 수리적 통합 수순
- Target Size Dynamics: 클릭 영역의 물리적 크기 수치(24x24px 이상 등)에 대한 수리적 최적화
- Compliance Reporting logic: 접근성 수치 미달 지점을 물리적 '재현 경로'와 함께 수리적으로 보고
Out-of-Scope
- 접근성 법률 자문 및 행정적 과태료 산정 (법률 영역)
- 오프라인 물리 건축물의 편의시설 심사 (비컴퓨터 공학 영역)
Boundaries
- WAA vs. UI Testing: 일반 UI 테스트가 '정상 동작 수치'에 집중한다면, WAA는 '비정상적 물리 환경(시각/청각 소실 등)에서의 정보 도달 수치'라는 극한의 하드웨어 조건에 집중하여 구분합니다.
3. Counterexample
- 단순히 "체크리스트 확인하기"라 설명하는 것은 WAA 학습이 아닙니다. 왜 특정 버튼의 수리적 이름( )이 시각적 물리 텍스트와 다를 때 음성 출력 하드웨어에서 수치적 '인지 부조화'가 발생하는지 증명할 수 있어야 하며, Focus Appearance 수치(대비 3<1>1> 이상 등)가 1%만 부족해도 고령 사용자가 현재의 수리적 위치를 유실하는 물리적 붕괴를 논증하지 못한다면 접근성 심사의 본질을 이해하지 못한 것입니다.
4. Prerequisites
- Color Theory & Accessibility Physics (Basic): 12-02-04의 물리적 명도 대비 수치 이해가 필수입니다.
- Universal Design & Assistive Technology (Basic): 12-04-01의 보조 기기 구동 원리 이해가 필수입니다.
5. Learning Map
- The Rule of Law: 전 세계가 약속한 수리적 접근성 표준인 WCAG의 뼈대를 이해합니다.
- POUR Architecture: 정보를 인지하고 조작하는 하드웨어적 일련의 수순을 4대 원칙으로 수리 정립합니다.
- Audit Pipelines: 도구를 사용하여 인터페이스의 물리적 장벽 수치를 정량적으로 수색합니다.
- Zero Barrier: 모든 인간 하드웨어를 수리적으로 포용하는 하이엔드 무장벽 공간을 완성합니다.
6. Learning Topics
Basic
Core: WCAG 2.2와 POUR 원칙 (Compliance Physics)
- Why to Learn: 접근성은 선택이 아닌 수리적 인권이므로, 국제적으로 통용되는 물리적 준수 기준을 명확히 알기 위해서입니다.
- What to Learn:
- Perceivable: 정보와 UI 수치를 사용자가 물리적으로 지각할 수 있게 제공
- Operable: 모든 수리적 기능을 물리적으로 운용 가능하게 설계 (키보드 등)
- Understandable: 정보의 이해 수순이 직관적이고 예측 물리적으로 흐름
- Robust: 미래의 다양한 수리적 환경(AT)에서도 안정적으로 구동
- How to Learn:
- WCAG 2.2의 신규 추가 항목 (Drag, Target Size 등)의 수리적 명세를 읽고 물리적 사례 분석 실습
- 레벨 AA 준수 여부에 따라 서비스의 수리적 보편성이 물리적으로 얼마나 확장되는지 대조 연구
- Implement: POUR 원칙에 따른 인터페이스 물리 자가 진단 기초
POUR_Checklist
Recommended
Core: 가시성 및 조작 수치 준수 (Visibility Dynamics)
- Why to Learn: 시각이나 조작 능력이 평균 수치 이하인 사용자도 하이엔드 실수를 범하지 않게 돕기 위함입니다.
- What to Learn:
- Target Size (SC 2.5.8): 버튼의 물리적 최소 면적 수치(24x24 CSS pixels) 확보
- Focus Appearance (SC 2.4.11): 현재 수리적 포커스 위치의 물리적 가시성 강화
- Consistent Help: 도움말이나 연락처 수치의 물리적 위치를 수리적으로 고정
- How to Learn:
- 모바일 하드웨어 뷰포트에서 버튼 간격 수치를 4px로 줄였을 때, 수리적 오터치 물리 확률 분석 실습
- Focus Visible 상태의 아웃라인 수치를 제거했을 때 키보드 사용자가 느끼는 물리적 '조작 미궁' 현상 확인
- Implement: 화면 내 모든 상호작용 개체의 물리적 크기 수치를 검수하는
Hit_Area_Checker
Practical
Core: 접근성 심사 공정과 도구 (Audit Mechanics)
- Why to Learn: 주관적 감각이 아닌 객관적 수치 데이터로 서비스의 물리적 접근성을 증명하기 위해서입니다.
- What to Learn:
- Automated Scanning: Lighthouse, Axe-core 등 수리적 구문 오류 자동 탐색
- Manual Inspection: 키보드 트래킹 및 스크린 리더 음성 수치 전수 검사
- Assistive Technology Simulation: 다양한 물리적 제약 조건을 수리적으로 모사하고 대응
- How to Learn:
- Axe-core 라이브러리를 프로젝트에 심고, 빌드 타임에 접근성 수치 미달을 물리적으로 '블락'하는 실습
- Screen Reader의 수리적 출력 윈도우(Speech Viewer)를 보며 물리적 텍스트와 음성 수치의 일치성 검증 훈련
- Implement: 전체 웹 도메인의 접근성 위반 수치를 일괄 산출하여 리포트하는
A11y_Audit_Dashboard
Advanced
Core: 하이엔드 접근성 거버넌스 및 인증 (Advanced Governance)
- Why to Learn: 법적 준수를 넘어 사용자 경험의 물리적 품질 자체를 상향 평준화하고 접근성 인증 수치를 획득하기 위함입니다.
- What to Learn:
- VPAT (Voluntary Product Accessibility Template): 제품의 접근성 수리 명세를 물리적으로 공표하는 표준 양식
- Accessible Interaction Design Patterns: 복잡한 수리 데이터(차트 등)의 물리적 접근성 구현 패턴
- Performance-A11y Synergy: 하드웨어 전송 지연 수치를 줄이는 것이 접근성에 미치는 물리적 영향
- How to Learn:
- 복잡한 데이터 시각화 수치를 텍스트 테이블로 물리 병렬 구현하여 모든 사용자가 수리 정보를 취득하게 만드는 실습
- KWCAG(한국형 접근성 표준)와 WCAG의 수치적 차이를 분석하고 물리적 적용 범위를 수리 결정하는 프로젝트
- Implement: 특정 UI 패턴의 접근성 완성도 수치를 WCAG 기준으로 정량화하는
Compliance_Scorer
7. Terminology
8. References
Primary
- [P1] CS2023 - Human-Computer Interaction (HCI) - Universal Design — Academic curricula.
- [W3C: WCAG 2.2 Quick Reference] — The complete list of success criteria.
Secondary
- [Inclusive Design Patterns] Heydon Pickering — Practical code for robust components.
- [A11y Project] — Comprehensive community patterns and checklists.
Industry
- [Google Lighthouse: Accessibility Category] — Automated auditing instrumentation.
- [Apple: Accessibility for Developers] — High-end OS-level audit standards.
9. Final Checklist
Primary
- WCAG 2.2의 'POUR' 원칙이 어떻게 사용자의 물리적 '정보 주권'을 수리적으로 수호하는지 논증 가능한가? (P1)
- 'Target Size' 수치 미달이 운동 장애가 있는 사용자의 물리적 '과업 완수율' 수치를 어떻게 파괴하는지 기술할 수 있는 가? (P1)
Secondary
- '자동 검수' 도구가 발견하지 못하는 수리적 '논리 오류'를 물리적인 '수동 검수'로 어떻게 보완할지 소통 가능한가?
- Focus Appearance 수치를 강화하여 고주사율 하드웨어에서도 포커스 수치 이동을 물리적으로 추적할 수 있게 할 수 있는 가?
Industry
- 실무 서비스의 접근성 심사 보고서(VPAT) 작성 시, 수리적 결함의 '심각도' 수치를 물리적 파급력에 따라 제안할 수 있는 가? (SFIA)
- Screen Reader Audit 수치 분석을 통해 데이터 그리드 내의 수리적 요약 정보가 물리적으로 누락되었는지 진단할 수 있는 가?