슬라이드 1 : 
안녕하십니까,
모바일 애플리케이션, 접근성 진단 컨설팅 및, 품질심사 시범 사업에 참여해 주신 여러분들께, 진심으로 감사의 말씀을 드립니다. 
본 영상은, 모바일 애플리케이션 접근성 지침에 대한 진단 방법을, 알기 쉽게 설명한 영상으로, 자가 진단을 통해 문제를 정확하게 파악할 수 있도록, 안내해 드리는 영상입니다.
이 영상을 활용하여 시범사업에 신청해 주신 애플리케이션이나, 미처 신청하지 못한 애플리케이션의 점검을 진행하시어 
접근성 수준 파악에 도움이 되기를 희망합니다.

슬라이드 2 : 
이 영상의 구성에 대하여 말씀드리겠습니다.
먼저, 모바일 앱 접근성 평가의 기준이 되는 검사항목을 살펴보고
진단에 필요한 진단도구인 모바일 스크린리더, 명도대비 확인 프로그램의 사용 법을 익힌 후, 각 항목별 평가를 가상으로 진행하여 실제로 진단이 어떻게 진행되는지 이해할 수 있도록 하겠습니다.

슬라이드 3 : 
첫 번째로, 검사항목을 살펴보겠습니다.


슬라이드 4 : 
검사항목입니다. 
검사항목은 미래창조과학부고시, 제이천십삼 다시 백칠호인, 모바일 애플리케이션 접근성 지침에서 제공하는 검사항목으로, 이 검사항목은 필수 사항과 권고사항으로 나누어 집니다.
필수사항은 대체 텍스트, 초점, 운영체제 접근성 기능 지원, 누르기 동작 지원, 색에 무관한 인식, 명도대비, 자막 수화등의 제공이며, 
권고사항은 기본사용자 인터페이스 컴포넌트, 컨트롤간의 충분한 간격, 알림기능, 범용 폰트 사용, 사용자 인터페이스의 일관성, 깜빡거림의 사용제한, 배경음 사용 제한, 장애인 등 사용자 평가가 있습니다.
검사 항목 중에 대체 텍스트의 제공유무, 초점의 확인, 운영체제 접근성 지원 기능과 명도대비는 비장애인이 확인할 수 없기 때문에 별도의 프로그램으로 확인하게 됩니다.
평가 제외 항목은 기본사용자 인터페이스 컴포넌트 이용과 범용 폰트의 사용, 그리고 장애인 사용자 평가 항목입니다.

슬라이드 5 :
평가 제외 항목에 대하여 추가로 말씀을 드리겠습니다.
운영체제에서 제공하는, 기본 사용자 인터페이스 컴포넌트만 이용을 하여 앱을 제작하는 경우 실제 많은 제약이 따르며 거의 모든 애플리케이션에서 사용자 컴포넌트가 사용되고 있고 접근성 확보에 사용자 컴포넌트가 문제가되는 것이 아니기 때문에 기술적 제약을 두는 해당 검사항목은 제외 합니다.
폰트의 크기 조절 및 확대 기능은, 안드로이드, IOS의 두 운영체제에서 기본으로 제공하는 항목이므로, 준수된 것으로 간주하여 검사 항목에서 제외 합니다.
장애인 등 사용자 평가는 실제 사용자 평가가 이루어져야 하는 항목으로 역시 검사항목에서 제외 합니다.

슬라이드 6 : 
2. 모바일 스크린리더의 활용

슬라이드 7 :
모바일 스크린리더는 스마트폰에 내장된 음성 출력 기능으로 IOS는 보이스오버, 안드로이드는 톡백이라는 모바일 스크린리더를 제공하고 있습니다. 
보이스오버에 대한 설명을 드리겠습니다. 
보이스오버는 설정 페이지에서, 일반, 손쉬운사용, 보이스오버 순서로 접근 가능합니다.
보이스오버를 활성화 시키면 다음과 같이 화면상에 초점이 생기며 음성 출력이 이루어집니다.

