웹 오디오·팟캐스트 플레이어의 키보드 조작성과 텍스트 전사(Transcript) 제공 가이드

오디오북, 뉴스 브리핑 팟캐스트, 강연 음성 스트리밍 등 오디오 콘텐츠는 시각적 피로 없이 귀로 정보를 소비할 수 있는 훌륭한 디지털 미디어입니다. 그러나 많은 웹사이트에서 오디오 플레이어를 자체 제작할 때 커스텀 <div> 태그로 재생 바와 볼륨 슬라이더를 만들면서, 키보드 Tab 키나 방향키로 재생/일시정지 및 탐색(Seek)을 전혀 제어할 수 없게 만드는 치명적인 키보드 접근성 결함을 유발합니다. 또한 소리를 전혀 듣지 못하는 청각장애인이나 시청각 중복 장애인에게 오디오 콘텐츠는 아무런 정보도 얻을 수 없는 거대한 벽입니다. W3C WCAG 2.2 성공 기준 1.2.1(Audio-only and Video-only, Level A)은 사전 녹음된 모든 음성 콘텐츠에 대해 동일한 정보를 담고 있는 '텍스트 대본(Transcript)'을 제공할 것을 법적으로 의무화하고 있습니다. 이 글에서는 접근 가능한 웹 오디오 플레이어 구축과 대본 원고 작성 표준을 상세히 다룹니다.

청각장애인을 위한 텍스트 대본(Transcript)의 필수 요건

음성 전용(Audio-only) 미디어에서 텍스트 대본은 단순한 부가 서비스가 아니라 유일한 정보 대체 수단입니다.

완벽한 접근성을 갖춘 대본은 단순히 등장인물의 대사만을 전사하는 것에 그쳐서는 안 됩니다. 라디오 드라마나 대담 프로그램처럼 화자가 여러 명일 경우 '누가 발언하고 있는지(화자 식별: 진행자, 전문가, 시민)'를 명확히 표기해야 하며, 음악의 분위기([경쾌한 인트로 음악]), 중요한 배경 음향 효과([박수 소리], [웃음 소리], [한숨]), 그리고 핵심적인 음조의 변화([단호한 어조로])를 괄호 기호로 온전히 묘사해야 합니다.

대본의 위치는 오디오 플레이어 바로 하단에 배치되어야 하며, 내용이 긴 경우 <details><summary>오디오 전체 대본 보기</summary>...</details>와 같이 접힘/펼침 요소를 제공하거나 다운로드 가능한 텍스트 파일(.txt, .pdf) 링크를 병행 제공하는 것이 표준적인 실무 관행입니다.

커스텀 오디오 컨트롤의 키보드 조작 표준(WCAG 2.1.1)

HTML5 기본 <audio controls> 태그는 운영체제 수준에서 키보드 탐색을 자체 지원하지만, 디자인 커스텀을 위해 자바스크립트로 직접 플레이어 UI를 제작할 때는 다음 키보드 인터랙션을 필히 바인딩해야 합니다.

• 1. 재생/일시정지: 재생 버튼에 초점이 있을 때 Space 키 또는 Enter 키를 누르면 즉시 토글되어야 합니다.
• 2. 재생 위치 5초 건너뛰기(Seek): 좌우 방향키(ArrowLeft, ArrowRight)를 누르면 재생 시간이 5초씩 앞뒤로 이동해야 합니다.
• 3. 볼륨 조절: 볼륨 슬라이더에 초점이 있을 때 상하 방향키(ArrowUp, ArrowDown)를 누르면 볼륨이 5%씩 증감해야 합니다.
• 4. role='slider'와 aria-valuenow: 재생 진행 바와 볼륨 바에 슬라이더 역할을 부여하고, 현재 재생 시간(초)과 전체 길이를 aria-valuenow, aria-valuemin, aria-valuemax 속성으로 스크린리더에 실시간 노출해야 합니다.

자동 재생(Autoplay)의 절대적 금지(WCAG 1.4.2 Audio Control)

웹페이지에 접속하자마자 사용자의 동의 없이 배경음악이나 팟캐스트가 자동으로 재생되는 것은 웹 접근성에서 가장 엄격하게 금지되는 최악의 안티패턴입니다.

스크린리더를 사용하는 시각장애인은 웹페이지를 탐색하기 위해 스크린리더의 음성 안내를 귀로 들어야 합니다. 그런데 웹페이지에서 난데없이 시끄러운 음악이 재생되면, 스크린리더의 목소리가 묻혀버려 사용자는 정지 버튼을 찾지도 못한 채 패닉에 빠지게 됩니다. WCAG 2.2 성공 기준 1.4.2는 3초 이상 지속되는 오디오 자동 재생을 엄격히 금지하며, 사용자가 명시적으로 재생 버튼을 눌렀을 때만 소리가 시작되도록 규정하고 있습니다.

점자 단말기(Refreshable Braille Display) 사용자를 위한 배려

시청각 중복 장애인(Deafblind)은 소리도 들을 수 없고 화면도 볼 수 없기 때문에 오직 손가락 끝으로 만지는 '점자 디스플레이'에 의존합니다.

점자 단말기는 오디오 파일 자체는 인식하지 못하지만, 웹페이지에 제공된 텍스트 대본은 100% 점자 코드로 변환하여 읽어낼 수 있습니다. 따라서 충실한 대본 원고를 제공하는 것은 세상의 모든 미디어 장벽을 허무는 가장 숭고한 디지털 포용의 실천입니다.