# [[Accessibility Compliance (WCAG)]] ## πŸ“Œ Brief Summary μ ‘κ·Όμ„± μ€€μˆ˜(Accessibility Compliance)λŠ” μ‹œκ°, 청각, μš΄λ™, 인지 μž₯μ• κ°€ μžˆλŠ” μ‚¬μš©μžλ₯Ό ν¬ν•¨ν•œ λͺ¨λ“  μ‚¬λžŒμ΄ λ””μ§€ν„Έ μžμ‚°μ— λ™λ“±ν•˜κ²Œ μ ‘κ·Όν•˜κ³  μ›ν™œν•˜κ²Œ μ‚¬μš©ν•  수 μžˆλ„λ‘ μ›Ήμ‚¬μ΄νŠΈλ₯Ό μ„€κ³„ν•˜λŠ” 것을 μ˜λ―Έν•©λ‹ˆλ‹€ [1, 2]. 이λ₯Ό λ‹¬μ„±ν•˜κΈ° μœ„ν•œ 기술적 ν‘œμ€€μΈ WCAG(Web Content Accessibility Guidelines)λŠ” μ΅œμ‹  법적 및 UX μš”κ΅¬ 사항을 μΆ©μ‘±ν•˜κΈ° μœ„ν•œ 핡심 κΈ°μ€€μœΌλ‘œ μ μš©λ©λ‹ˆλ‹€ [3]. ν˜„λŒ€ μ›Ή κ°œλ°œμ—μ„œ μ΄λŠ” λ‹¨μˆœν•œ 법적 의무λ₯Ό λ„˜μ–΄ 포용적이고 ν–₯μƒλœ μ‚¬μš©μž κ²½ν—˜(UX)κ³Ό 검색 μ—”μ§„ μ΅œμ ν™”(SEO)λ₯Ό λ‹¬μ„±ν•˜κΈ° μœ„ν•œ ν•„μˆ˜μ μΈ μ›Ή λ””μžμΈ λͺ¨λ²” μ‚¬λ‘€λ‘œ ν‰κ°€λ©λ‹ˆλ‹€ [1, 4, 5]. ## πŸ“– Core Content * **WCAG의 4λŒ€ 핡심 원칙 (POUR):** WCAGλŠ” 인식성(Perceivable), μš΄μš©μ„±(Operable), 이해성(Understandable), 견고성(Robust)μ΄λΌλŠ” λ„€ κ°€μ§€ 핡심 원칙을 기반으둜 κ΅¬μΆ•λ˜μ–΄ μžˆμŠ΅λ‹ˆλ‹€ [6-8]. * **인식성:** λΉ„ν…μŠ€νŠΈ μ½˜ν…μΈ (이미지, λ²„νŠΌ λ“±)에 λŒ€ν•œ λͺ…ν™•ν•œ λŒ€μ²΄ ν…μŠ€νŠΈ(alt text) 제곡, λ©€ν‹°λ―Έλ””μ–΄λ₯Ό μœ„ν•œ μΊ‘μ…˜ 및 μ˜€λ””μ˜€ μ„€λͺ…, μ‹œλ ₯ μ €ν•˜ μ‚¬μš©μžλ₯Ό μœ„ν•œ μ΅œμ†Œ 4.5:1(일반 ν…μŠ€νŠΈ κΈ°μ€€)의 색상 λŒ€λΉ„ λΉ„μœ¨μ΄ μš”κ΅¬λ©λ‹ˆλ‹€ [9-12]. * **μš΄μš©μ„±:** λͺ¨λ“  μƒν˜Έμž‘μš© μš”μ†Œμ™€ λ‚΄λΉ„κ²Œμ΄μ…˜μ€ 마우슀 없이 ν‚€λ³΄λ“œλ§ŒμœΌλ‘œ μ ‘κ·Όν•˜κ³  μž‘λ™ν•  수 μžˆμ–΄μ•Ό ν•©λ‹ˆλ‹€ [9, 12, 13]. * **이해성:** λͺ…ν™•ν•˜κ³  μΌκ΄€λœ λ‚΄λΉ„κ²Œμ΄μ…˜μ„ μ œκ³΅ν•˜λ©°, 인증 κ³Όμ •μ—μ„œ κ³Όλ„ν•œ κΈ°μ–΅λ ₯을 μš”κ΅¬ν•˜λŠ” λ³΅μž‘ν•œ CAPTCHAλ₯Ό ν”Όν•΄μ•Ό ν•©λ‹ˆλ‹€ [14-17]. * **견고성:** 슀크린 리더 λ“± λ‹€μ–‘ν•œ 보쑰 기술이 동적 μ½˜ν…μΈ μ˜ λ§₯락을 μ •ν™•νžˆ 이해할 수 μžˆλ„λ‘ ARIA(Accessible Rich Internet Applications) μ—­ν•  및 라벨을 μ½”λ“œ λ ˆλ²¨μ—μ„œ κ΅¬ν˜„ν•΄μ•Ό ν•©λ‹ˆλ‹€ [9, 12]. * **WCAG 2.2 μ΅œμ‹  μ—…λ°μ΄νŠΈ:** 2023년에 λ°œν‘œλœ WCAG 2.2λŠ” 인지, ν•™μŠ΅, μš΄λ™ μž₯μ• λ₯Ό κ°€μ§„ μ‚¬μš©μžμ™€ λͺ¨λ°”일 κΈ°κΈ° μ‚¬μš©μžλ₯Ό μœ„ν•œ 기쀀을 λŒ€ν­ κ°•ν™”ν–ˆμŠ΅λ‹ˆλ‹€ [18]. μ£Όμš” μ—…λ°μ΄νŠΈλ‘œλŠ” 포컀슀 ν‘œμ‹œκ°€ λ‹€λ₯Έ μš”μ†Œμ— κ°€λ €μ§€μ§€ μ•Šλ„λ‘ ν•˜λŠ” 'Focus Not Obscured', λ³΅μž‘ν•œ λ“œλž˜κ·Έ λ™μž‘μ˜ λŒ€μ•ˆμ„ μ œκ³΅ν•˜λŠ” 'Dragging Movements', 생체 인식 λ“± κΈ°μ–΅λ ₯에 μ˜μ‘΄ν•˜μ§€ μ•ŠλŠ” λ‘œκ·ΈμΈμ„ ꢌμž₯ν•˜λŠ” 'Accessible Authentication', 반볡적인 데이터 μž…λ ₯을 μ€„μ΄λŠ” 'Redundant Entry' 등이 μžˆμŠ΅λ‹ˆλ‹€ [14, 15, 19, 20]. * **λΉ„μ¦ˆλ‹ˆμŠ€ 및 μ›Ή μ•„ν‚€ν…μ²˜μ— λ―ΈμΉ˜λŠ” 영ν–₯:** 접근성을 μ€€μˆ˜ν•˜μ§€ μ•Šμ„ 경우 ADA(λ―Έκ΅­), EAA(유럽) λ“± κ·œμ •μ— λ”°λ₯Έ 법적 μ†Œμ†‘ 및 λΈŒλžœλ“œ ν‰νŒ μ†μƒμ˜ μœ„ν—˜μ΄ ν½λ‹ˆλ‹€ [21, 22]. 반면, λ””μžμΈ 단계뢀터 μ ‘κ·Όμ„± 원칙을 ν†΅ν•©ν•˜λ©΄ 고령자 및 μΌμ‹œμ  μž₯μ• κ°€ μžˆλŠ” μ‚¬μš©μžλ₯Ό μ•„μš°λ₯΄λŠ” 넓은 도달 λ²”μœ„λ₯Ό 확보할 수 있으며, κ΅¬μ‘°ν™”λœ μ½”λ“œλ‘œ 인해 SEO μ„±λŠ₯이 ν–₯μƒλ˜κ³  μ „λ°˜μ μΈ μ‚¬μš©μž μ΄νƒˆλ₯ μ΄ κ°μ†Œν•©λ‹ˆλ‹€ [4, 5, 23]. * **κ΅¬ν˜„ 및 ν…ŒμŠ€νŠΈ μ „λž΅:** 접근성은 개발 μ™„λ£Œ ν›„ λ§λΆ™μ΄λŠ” 것이 μ•„λ‹ˆλΌ μ΄ˆκΈ°λΆ€ν„° ν†΅ν•©λ˜μ–΄μ•Ό ν•©λ‹ˆλ‹€ [24, 25]. μžλ™ν™” 검사 도ꡬ(Axe, WAVE λ“±)의 μ‚¬μš©λΏλ§Œ μ•„λ‹ˆλΌ, 슀크린 리더(NVDA, JAWS)λ₯Ό ν™œμš©ν•œ μˆ˜λ™ ν…ŒμŠ€νŠΈμ™€ ν‚€λ³΄λ“œ 탐색 검증을 톡해 μ‹€μ§ˆμ μΈ μ ‘κ·Όμ„± 결함을 μ°Ύμ•„ ν•΄κ²°ν•΄μ•Ό ν•©λ‹ˆλ‹€ [9, 26, 27]. ## πŸ”— Knowledge Connections - **Related Topics:** [[User-Centered Design]], [[Search Engine Optimization (SEO)]], [[Frontend Performance Checklist]] - **Projects/Contexts:** [[EAA (European Accessibility Act) 2025 Compliance]], [[Modern Web Design Best Practices 2025]] - **Contradictions/Notes:** μ›Ήμ‚¬μ΄νŠΈμ— ν”ŒλŸ¬κ·ΈμΈ ν˜•νƒœλ‘œ μΆ”κ°€λ˜μ–΄ 즉각적인 μ ‘κ·Όμ„± 해결을 μ•½μ†ν•˜λŠ” "μ ‘κ·Όμ„± μ˜€λ²„λ ˆμ΄(Accessibility Widgets)" 도ꡬ듀은 μ‹€μ œλ‘œλŠ” 근본적인 μ ‘κ·Όμ„± 및 법적 κ·œμ • μ€€μˆ˜ 문제λ₯Ό μ™„μ „νžˆ ν•΄κ²°ν•˜μ§€ λͺ»ν•˜λ©°, 였히렀 μ ‘κ·Όμ„± κ΄€λ ¨ 법적 μ†Œμ†‘μ˜ νƒ€κ²Ÿμ΄ λ˜λŠ” κ²½μš°κ°€ λ§Žμ•„ 근본적인 μ½”λ“œ μˆ˜μ€€μ˜ κ°œμ„ (Remediation)이 ν•„μˆ˜μ μž…λ‹ˆλ‹€ [28, 29]. --- *Last updated: 2026-04-26*