슬라이드 8 : 
보이스 오버의 주요 사용 방법은 다음과 같습니다.
일반적으로 화면을 터치하는 경우, 터치한 항목이 실행 되지만, 보이스오버 실행 시에는 터치한 항목으로 초점을 이동시키는 기능이 이루어 집니다.
초점을 받은 항목에서 이중 탭, 즉 두번 터치를 해야 비로소 선택한 항목이 실행됩니다.
오른쪽이나 왼쪽으로 쓸기를실행하면, 다음, 이전 항목으로 현재 위치한 초점이 이동 됩니다. 이것은 위치값을 정확히 알기 어려운 시각 장애인들이 애플리케이션 및 문서의 논리적 순서대로 이동할 수 있는 기능이며 키보드의 탭 기능과 비슷한 역할이라고 이해하시면 됩니다.
화면에서 세 손가락을 쓸면 화면이 스크롤됩니다. 보통 스크롤을 위해 한 손가락으로 쓸기를 사용하지만 보이스오버에서는 초점을 이동시키는 명령과중복이 되기 때문에 세손가락으로 쓸어야 올바른 스크롤이 이루어 집니다.

슬라이드 9 :
이제 보이스오버의 실제 시연장면을 보여드리겠습니다.
보이스 오버를 실행한 모습입니다. 왼쪽 상단에 일반 화면에서 볼 수없었던 검정색 초점이 활성화 된 것을 볼 수 있습니다. 화면의 위치 정보를 활용할 수 없는 시각 장애인은. 터치하여 탐색으로 모든 정보를 탐색하기 어려우므로 초점의 이동을 통해 콘텐츠의 존재와 정보를 획득하게 됩니다.
비장애인과는 조금 다른 방식으로 스마트폰을 사용한다고 이해하시면 됩니다.
위 상태에서 오른쪽으로 쓸기를실행하면 다음 콘텐츠로 초점이 이동하며 해당 콘텐츠의 정보를 알려줍니다.
한번더 오른쪽으로 쓸기를 실행하겠습니다.
이중탭은 빠르게 두번터치하는 것으로 초점받은 콘텐츠를 실행하는 명령입니다.
이제 구글 애플리케이션으로 이동하여 실행해 보겠습니다.
구글 애플리케이션이 실행되었습니다. 검색 필드에서 이중 탭을 하면 검색 기능을 이용할 수 있습니다.
현재 위치에 대한 정보를 제공하는 것뿐만 아니라 이용방법까지 자세히 설명해 주고 있는 것이, 인상적입니다.
이와 같은 방법으로 대채텍스트의 적절한 제공, 초점의 올바른 적용, 입력서식의 레이블을 확인할 수 있습니다.

슬라이드 10 :
이번에는 명도대비 측정 도구를 살펴 보겠습니다. 저시력, 색각 이상자, 고령자 등이 콘텐츠를 쉽게 인식할 수 있도록 전경색과 배경색의 명도대비를 최소3:1 이상으로 해야 하는데 이것을 확인할 수 있게 해주는 프로그램이 CCA입니다. 
이 프로그램은 인터넷 검색을 통해 누구나 다운로드 받을 수 있는 무료 프로그램입니다.
스포이드툴로 전경색과 배경색을 확인하면 명도대비를 수치로 표현해 줍니다.
흰색 바탕에 검정색 글씨는 명도대비 21대 1로 누구나 콘텐츠를 인식할 수 있다는 것을 알 수 있습니다.

슬라이드 11 :
지금부터는 각 검사항목을 살펴보며 해당 검사항목의 진단 방법을 확인해 보도록 하겠습니다.

슬라이드 12 :
첫번째 평가 기준은 대채텍스트입니다. 대채텍스트란, 시각적으로 전달되는 정보를 스크린리더 사용자가 동등하게 인식 및 이해를 할 수 있도록 제공하는 콘텐츠입니다. 모든 의미 있는 콘텐츠에 대채텍스트를 제공해야 하며 시각적으로 전달되는 정보와 동등한 수준으로 제공되어야 합니다. 간단한 예시 화면을 보겠습니다.

