5.2.1 자막 또는 수어

요구 사항

오디오 또는 비디오를 포함한 멀티미디어 콘텐츠에는 동등한 내용의 자막 또는 수어를 제공해야 하며, 생방송 멀티미디어 콘텐츠에도 제공해야 합니다. 다음 중 한 가지 이상을 제공합니다.

• 자막 — 재생할 때 동기화된 자막을 화면에 표시할 수 있어야 하며, 음성(대사)과 동등한 내용을 전달해야 합니다.
• 수어 — 비디오에 수어를 포함해 제공해도 이 항목을 준수한 것으로 봅니다. 수어도 음성(대사)과 동등한 내용이어야 합니다.

개정 내역: 강화 — 2016판 「5.2 자막, 수화 등의 제공」

WCAG 대응표에서는 사전 녹화 자막(1.2.2)뿐 아니라 실시간 자막(1.2.4)과 수어(1.2.6)까지 이 항목에 대응시킵니다.

왜 필요한가요

청각장애인은 자막과 수어로 음성·음향 정보에 접근할 수 있습니다. 자막은 시끄럽거나 소리를 켤 수 없는 환경, 외국어 학습에도 유용하며 영상 내용의 검색과 색인을 쉽게 해 줍니다.

도움받는 사용자

• 농인·난청인 등 청각장애인
• 소리를 켤 수 없는 환경(대중교통, 사무실)의 사용자
• 외국어 사용자

적용 방법

플랫폼 기본 플레이어의 자막 트랙 기능을 활용하고, 사용자가 자막을 켜고 끌 수 있게 합니다. 운영체제의 자막 설정(Android 자막 환경설정, iOS 자막 및 청각 장애인용 자막)을 존중하면 글자 크기·색을 사용자가 바꿀 수 있습니다.

// Media3 ExoPlayer: 자막(WebVTT) 트랙 추가
val subtitle = MediaItem.SubtitleConfiguration.Builder(Uri.parse(vttUrl))
    .setMimeType(MimeTypes.TEXT_VTT)
    .setLanguage("ko")
    .setSelectionFlags(C.SELECTION_FLAG_DEFAULT)
    .build()
val item = MediaItem.Builder()
    .setUri(videoUrl)
    .setSubtitleConfigurations(listOf(subtitle))
    .build()
player.setMediaItem(item)

// AVPlayerViewController는 HLS 자막 트랙과 시스템 자막 설정을 자동으로 지원합니다.
let vc = AVPlayerViewController()
vc.player = AVPlayer(url: hlsURL)   // 자막(WebVTT) 트랙이 포함된 HLS
// 사용자가 시스템에서 자막을 켰는지 확인
let wantsCaptions = UIAccessibility.isClosedCaptioningEnabled

// react-native-video: 외부 자막 트랙
<Video
  source={{ uri: videoUrl }}
  textTracks={[{ title: '한국어', language: 'ko', type: 'text/vtt', uri: vttUrl }]}
  selectedTextTrack={{ type: 'language', value: 'ko' }}
/>

사례

[▶ 재생] [CC 자막: 한국어 ▾] [음량]
자막 트랙: ko.vtt (대사 + "(문 닫히는 소리)" 같은 효과음 설명 포함)

제품 소개 영상 (자막 없음, 수어 없음)

자주 하는 실수

• 대사가 있는 영상에 자막도 수어도 제공하지 않습니다.
• 자막이 대사 일부만 담거나 음성과 시점이 맞지 않습니다.
• 실시간 방송(라이브 커머스 등)에 자막이나 수어 통역이 없습니다.
• 자막 켜기 버튼이 레이블 없이 아이콘만 있어 화면낭독기 사용자가 찾을 수 없습니다.

검사 방법

• 앱 안의 모든 동영상·오디오 콘텐츠 목록을 만들고 각각 자막 또는 수어가 있는지 확인합니다.
• 자막 내용이 대사와 동등한지, 음성과 동기화되는지 확인합니다.
• 생방송 콘텐츠에 실시간 자막 또는 수어가 있는지 확인합니다.
• 자막 켜기/끄기 컨트롤이 TalkBack·VoiceOver로 조작 가능한지 확인합니다.

다른 지침의 대응 항목