현재 페이지 위치

Home> 광장> 널리 블로그> 상세보기

목록이전 글 보기279/341다음 글 보기

추천하기
추천 횟수 :1
조회수
2,688
공유하기
페이스북으로 공유하기페이스북 공유 횟수 :0트위터로 공유하기트위터 공유 횟수 :0

Html lang 속성과 스크린리더

접근성

안녕하세요, 엔비전스입니다.


한국형 웹 콘텐츠 접근성 지침(KWCAG) 2.1에는 웹페이지의 head 요소 안에 페이지의 기본 언어 선언을 규정하고 있습니다(항목 7.1.1 참조). 익히 아시는 바와 같이 언어는 ‘lang’ 속성으로 선언합니다. 접근성 지침에서 설명하고 있듯이 기본 언어 선언이 중요한 이유는 자동 언어 전환 기능을 지원하는 스크린리더가 선언된 언어에 해당하는 TTS로 자동으로 전환함으로 콘텐츠를 자연스럽게 출력하도록 하기 위해서입니다.


또한 필요에 따라 웹페이지의 기본 언어 선언과는 상관 없이 페이지의 특정 영역 언어를 lang 속성으로 변경해줄 수 있습니다. 그리하여 웹페이지 중간에 제공되는 다른 언어 콘텐츠를 더 자연스럽게 이용하도록 지원합니다. 그러나 lang 속성을 잘못 마크업하는 경우 스크린리더 설정에 따라 페이지의 텍스트를 읽지 못할 수 있습니다.


이번 아티클에서는 페이지의 기본 언어 선언과 웹페이지 특정 구역의 기본 언어와는 다른 언어가 선언되었을 때 스크린리더에 미치는 영향을 살펴보겠습니다. 그리고 스크린리더 사용자는 어떤 설정을 통해 lang 속성값에 따른 자동언어 변경 기능을 활용할 수 있는지 알아보겠습니다.


주요 스크린리더에서의 읽기 처리 방식

스크린리더는 TTS 엔진 드라이버를 활용하여 화면의 정보를 출력하게 됩니다. TTS 엔진 드라이버에는 센스리더에서 주로 사용하는 VoiceText, 내레이터에서 사용하는 sapi5를 포함하여 Vocalizer, Acapella, RealSpeakSoloDirect 등 다양한 종류가 있습니다.


1. 하나의 TTS 엔진에는 여러 언어의 음성들이 포함되어 있으며 각 TTS 엔진마다 포함된 언어가 다릅니다. 예를 들어 iVona 음성엔진 안에는 한국어는 포함되어 있지 않습니다.


2. 한 언어 TTS 엔진은 특성에 따라 영어와 같이 한 언어 데이터만 가진 경우도 있고 두 개 이상의 언어 데이터를 한 음성이 가지고 있는 경우도 있습니다. 실례로 한국어 음성엔진의 경우 한국어 데이터뿐만 아니라 영어 발음기호 데이터도 함께 가지고 있어서 발음이 자연스럽지는 않지만 영문 텍스트를 읽을 수 있습니다. 그러나 영어 음성은 일반적으로 한 언어 데이터만 가지고 있어서 한글을 읽지 못 합니다.


3. 특정 TTS 엔진이 언어(한국어 등)을 지원한다 하더라도 음성엔진이 가지고 있는 발음 데이터에 따라 출력하는 방식이 달라집니다. 예를 들어 Vocalizer 드라이버의 Yuna 한국어 TTS에는 한자 데이터가 들어 있지 않습니다. 따라서 Yuna TTS로 한자를 읽을 수 없습니다.


4. 스크린리더와 음성엔진 컨트롤러에서는 이러한 문제점을 해결하기 위하여 발음 사전, 문장부호 선택, 한자사전 테이블 등을 지원합니다. 그것은 스크린리더가 자체적으로 모든 기능을 컨트롤하는 경우도 있고(센스리더) 음성엔진 드라이버와 기능을 나누어하는 경우(NVDA), 혹은 안드로이드의 보컬라이저와 같이 음성엔진 드라이버에서 컨트롤하는 경우도 있습니다.


이것은 html의 language 속성을 처리하는 방식에도 영향을 미칩니다. Language 속성을 지원한다는 것은 위에 언급한 것과 같이 선언된 언어에 맞는 TTS 엔진으로 자동 전환되어 좀 더 자연스러운 언어로 텍스트를 음성 출력한다는 것입니다.


자동언어 전환의 장단점

영어나 일본어 등의 텍스트가 있을 때 자동으로 언어를 전환하여 출력하면 기술했듯이 해당하는 언어의 발음으로 정확하게 텍스트를 들을 수 있습니다. 이는 한국어 음성의 영어 음성데이터와 같이 주 언어가 아닌 언어 데이터는 발음이 자연스럽지 않기 때문입니다. 그러나 단점도 있습니다. 영문과 한글이 많이 혼합된 텍스트에서 lang 속성을 남용해서 언어가 수시로 전환되면 한 음성으로 읽는 것보다는 음성이 전환되는 시간으로 인해 텍스트를 완독하기까지 딜레이가 발생합니다. 또한 스크린리더에 따라 언어별 음성 속도를 다르게 분리 조절하는 기능을 지원하지 않아 각 언어의 숙년도 차이로 인한 이해의 어려움을 겪을 수 있습니다. 이런 이유로 사용자는 일반적으로 상황에 따라 자동언어 전환을 온 오프 하며 사용합니다.