슬라이드 13 :
대체 텍스트를 듣기 위해 보이스오버를 동작시킵니다. “보이스오버 켬” 이어서 한 손가락을 사용한 오른쪽 방향 쓸기 동작으로 다음 콘텐츠로 이동해 보겠습니다. “교통안내, 링크” 

슬라이드 14 :
올바른 대체 텍스트가 제공되어 스크린리더 사용자가 버튼의 목적과 기능을 알 수가 있습니다. 하지만 대체 텍스트가 제공되지 않으면 다음과 같이 “스키버스2쩜html” 파일명으로 읽어준다거나 버튼이나 링크 같은 속성 정보만 읽어주게 됩니다. 또 대체 텍스트를 부적절하게 제공한 경우에도 당연히 오류 사항으로 평가가 됩니다. 이렇게 디바이스가 자체 제공하는 스크린리더를 사용하여, 초점진행과 입력서식의 레이블 제공 여부에 대해서도 같은 방법으로 확인을 합니다.

슬라이드 15 :
두 번째 평가 기준은 객체의 초점 적용 여부와, 논리적 순서에 관한 사항입니다. 초점이란 스크린리더의 가상커서 역할을 하는, 객체의 테두리에 생기는 하일라이트를 말합니다. 모든 콘텐츠, 즉, 정보, 서식, 컨트롤에는 초점이 적용되어야 하며, 화면에 보이지 않는 콘텐츠에는 초점이 적용되지 않도록 구현해야 합니다. 
또한 한 손가락 쓸기 이동을 통한 순차적 초점 이동 시에 논리적인 순서로 진행되도록 제공해야 합니다.

슬라이드 16 :
모든 객체에는 초점(focus)이 적용되고, 초점은 순차적으로 이동되어야 한다.
모든 콘텐츠에 접근이 가능하고 논리적으로 이동 가능한지 확인

슬라이드 17 :
화면에 보시는 것처럼 객체 테두리에 초점이 명확하게 보이고 있습니다. 이와 같은 초점이 보이지 않는다면 오류 사항입니다. 초점은 운영체제나, 하이브리드 구현 방식에따라서, 다소 다른 효과로 나타나지만 모두 명확하게 구분이 됩니다. 다음 예시를 보겠습니다.

슬라이드 18 :
“추가본인인증택1도움말헤딩” 화면에 보이는 노란색 사각박스가 초점입니다. 사용자의 요구에 따라 레이어가 팝업 되었지만 초점은 팝업에 가려진 음영처리 된 본문에서 계속 진행이 되고 있는, 초점의 비논리적인 이동 오류입니다. 위에서 아래로, 왼쪽에서 오른쪽으로의 논리적인 순서로 이동되지 않는 경우도 마찬가지로 같은 오류 사항입니다.

슬라이드 19 :
세 번째 평가기준은 운영체제 접근성 기능 지원입니다. 미래창조과학부에서 고시한, 모바일 애플리케이션 지침에서는 애플리케이션의 접근성 제공에 대한 전반적인 지원 여부를 확인하는 항목이었으나 본 사업의 검사항목에서는 입력서식에 한정하여 레이블 제공 유무 및 적절성을 확인합니다.

슬라이드 20 :
“텍스트필드”

슬라이드 21 :
들으신 것처럼 입력 서식에 레이블을 제공하지 않아 속성값인 입력창만을 톡백이 읽어주고 있습니다. 때문에 스크린리더 사용자는 해당 서식의 목적을 알 수가 없습니다. 하지만 목적과 기능에 맞는 레이블을 입력서식에 제공하면 다음과 같이 “이메일을 입력하세요. 텍스트필드” 스크린리더 사용자도 서식의 목적을 이해하고 사용할 수 있게 됩니다. 

슬라이드 22 :
네 번째 평가기준은 복잡한 동작을 단순한 누르기 동작으로 대체할 수 있는 방법을 제공했는지 여부를 확인하는 누르기 동작 지원 항목입니다. 이해를 위해 대체 방법이 올바르게 제공된 예시를 보겠습니다.

슬라이드 23 :
복잡한 동작을 단순한 누르기 동작으로 대체할 수 있는 방법을 제공해야 슬라이드(Slide), 끌기와 놓기(Drag and drop) 다중 누르기(Multi-touch) 등의 동작을 대체할 수 있는 방법을 제공하지 않은 경우

슬라이드 24 :
IOS운영체제를 사용한, 디바이스의 잠금화면입니다.
방금 들으신 것처럼 보이스오버를 킨 상태에서, 밀어서잠금해제 컨트롤에 접근 시, 버튼으로 대체 기능이 제공된 것을 알 수 있습니다. 즉, 한 손가락을 사용하여 화면을 두 번 탭하는 것으로 잠금해제가 가능합니다. 이처럼 복잡한 동작을 필요로하는 기능을, 단순한 대체 동작으로 사용할 수 있게 제공하지 않으면 오류로 평가됩니다.

슬라이드 25 :
다섯 번째 평가 기준은 색에 무관한 인식입니다. 화면에 표시되는 모든 정보는 색에 관계없이 인식을 할 수 있어야 한다는 것입니다. 색을 배제했을 때 콘텐츠가 전달하는 정보를 이해할 수 없는 경우에 오류가 됩니다. 예시를 보겠습니다.

슬라이드 26 ;
보시는 표는 색상으로만 계열에 대한 구분 정보를 제공하고 있습니다. 이 것을 색각 이상자의 시점에서 보면 다음과 같이 흑백 화면처럼 보이게 되어 어떤 데이터가 계열1이고 어떤 데이터가 계열2인지 알 수 없습니다. 이처럼 패턴, 구분선, 디자인 요소 등의 추가 정보를 제공하지 않고 색상으로만 정보를 제공하는 경우에는 오류로 평가됩니다.

슬라이드 27 :
다음 평가 기준은 명도 대비입니다. 저시력자, 고령자 등이 시각적으로 콘텐츠를 인식하는데 어려움이 없도록 전경색과 배경색의 명도 대비를 최소 3:1 이상으로 제공했는지를 평가합니다.

슬라이드 28 :
보시는 텍스트 콘텐츠의 전경색은, 회색으로, 배경색은 하늘색으로 제공이 되어 있습니다. 이의 명도 대비를 CCA 프로그램을 사용하여 측정하면 1.62:1로, 명도대비가 기준에 비해 낮음을 알 수 있습니다. 이처럼 3:1의 명도대비를 만족하지 못하는 경우에, 오류로 평가 됩니다.

슬라이드 29 :
일곱 번째 평가 기준으로 자막, 수화 등의 제공 항목입니다. 동영상과 같은 멀티미디어 콘텐츠를 시각장애인 사용자나 청각장애인 사용자가 동등하게 인식할 수 있도록 자막, 원고 또는 수화를 제공했는지를 판단하는 항목입니다.

슬라이드 30 : 
보시는 예는 영상 속의 나레이션을 대체 콘텐츠인 자막으로서 제공한 것입니다. 하지만 이처럼 영상에 나레이션이 있지만 자막, 원고, 수화 중에 한 가지도 제공하지 않은 경우에는 오류로 평가됩니다. 

슬라이드 31 :
다음 평가 기준은 컨트롤간 충분한 간격을 제공했는지, 컨트롤 크기는 충분히 크게 제공했는지를 평가하는 항목입니다. 실제 디바이스 화면을 예시로 상세 기준을 알아보겠습니다.

슬라이드 32 :
보시는 것처럼 컨트롤 객체의 가로 간격은 최소 13mm, 세로 간격은 최소 8.5mm로 제공해야 하며, 각 컨트롤의 크기는 대각선 길이를 기준으로 최소 6mm의 크기로 제공해야 합니다. 기준을 충족하지 못하면 오류입니다.