웹 페이지에서의 언어 전환 방식

언어 전환 방식은 크게 3가지 정도로 나누어볼 수 있습니다.


1. Html 마크업과 상관없이 각 나라별 음성으로 자동으로 전환하는 방식입니다. 안드로이드의 Auto Tts 애플리케이션이 이러한 방법을 사용하고 있습니다.


2. html에서 선언된 언어에 따라 해당하는 언어 음성으로 바뀌는 방식입니다. NVDA, JAWS, 센스리더, iOs VoiceOver 등이 이 기능을 지원하고 있으며 NVDA는 보컬라이저, JAWS는 보컬라이저와 SAPI 음성엔진, 센스리더는 VoiceText와 Sapi 음성엔진 등에서 이러한 기능을 지원합니다.


3. OSX의 보이스오버와 같이 자동언어를 지원하지 못하는 스크린리더도 있습니다.


[Tip] Android에서 자동언어전환 기능 사용하기(Auto Tts)

HTML의 lang 속성 내용에 약간 벗어나지만, 스크린리더 자동언어 전환과 연관성이 있기에 안드로이드용 애플리케이션인 Auto TTS에 대해 잠시 소개해 드리도록 하겠습니다. 안드로이드의 톡백 스크린리더는 자동언어전환을 지원하지 않습니다. 이런 단점을 보완하기 위해 [Auto TTS] 애플리케이션이 개발되었습니다.(현재는 베타 버전이며 안타깝게도 구글 계정이 한국어로 되어 있을 경우에는 다운로드 받을 수 없습니다.)

Auto TTS는 우선 사용자 단말기에 사용자가 원하는 각 언어에 해당하는 TTS 엔진이 설치되어야 합니다. 그 다음 애플리케이션에서 사용하는 언어에 해당하는 TTS 엔진을 연결하면 위 섹션에서 기술한 것처럼 문자에 따라 자동으로 각 언어 TTS가 출력됩니다. 구체적인 접근 경로는 애플리케이션을 실행한 다음 Auto Language Detect를 선택하고 전환을 원하는 언어와 음성을 지정해 주십시오. 참고로 한 TTS 엔진 드라이버에서 여러 언어 음성을 지정하는 것보다 각각의 언어를 다른 TTS 엔진 드라이버에서 선택해 주면 음성 전환 속도가 훨씬 빠릅니다.


언어 속성 마크업 오류시 해결 방법

지금까지 설명한 것을 최종 정리해 보겠습니다.


1. Html head 요소에 한국어 언어를 명시한 경우 언어 명시에 따라 음성엔진이 바뀌는 스크린리더에서는 영어를 포함한 모든 글자를 한국어 음성으로 읽습니다.


2. Head 요소에 언어를 영어로 명시한 웹페이지에서 중간에 한글이 나올 경우에는 스크린리더는 주 언어가 영어이므로 영어 음성엔진으로 한글을 읽으려고 시도합니다. 그러나 영어 음성엔진에는 한글 데이터가 없으므로 중간의 한글 문장 등은 전혀 읽을 수 없으며 이를 읽기 위해서는 스크린리더 사용자가 수동으로 언어 자동 읽기를 해제하여 한국어 음성으로 읽도록 설정해 주어야 합니다.


위의 문제를 해결하기 위해서는 주 언어가 한글이고 중간에 영어가 나오는 것은 큰 문제가 없으나 영문 페이지에 한글이 섞여 나오거나 혹은 한글 페이지에 일본어, 중국어와 같은 글자가 함께 있을 경우에는 해당되는 문단에 그에 해당하는 lang 속성을 추가하여 이를 해결할 수 있습니다. 그렇게 되면 앞에서 설명한 것처럼 스크린리더는 그 언어에 해당하는 음성엔진을 찾을 것이고 만약 사용자의 컴퓨터에 그 음성엔진이 없다면 어쩔 수 없이 기본 음성엔진으로 그 문장을 읽게 될 것입니다.


센스리더로 자동언어 전환 테스트하기

마지막으로 센스리더로 자동언어 전환을 테스트하는 방법을 설명합니다.


1. 센스리더의 자동언어전환은 프로페셔널 버전 이상에서 동작합니다.


2. 현재는 영어와 일본어의 경우에만 자동언어 전환이 됩니다.


3. 인터넷 익스플로러 내에서 가상 커서 설정을 호출한 후(ctrl + shift + f9) ‘언어 변경 시 엔진 변경’을 체크합니다.


4. 센스리더 제어메뉴(ctrl + backslash)를 호출한 후 일반 > 보조음성엔진 선택에서 각 언어에 맞는 보조음성을 선택해 줍니다. 당연한 이야기이겠지만 각 언어에 대한 음성엔진이 컴퓨터에 설치되어 있어야 합니다.


5. Keypad insert + e키를 눌러 보조 음성엔진을 자동으로 설정합니다.


설정을 다 마쳤다면 웹페이지에 들어가 키보드로 웹페이지 탐색 시 마크업 된 언어 속성에 맞게 음성으로 출력하게 됩니다. [샘플 페이지]에 들어가셔서 테스트해보실 수 있습니다.


댓글보기

전체 댓글
0
로그인

댓글이 없습니다.

목록이전 글 보기279/341다음 글 보기

공유하기
페이스북으로 공유하기페이스북 공유 횟수 :0트위터로 공유하기트위터 공유 횟수 :0