SlideShare a Scribd company logo
Web Accessibility
2015 / Amass
미 교통부(US-DOT) 장애인 접근성 의무화 준수 대응 방안
(국내외 동향)
2
Web Accessibility Guide
TABLE OF CONTENTS
Contents
개요
WCAG2.0 ⇔ KWCAG2.0 비교
한국형 웹 콘텐츠 접근성 지침(KWCAG)2.0
W3C 웹 콘텐츠 접근성 지침(WCAG)2.0
WCAG2.0 사례 분석
WCAG2.0 대응 고려사항
맺음말
3
Web Accessibility Guide
개 요
Web Accessibility Guide
4
개요
US DOT(교통부) 대응 접근성 개선
 2013년 12월 12일 US DOT(미국 교통부) 홈페이지 및 키오스크의 장애인 접근성 규정 의무화 공지
# 내용
1) 미국 소비자를 대상으로 하는 웹사이트를 운영하고 있는 항공사는 장애인 고객을 위해 웹 접근성을 개선해야 함
2) 항공권 판매자는 추가비용 없이 장애인 고객에게 비장애인 고객과 동일한 서비스를 제공해야 함
3) 항공사는 홈페이지에 장애인을 위한 서비스를 요청 할 수 있는 기능을 설치해야 함
- 국제항공운송협회 공문 -
# 적용대상
1) 좌석수가 60석 이상인 항공기를 최소 1대 운항하고 있는 미국 및 외국 항공사
2) 미국 소비자를 대상으로 홈페이지를 운영하고 있는 항공사
# 적용범위
1) 1단계 : 2015년 12월 12일까지
①예약 및 예약변경 ②체크인 ③개인여행 일정 확인 ④항공편 상태 확인
⑤마일리지 계정 확인 ⑥항공편 스케줄 확인 ⑦항공사 연락처 확인
2) 2단계 : 2016년 12월 12일까지
1단계를 제외한 모든 범위
# 기술표준
1) 국제표준화기구인 W3C의 웹 접근성 규정(WCAG2.0) A~AA 조건 충족
5
Web Accessibility Guide
WCAG2.0 ⇔ KWCAG 2.0
비 교
Web Accessibility Guide
6
WCAG 2.0
1.1 대체텍스트
1.2 시간 기반 미디어 대체 콘텐츠
1.3 정보 또는 구조 소실 없는 콘텐츠
1.4 전경/배경색 구분 및 더 쉽게 듣고 볼 수
있는 콘텐츠
2.1 모든 기능을 키보드로 제공
2.2 충분한 시간 제공
2.3 광 과민성 발작 예방
2.4 네비게이션 제공
3.1 가독성
3.2 예측가능성
3.3 입력도움
4.1 보조공학을 포함한 웹 표시장치와
호환성의 극대화
WCAG2.0 ⇔ KWCAG2.0 비교
WCAG2.0과 KWCAG2.0 비교
# KWCAG 2.0은 WCAG의 4대원칙을 따르고 있으며, KWCAG 2.0의 세부지침을 국내 실정에 맞춰 반영 되었다.
KWCAG 2.0
1.1 대체텍스트
1.2 멀티미디어 대체 수단
1.3 명료성
2.1 키보드 접근성
2.2 충분한 시간 제공
2.3 광 과민성 발작 예방
2.4 쉬운 네비게이션
3.1 가독성
3.2 예측가능성
3.3 콘텐츠 논리성
3.4 입력도움
4.1 문법 준수
4.2 웹 어플리케이션 접근성
인식의
용이성
운용의
용이성
이해의
용이성
견고성
7
Web Accessibility Guide
KWCAG 2.0
Web Accessibility Guide
8
KWCAG2.0 지침
한국형 웹 콘텐츠 접근성 지침 2.0 (KWCAG 2.0) 준수 항목
[1] 인식의 용이성
1.1. 대체 텍스트 1.1.1. 적절한 대체 텍스트 제공
1.2. 멀티미디어 대체 수단 1.2.1. 멀티미디어 콘텐츠에는 적절한 자막을 제공해야 한다.
1.3. 명료성
1.3.1. 콘텐츠는 색에 관계없이 인식되어야 한다.
1.3.2. 지시사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 한다.
1.3.3. 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상이어야 한다.
1.3.4. 자동으로 재생되는 배경 음을 사용하지 않아야 한다.
[2] 운용의 용이성
2.1. 키보드 접근성
2.1.1. 모든 기능은 키보드만으로도 사용할 수 있어야 한다.
2.1.2. 키보드에 의한 초점은 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다.
2.2. 충분한 시간 제공
2.2.1. 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있어야 한다.
2.2.2. 자동으로 변경되는 콘텐츠는 움직임을 제어할 수 있어야 한다.
2.3. 광과민성 발작 예방 2.3.1. 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 한다.
2.4. 쉬운 네비게이션
2.4.1. 콘텐츠의 반복되는 영역은 건너뛸 수 있어야 한다.
2.4.2. 페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야 한다.
2.4.3. 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 한다.
[3] 이해의 용이성
3.1. 가독성 3.1.1. 주로 사용하는 언어를 명시해야 한다.
3.2. 예측 가능성 3.2.1. 사용자가 의도하지 않은 기능(새 창, 초점 변화)은 실행되지 않아야 한다.
3.3. 콘텐츠의 논리성
3.3.1. 콘텐츠는 논리적인 순서로 제공해야 한다
3.3.2. 표는 이해하기 쉽게 구성해야 한다.
3.4. 입력 도움
3.4.1. 입력서식에는 대응하는 레이블을 제공해야 한다.
3.4.2. 입력오류를 정정할 수 있는 방법을 제공해야 한다.
[4] 견고성
4.1. 문법 준수 4.1.1. 마크업 언어의 요소는 열고 닫음, 중첩관계 및 속성선언에 오류가 없어야 한다.
4.2. 웹 애플리케이션 접근성 4.2.1. 콘텐츠에 포함된 웹 애플리케이션은 접근성이 있어야 한다.
9
Web Accessibility Guide
WCAG 2.0
Web Accessibility Guide
10
WCAG2.0 지침
인식의 용의성(인지 - 정보와 인터페이스 구성요소는 사용자가 인지할 수 있는 방법으로 표시해야 한다.)
1.1 텍스트 아닌 콘텐츠는 확대, 점자, 음성, 기호 또는 단순한 언어 등 다른 양식을 원하는 사람들의 욕구에 대응할 수 있도록 대체 텍스트를 제공해야 한다.
1.1.1 Non-text Content (수준 A) = (KWCAG 2.0지침 1.1.1)
1.2 실시간 미디어에 대한 대체 수단을 제공해야 한다.
1.2.1 음성과 영상 (녹화) Audio-only and Video-only (Prerecorded) (수준 A) = (KWCAG 2.0지침 1.2.1)
1.2.2 자막 (녹화) Captions (Prerecorded) (수준 A) = (KWCAG 2.0지침 1.2.1)
1.2.3 음성 해설 또는 미디어 대체 (녹화) Audio Description or Media Alternative (Prerecorded) (수준 A) = (KWCAG 2.0지침 1.2.1)
1.2.4 자막 (실시간) Captions (Live) (수준 AA) = (KWCAG 2.0지침 1.2.1)
1.2.5 음성 해설 (실시간) Audio Description (Prerecorded) (수준 AA) = (KWCAG 2.0지침 1.2.1)
1.2.6 수화 (녹화) (수준 AAA)
1.2.7 추가된 음성 해설 (녹화) (수준 AAA)
1.2.8 미디어 대체 (녹화) (수준 AAA)
1.2.9 음성 (실시간) (수준 AAA)
1.3 콘텐츠는 정보 또는 구조의 손실 없이 다른 형태(예를 들면 더 단순하게)로 표시될 수 있도록 제작해야 한다.
1.3.1 정보와 관계 Info and Relationships (수준 A) = (KWCAG 2.0지침 1.3.1, 2.4.2, 3.3.2)
1.3.2 의미 있는 배열 Meaningful Sequence (수준 A) = (KWCAG 2.0지침 3.3.1)
1.3.3 감각적인 특성 Sensory Characteristics (수준 A) = (KWCAG 2.0지침 1.3.2)
1.4 배경으로부터 전경을 분리하는 것을 포함하여 콘텐츠는 사용자가 보고 듣기 쉽게 제작해야 한다.
1.4.1 색의 사용 Use of Color (수준 A) = (KWCAG 2.0지침 1.3.2)
1.4.2 음성 제어 Audio Control (수준 A) = (KWCAG 2.0지침 1.3.4)
1.4.3 명암 대비 (Minimum) Contrast (Minimum) (수준 AA) = (KWCAG 2.0지침 1.3.3)
1.4.4 문자 크기 변경 Resize text (수준 AA) = (KWCAG 2.0지침 없음)
1.4.5 문자 이미지 Images of Text (수준 AA) = (KWCAG 2.0지침 없음)
1.4.6 명암 대비 (Enhanced) (수준 AAA)
1.4.7 Low or No Background Audio (수준 AAA)
1.4.8 시각적 표현 (수준 AAA)
1.4.9 문자 이미지 (No Exception) (수준 AAA)
Web Accessibility Guide
11
WCAG2.0 지침
운용의 용의성 (운용 - 사용자 인터페이스 구성요소와 탐색 기능은 조작이 가능해야 한다.)
2.1 키보드로 모든 기능이 가능하도록 제작해야 한다.
2.1.1 키보드 Keyboard (수준 A) = (KWCAG 2.0지침 2.1.1)
2.1.2 키보드 트랩 방지 No Keyboard Trap (수준 A) = (KWCAG 2.0지침 2.1.1)
2.1.3 키보드 (No Exception) (수준 AAA)
2.2 사용자가 콘텐츠를 읽고 사용할 수 있는 충분한 시간을 제공해야 한다.
2.2.1 시간 조절 Timing Adjustable (수준 A) = (KWCAG 2.0지침 2.2.1)
2.2.2 Pause, Stop, Hide (수준 A) = (KWCAG 2.0지침 2.2.2)
2.2.3 타이밍 금지 (수준 AAA)
2.2.4 중단 (수준 AAA)
2.2.5 재 인증 (수준 AAA)
2.3 발작을 일으키는 것으로 알려진 콘텐츠를 디자인 하면 안 된다.
2.3.1 3회의 번쩍임 또는 임계치 이하 Three Flashes or Below Threshold (수준 A) = (KWCAG 2.0지침 2.3.1)
2.3.2 3회의 번쩍임 (수준 AAA)
2.4 탐색하거나 콘텐츠를 찾거나 위치를 판단할 수 있도록 도울 방법을 제공해야 한다.
2.4.1 블럭 우회 Bypass Blocks (수준 A) = (KWCAG 2.0지침 2.4.1)
2.4.2 페이지 제목 달기 Page Titled (수준 A) = (KWCAG 2.0지침 2.4.2)
2.4.3 포커스 순서 Focus Order (수준 A) = (KWCAG 2.0지침 2.1.2)
2.4.4 링크 목적 (In Context Link Purpose (In Context) (수준 A) = (KWCAG 2.0지침 2.4.3)
2.4.5 다양한 방법 Multiple Ways (수준 AA) = (KWCAG 2.0지침 없음)
2.4.6 Headings and Labels (수준 AA) = (KWCAG 2.0지침 2.4.2)
2.4.7 Focus Visible (수준 AA) = (KWCAG 2.0지침 2.1.2)
2.4.8 Location (수준 AAA)
2.4.9 링크 목적 (Link Only) (수준 AAA)
2.4.10 Section Headings (수준 AAA)
Web Accessibility Guide
12
WCAG2.0 지침
이해의 용의성 (이해 - 정보와 사용자 인터페이스 조작은 이해할 수 있어야 한다.)
3.1 콘텐츠는 읽고 이해할 수 있도록 제작해야 한다.
3.1.1 페이지 언어 Language of Page (수준 A) = (KWCAG 2.0지침 3.1.1)
3.1.2 부분 언어 Language of Parts (수준 AA) = (KWCAG 2.0지침 없음)
3.1.3 낯선 단어 (수준 AAA)
3.1.4 약어 (수준 AAA)
3.1.5 독서 수준 (수준 AAA)
3.1.6 발음 (수준 AAA)
3.2 웹 페이지의 출현과 조작은 예측할 수 있도록 제작해야 한다.
3.2.1 On Focus (수준 A) = (KWCAG 2.0지침 3.2.1)
3.2.2 On Input (수준 A) = (KWCAG 2.0지침 3.2.1)
3.2.3 일관된 탐색 Consistent Navigation (수준 AA) = (KWCAG 2.0지침 3.3.1)
3.2.4 일관된 식별 Consistent Identification (수준 AA) = (KWCAG 2.0지침 3.4.1)
3.2.5 요청에 의한 변화 (수준 AAA)
3.3 실수를 예방하고 정정할 수 있도록 사용자를 도와야 한다.
3.3.1 오류 식별 Error Identification (수준 A) = (KWCAG 2.0지침 3.4.2)
3.3.2 레이블 또는 설명 Labels or Instructions (수준 A) = (KWCAG 2.0지침 3.4.1)
3.3.3 오류 의견 Error Suggestion (수준 AA) = (KWCAG 2.0지침 3.4.2)
3.3.4 오류 예방 (Legal, Financial, Data) Error Prevention (Legal, Financial, Data) (수준 AA) = (KWCAG 2.0지침
없음)
3.3.5 Help (수준 AAA)
3.3.6 오류 예방 (All) (수준 AAA)
견고성 (신뢰 - 콘텐츠는 보조 기술을 포함한 다양한 사용자 응용 프로그램에 의하여 해석이 가능하도록 충분히
견고해야 한다.)
4.1 보조 기술을 포함하여 현재와 미래의 사용자 응용 프로그램 호환성을 극대화 해야 한다.
4.1.1 Parsing (수준 A) = (KWCAG 2.0지침 4.1.1)
4.1.2 Name, Role, Value (수준 A) = (KWCAG 2.0지침 4.1.1)
13
Web Accessibility Guide
WCAG 2.0
사례 분석
영문홈페이지 WCAG2.0 개선 사항
Web Accessibility Guide
14
영문홈페이지 WCAG2.0 개선 사항
1.1.1 Non-text Content (수준 A)
영문 사이트임에도 한국어로 된 대체 텍스트를 제공함
예제>
<공통영역>
<메인 페이지>
• 한국어 사이트를 기반으로 다국어 사이트가 개발된 것으로 판단되어지며 각 사이트에서 사용된 언어에 따른 대체 텍스트 제공되어야 함.
• 텍스트가 아닌 콘텐츠에 대한 대체 콘텐츠 제공은 콘텐츠를 인식하는 최소한의 항목이므로 가장 필수적인 웹 접근성 준수를 위한 작업임.
Web Accessibility Guide
15
영문홈페이지 WCAG2.0 개선 사항
1.3.1 Info and Relationships (수준 A)
테이블 구조는 테이블의 정보를 제공하여 마크업 되어야 함.
예제>
<다수의 테이블>
• 데이터 테이블의 경우 테이블 구조에 대한 정보를 마크업에 같이 제공하여야 함.
Web Accessibility Guide
16
영문홈페이지 WCAG2.0 개선 사항
1.4.4 문자 크기 변경 Resize text (수준 AA)
전체 페이지에서(브라우저에서 지원하는) 화면확대를 Control 할 수 있는 기능을 구현
 저 시력 장애인 등을 위한 기능으로 홈페이지의 레이아웃을 유지한 채 텍스트 글꼴의 크기만 확대/축소 되도록 제공하여야 한다.
 브라우저의 기본 확대/축소 기능과 동일한 화면확대 버튼 Control 기능 제공을 제공하여 화면확대를 미지원하는 브라우저도 지원할 수 있도록 개선하여
야 한다.
1
1
Web Accessibility Guide
17
영문홈페이지 WCAG2.0 개선 방안
2.1.1 키보드 Keyboard (수준 A)
키보드만으로 모든 기능을 제어 가능하게 하여야 한다.
 키보드를 통하여 롤링 배너에 대한 접근이 가능하여야 하나 비주얼 배너 전체 영역만 선택된다.
 2.2.2 Pause, Stop, Hide (수준 A) 기능을 제공하고 있으나 제어가 불가능 하므로 개선이 필요하다.
1
Web Accessibility Guide
18
영문홈페이지 WCAG2.0 개선 사항
2.4.2 페이지 제목 달기 Page Titled (수준 A)
사용 언어에 맞는 페이지 제목을 제공해야 함.
예제>
 사용자가 목표한 페이지에 명확히 이동하였는지에 대하여 Page Title을 Navigation에 맞게 제공한다.
 시각장애인의 경우 링크를 통한 첫 페이지에 이동 시 현재 본인의 위치를 Page Title을 통하여 파악 한다.
만약 해당 페이지명만 제공할 경우 상위페이지에 대한 트리 구조를 분실하게 되므로 통일되게 개선하여야 한다.
1
Web Accessibility Guide
19
영문홈페이지 WCAG2.0 개선 사항
2.4.3 Focus Order (수준 A)
레이어팝업 작업 완료 후 레이어팝업을 요청한 작업으로 되돌아 가지 못함
• 레이어팝업을 호출하여 해당 기능을 실행 한 뒤 레이어팝업을 닫게 되면 이전에 진행하던 작업을 계속 가능하도록 해야 하나 초점이 페이지 처음 링크로
돌아가는 문제가 있음.
• 키보드 사용자는 제주항공의 서비스를 받기 위해 많은 불편이 존재하므로 반드시 수정해야 함.
<다수 존재>
Web Accessibility Guide
20
영문홈페이지 WCAG2.0 개선 방안
2.4.4 링크 목적 In Context Link Purpose (In Context) (수준 A)
링크가 제공되는 콘텐츠의 경우 명확한 목적을 제시하여야 한다.
 <a>링크를 통하여 Wallpaper를 다운받는 기능을 제공하고 있으나 1280X1024 등 숫자를 통한 사이즈만 제공하고 있다.
 어떠한 파일 인지, 새 창 열림인지 다운로드인지를 명확히 명시할 필요성이 있다.
 목적 및 콘텐츠가 무엇인지 명확하게 제시하여야 한다.
1
Web Accessibility Guide
21
영문홈페이지 WCAG2.0 개선 사항
2.4.5 다양한 방법 Multiple Ways (수준 AA)
콘텐츠의 위치(경로)를 찾아내는 방안(테크닉)
# 사이트 맵은 다양한 목적들을 수행한다.
 사이트 전체에 대한 개요를 제공한다.
 사이트가 어떠한 것을 포함하고 있고, 그러한 콘텐츠들이 어떻게 조직화되어 있는지 사용자가 이해하는 것을 돕는다.
 사이트의 다양한 부분에서 서로 다르게 나타날 수 있는 네비게이션 바 들의 복잡함을 경감하는 대체수단을 제공한다.
# 차례는 두 가지 목적을 가지고 있다. (내용이 많은 페이지이며, 문단 구분되는 데이터가 있는 문서의 경우 제공)
 사용자에게 문서의 콘텐츠와 구조에 대한 훑어보기를 제공한다.
 독자들이 온라인 문서의 특정 섹션으로 바로 갈 수 있도록 한다..
# 관련 웹 페이지 탐색 링크 제공
 연관된 웹 페이지들을 가리키는 링크들을 제공함으로써 사용자가 추가적인 정보를 얻을 수 있도록 하는 것
# 사용자가 콘텐츠를 찾아내는 것을 돕는 검색 기능 제공
 웹 페이지를 검색하는 검색 기능을 제공하는 것은 사용자에게 콘텐츠를 찾을 방법을 제공하는 디자인 전략
# 사용자가 콘텐츠를 찾아내는 것을 돕는 검색 기능 제공
 웹 페이지를 검색하는 검색 기능을 제공하는 것은 사용자에게 콘텐츠를 찾을 방법을 제공하는 디자인 전략
Web Accessibility Guide
22
영문홈페이지 WCAG2.0 개선 사항
3.1.1 Language of Page (수준 A)
영문 사이트임에도 페이지 언어가 한국어로 제공함
예제>
<공통영역>
• 한국어 사이트를 기반으로 다국어 사이트가 개발된 것으로 판단되어지며 각 사이트에서 사용된 언어에 맞도록 언어 속성이 제공되어야 함.
• 스크린리더 사용자를 위해 정확한 언어를 제공해야 함.
Web Accessibility Guide
23
영문홈페이지 WCAG2.0 개선 사항
3.1.2 부분 언어 Language of Parts (수준 AA)
콘텐츠에서 각 절이나 문구의 언어는 프로그램방식으로 결정될 수 있어야 한다.
# 콘텐츠의 부분에 포함된 타 언어.
 콘텐츠에서 각 절이나 문구의 언어(human language)는 적절한 이름, 기술적 용어, 결정되지 않은 언어의 단어들, 텍스트 주위의 즉각적인 일
상용어의 부분이 되는 단어들이나 문장들은 제외하고 프로그램방식으로 결정(programmatically determined)될 수 있어야 한다.
<blockquote xml:lang="de">
<p>
Da dachte der Herr daran, ihn aus dem Futter zu schaffen,
aber der Esel merkte, daß kein guter Wind wehte, lief fort
und machte sich auf den Weg nach Bremen: dort, meinte er,
könnte er ja Stadtmusikant werden.
</p>
</blockquote>
예제>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
height="420" id="myMovie" lang="fr" width="780" xml:lang="fr">
<param name="movie" value="myMovie.swf"/>
<!--[if !IE]>-->
<object data="languages.swf" height="420" lang="fr"
type="application/x-shockwave-flash" width="780" xml:lang="fr">
<!--<![endif]-->
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
Web Accessibility Guide
24
영문홈페이지 WCAG2.0 개선 방안
3.3.2 레이블 또는 설명 Labels or Instructions (수준 A)
레이블에 대한 명확한 Title 제공
 레이블에 대한 명확한 Title 제공을 통해 해당 레이블의 기능을 인지할 수 있어야 하나, 다국어 홈페이지의 레이블에 한글을 제공하고 있어 해당
국가의 사용자가 혼동을 일으키게 한다.
 레이블에 대한 명확한 Title 번역을 통한 개선이 필요하다.
1
2
3
Web Accessibility Guide
25
다국어홈페이지 WCAG2.0 개선 방안
3.3.4 오류 예방 (Legal, Financial, Data)
Error Prevention (Legal, Financial, Data) (수준 AA)
# 법적인 책임/금융거래/자료저장시스템의 경우 원상회복/점검/확인이 가능하여야 한다.
 전송을 완료하기 전 검토, 확인, 교정이 가능하여야 한다.
1
26
Web Accessibility Guide
WCAG 2.0
대응 고려사항
Web Accessibility Guide
27
WCAG2.0 대응 고려사항
# WCAG2.0의 수준A~AA 항목에 대한 접근성 개선을 진행하면서 가장 우선적으로 고려했던 사항은 다음과 같다.
WCAG2.0 대응 고려사항
국제표준 WCAG2.0은 4개 원칙, 12지침, 38항목(수준A~AA)의 가이드라인을 제공하고 있으며,
그에 따른 다양한 General Techniques을 제공하여 해당 내용에 따라 접근을 할 수 있다.
#참조
• http://www.w3.org/TR/WCAG20/
• http://www.wah.or.kr/w3c_doc/techs/general.html
• KWCAG2.0과 비교하여 같은 방식으로 웹 접근성을 제공할 수 있는가?
• KWCAG2.0과 매칭 되지 않는 항목에 대하여 어떻게 접근을 해야 하는가?
• 기준이 만들어 진지 오래되어 현재의 기술에 대응이 되지 않는 경우 어떻게 접근하여야 하는가?
• 예외기준을 적용할 방안이 있는가?
위와 같은 고민 속에 국내 항공사에 대한 WCAG2.0 기준을 나름대로 정리하여 적용을 하였으며,
시행착오 끝에 프로젝트를 마무리하고 있다.
# 이슈사항
- 주요 가장 고려사항은 WCAG2.0 수준A~AA에서 까지의 적용 방안 중 예외처리가 가능 부분이 있는가?
- 만약 예외처리를 했을 경우 해당 부분에 대하여 누가 보장하는가?
 결론 : WCAG2.0의 접근성 기준을 최대한 적용하여 누락사항이 없도록 서비스를 제공한다.
28
Web Accessibility Guide
맺음말
영문홈페이지 WCAG2.0 개선 사항
29
Web Accessibility Guide
맺음말
본 사업을 수행하면서 느낀 점은 홈페이지를 포함하여 IT분야의 장애인 접근성은
국내에 국한된 문제가 아닌 전세계적인 이슈로 보여지고 있습니다.
 고령화되어 가는 사회
 소외계층에 대한 복지
 장애인에 대한 시선변화 등
앞으로도 선진국가에서 자국의 시민을 위한 복지정책은 높아져만 갈 것이며,
이에 따라 외국 사용자를 대상으로 서비스하는 국내 기업들의 장애인 접근성은
필수적으로 지켜야 하는 항목이 되리라 보여집니다.
THANK YOU
Accessibility Consulting Group – Amass

More Related Content

Viewers also liked

비즈델리 소셜위치정보컨퍼런스 2011
비즈델리 소셜위치정보컨퍼런스 2011비즈델리 소셜위치정보컨퍼런스 2011
비즈델리 소셜위치정보컨퍼런스 2011
Agenda King KeynaSee
 
The Last Traffic Jam - Korean
The Last Traffic Jam - KoreanThe Last Traffic Jam - Korean
The Last Traffic Jam - Korean
Connected Futures
 
X[deca] 9월 개강총회
X[deca] 9월 개강총회X[deca] 9월 개강총회
X[deca] 9월 개강총회
성호 정
 
프레젠테이션
프레젠테이션프레젠테이션
프레젠테이션puma186
 
2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료
2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료 2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료
2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료
D.CAMP
 
글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)
글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)
글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)
Channy Yun
 
아두이노를 활용한 자전거
아두이노를 활용한 자전거아두이노를 활용한 자전거
아두이노를 활용한 자전거
hwaaan
 
2015년 2학기 경영혁신 과제 B031223 유미
2015년 2학기 경영혁신 과제 B031223 유미2015년 2학기 경영혁신 과제 B031223 유미
2015년 2학기 경영혁신 과제 B031223 유미
미 유
 
무장애정류장조 UX Consultant 교육 최종 과제결과
무장애정류장조 UX Consultant 교육 최종 과제결과무장애정류장조 UX Consultant 교육 최종 과제결과
무장애정류장조 UX Consultant 교육 최종 과제결과
Rightbrain UX1 Consulting group
 
[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술
[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술
[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술uxzeitgeist
 
증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스)
증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스) 증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스)
증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스)
JM code group
 
주차정보제공 Navi
주차정보제공 Navi주차정보제공 Navi
주차정보제공 Navi
Myoung Soo Kang
 
Safe walking 스몸비는 사회적 책임입니다.
Safe walking 스몸비는 사회적 책임입니다.Safe walking 스몸비는 사회적 책임입니다.
Safe walking 스몸비는 사회적 책임입니다.
Sungwoon Do
 
IoT 제품 및 서비스 분석 (2013.9월 기준)
IoT 제품 및 서비스 분석 (2013.9월 기준)IoT 제품 및 서비스 분석 (2013.9월 기준)
IoT 제품 및 서비스 분석 (2013.9월 기준)
jinilamp
 
지켜라! 지하철 제안서
지켜라! 지하철 제안서지켜라! 지하철 제안서
지켜라! 지하철 제안서
Kenny Kim
 
모바일 혁명과 교통정보 패러다임의 변화
모바일 혁명과 교통정보 패러다임의 변화모바일 혁명과 교통정보 패러다임의 변화
모바일 혁명과 교통정보 패러다임의 변화
Seong Namkoong
 
2015 캡스톤 디자인 2
2015 캡스톤 디자인 22015 캡스톤 디자인 2
2015 캡스톤 디자인 2
SiMYEONGUK
 
AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트 :: IoT Convergence Conference 2015
AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트  :: IoT Convergence Conference 2015AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트  :: IoT Convergence Conference 2015
AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트 :: IoT Convergence Conference 2015
Amazon Web Services Korea
 
졸업작품 중간발표(발표용)
졸업작품 중간발표(발표용)졸업작품 중간발표(발표용)
졸업작품 중간발표(발표용)
주희 이
 

Viewers also liked (20)

비즈델리 소셜위치정보컨퍼런스 2011
비즈델리 소셜위치정보컨퍼런스 2011비즈델리 소셜위치정보컨퍼런스 2011
비즈델리 소셜위치정보컨퍼런스 2011
 
The Last Traffic Jam - Korean
The Last Traffic Jam - KoreanThe Last Traffic Jam - Korean
The Last Traffic Jam - Korean
 
X[deca] 9월 개강총회
X[deca] 9월 개강총회X[deca] 9월 개강총회
X[deca] 9월 개강총회
 
프레젠테이션
프레젠테이션프레젠테이션
프레젠테이션
 
2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료
2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료 2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료
2015년 7월의 D.PARTY_ 이노온 박태림 대표 발표자료
 
1조
1조1조
1조
 
글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)
글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)
글로벌 지도 API 서비스 현황과 미래 - 한국지리정보학회 (2014)
 
아두이노를 활용한 자전거
아두이노를 활용한 자전거아두이노를 활용한 자전거
아두이노를 활용한 자전거
 
2015년 2학기 경영혁신 과제 B031223 유미
2015년 2학기 경영혁신 과제 B031223 유미2015년 2학기 경영혁신 과제 B031223 유미
2015년 2학기 경영혁신 과제 B031223 유미
 
무장애정류장조 UX Consultant 교육 최종 과제결과
무장애정류장조 UX Consultant 교육 최종 과제결과무장애정류장조 UX Consultant 교육 최종 과제결과
무장애정류장조 UX Consultant 교육 최종 과제결과
 
[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술
[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술
[SK UX-HCI] 퍼스널 빅데이터와 라이프로그 HCI-UX 관점의 IOT 기술
 
증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스)
증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스) 증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스)
증강현실 기술의 동향과 구현 사례(위치정보가 융합된 스마트폰의 증강현실 시스템 및 서비스)
 
주차정보제공 Navi
주차정보제공 Navi주차정보제공 Navi
주차정보제공 Navi
 
Safe walking 스몸비는 사회적 책임입니다.
Safe walking 스몸비는 사회적 책임입니다.Safe walking 스몸비는 사회적 책임입니다.
Safe walking 스몸비는 사회적 책임입니다.
 
IoT 제품 및 서비스 분석 (2013.9월 기준)
IoT 제품 및 서비스 분석 (2013.9월 기준)IoT 제품 및 서비스 분석 (2013.9월 기준)
IoT 제품 및 서비스 분석 (2013.9월 기준)
 
지켜라! 지하철 제안서
지켜라! 지하철 제안서지켜라! 지하철 제안서
지켜라! 지하철 제안서
 
모바일 혁명과 교통정보 패러다임의 변화
모바일 혁명과 교통정보 패러다임의 변화모바일 혁명과 교통정보 패러다임의 변화
모바일 혁명과 교통정보 패러다임의 변화
 
2015 캡스톤 디자인 2
2015 캡스톤 디자인 22015 캡스톤 디자인 2
2015 캡스톤 디자인 2
 
AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트 :: IoT Convergence Conference 2015
AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트  :: IoT Convergence Conference 2015AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트  :: IoT Convergence Conference 2015
AWS IoT 서비스 활용하기- 윤석찬, AWS 테크에반젤리스트 :: IoT Convergence Conference 2015
 
졸업작품 중간발표(발표용)
졸업작품 중간발표(발표용)졸업작품 중간발표(발표용)
졸업작품 중간발표(발표용)
 

Similar to [11/25 정보접근성 세미나]미 교통부(Dot) 장애인 접근성 의무화 준수 대응 방안(국내외 동향) (주)에이매스컨설팅 김근우 전임

개발자를 위한 웹표준 & 웹접근성이야기
개발자를 위한 웹표준 & 웹접근성이야기개발자를 위한 웹표준 & 웹접근성이야기
개발자를 위한 웹표준 & 웹접근성이야기NAVER D2
 
2.보건복지정보개발원 2부(국가표준 및 품질마크)자료
2.보건복지정보개발원 2부(국가표준 및 품질마크)자료2.보건복지정보개발원 2부(국가표준 및 품질마크)자료
2.보건복지정보개발원 2부(국가표준 및 품질마크)자료
Youngil Ryu
 
다음카카오 Pc&Mobile 웹 접근성 개선 사례
다음카카오  Pc&Mobile 웹 접근성 개선 사례다음카카오  Pc&Mobile 웹 접근성 개선 사례
다음카카오 Pc&Mobile 웹 접근성 개선 사례
Jaesung Choi
 
A Case Study on Accessibility of Online Learning Content in Korea
A Case Study on Accessibility of Online Learning Content in KoreaA Case Study on Accessibility of Online Learning Content in Korea
A Case Study on Accessibility of Online Learning Content in Korea
Greg SHIN
 
DIK accessible technique
DIK accessible techniqueDIK accessible technique
DIK accessible technique
yamoo9
 
워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)
워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)
워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)
Sungmin Jang
 
04.발표 반응형웹에서접근성확보방법
04.발표 반응형웹에서접근성확보방법04.발표 반응형웹에서접근성확보방법
04.발표 반응형웹에서접근성확보방법
Lab Snc
 
웹접근성지침 2012 0701
웹접근성지침 2012 0701웹접근성지침 2012 0701
웹접근성지침 2012 0701
Hyesun Choi
 
웹접근성캠프서울 반응형웹에서의접근성확보방법
웹접근성캠프서울 반응형웹에서의접근성확보방법웹접근성캠프서울 반응형웹에서의접근성확보방법
웹접근성캠프서울 반응형웹에서의접근성확보방법
선영 박
 
HTML5 and Smart TV
HTML5 and Smart TVHTML5 and Smart TV
HTML5 and Smart TV
Jonathan Jeon
 
Top 10 Questions about HTML5
Top 10 Questions about HTML5Top 10 Questions about HTML5
Top 10 Questions about HTML5
Jonathan Jeon
 
DevOn PT (Korea Web Accessibility Group)
DevOn PT (Korea Web Accessibility Group)DevOn PT (Korea Web Accessibility Group)
DevOn PT (Korea Web Accessibility Group)Sungmin Jang
 
04.발표
04.발표04.발표
04.발표
EducationWebs
 
Contentsbebop
ContentsbebopContentsbebop
Contentsbebop
Sohee Jeong
 
한국형 웹 콘텐츠_접근성_지침_2.0
한국형 웹 콘텐츠_접근성_지침_2.0한국형 웹 콘텐츠_접근성_지침_2.0
한국형 웹 콘텐츠_접근성_지침_2.0Hongseok Yeon
 
웹표준을 기반한 크로스 브라우징 표준화 (2005)
 웹표준을 기반한 크로스 브라우징 표준화 (2005) 웹표준을 기반한 크로스 브라우징 표준화 (2005)
웹표준을 기반한 크로스 브라우징 표준화 (2005)Channy Yun
 
Web Standards Seminar 2006
Web Standards Seminar 2006Web Standards Seminar 2006
Web Standards Seminar 2006
Taeyoung Yoon
 
01.모바일 프레임워크 이론
01.모바일 프레임워크 이론01.모바일 프레임워크 이론
01.모바일 프레임워크 이론
Hankyo
 
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
Taeyong Kim
 
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
Taeyong Kim
 

Similar to [11/25 정보접근성 세미나]미 교통부(Dot) 장애인 접근성 의무화 준수 대응 방안(국내외 동향) (주)에이매스컨설팅 김근우 전임 (20)

개발자를 위한 웹표준 & 웹접근성이야기
개발자를 위한 웹표준 & 웹접근성이야기개발자를 위한 웹표준 & 웹접근성이야기
개발자를 위한 웹표준 & 웹접근성이야기
 
2.보건복지정보개발원 2부(국가표준 및 품질마크)자료
2.보건복지정보개발원 2부(국가표준 및 품질마크)자료2.보건복지정보개발원 2부(국가표준 및 품질마크)자료
2.보건복지정보개발원 2부(국가표준 및 품질마크)자료
 
다음카카오 Pc&Mobile 웹 접근성 개선 사례
다음카카오  Pc&Mobile 웹 접근성 개선 사례다음카카오  Pc&Mobile 웹 접근성 개선 사례
다음카카오 Pc&Mobile 웹 접근성 개선 사례
 
A Case Study on Accessibility of Online Learning Content in Korea
A Case Study on Accessibility of Online Learning Content in KoreaA Case Study on Accessibility of Online Learning Content in Korea
A Case Study on Accessibility of Online Learning Content in Korea
 
DIK accessible technique
DIK accessible techniqueDIK accessible technique
DIK accessible technique
 
워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)
워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)
워드프레스로 웹 접근성 칭찬받기 (워드프레스 미트업)
 
04.발표 반응형웹에서접근성확보방법
04.발표 반응형웹에서접근성확보방법04.발표 반응형웹에서접근성확보방법
04.발표 반응형웹에서접근성확보방법
 
웹접근성지침 2012 0701
웹접근성지침 2012 0701웹접근성지침 2012 0701
웹접근성지침 2012 0701
 
웹접근성캠프서울 반응형웹에서의접근성확보방법
웹접근성캠프서울 반응형웹에서의접근성확보방법웹접근성캠프서울 반응형웹에서의접근성확보방법
웹접근성캠프서울 반응형웹에서의접근성확보방법
 
HTML5 and Smart TV
HTML5 and Smart TVHTML5 and Smart TV
HTML5 and Smart TV
 
Top 10 Questions about HTML5
Top 10 Questions about HTML5Top 10 Questions about HTML5
Top 10 Questions about HTML5
 
DevOn PT (Korea Web Accessibility Group)
DevOn PT (Korea Web Accessibility Group)DevOn PT (Korea Web Accessibility Group)
DevOn PT (Korea Web Accessibility Group)
 
04.발표
04.발표04.발표
04.발표
 
Contentsbebop
ContentsbebopContentsbebop
Contentsbebop
 
한국형 웹 콘텐츠_접근성_지침_2.0
한국형 웹 콘텐츠_접근성_지침_2.0한국형 웹 콘텐츠_접근성_지침_2.0
한국형 웹 콘텐츠_접근성_지침_2.0
 
웹표준을 기반한 크로스 브라우징 표준화 (2005)
 웹표준을 기반한 크로스 브라우징 표준화 (2005) 웹표준을 기반한 크로스 브라우징 표준화 (2005)
웹표준을 기반한 크로스 브라우징 표준화 (2005)
 
Web Standards Seminar 2006
Web Standards Seminar 2006Web Standards Seminar 2006
Web Standards Seminar 2006
 
01.모바일 프레임워크 이론
01.모바일 프레임워크 이론01.모바일 프레임워크 이론
01.모바일 프레임워크 이론
 
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
 
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
가격비교 사이트에서의 사용자 경험(USER EXPERIENCE DESIGN)에 대한 이야기
 

[11/25 정보접근성 세미나]미 교통부(Dot) 장애인 접근성 의무화 준수 대응 방안(국내외 동향) (주)에이매스컨설팅 김근우 전임

  • 1. Web Accessibility 2015 / Amass 미 교통부(US-DOT) 장애인 접근성 의무화 준수 대응 방안 (국내외 동향)
  • 2. 2 Web Accessibility Guide TABLE OF CONTENTS Contents 개요 WCAG2.0 ⇔ KWCAG2.0 비교 한국형 웹 콘텐츠 접근성 지침(KWCAG)2.0 W3C 웹 콘텐츠 접근성 지침(WCAG)2.0 WCAG2.0 사례 분석 WCAG2.0 대응 고려사항 맺음말
  • 4. Web Accessibility Guide 4 개요 US DOT(교통부) 대응 접근성 개선  2013년 12월 12일 US DOT(미국 교통부) 홈페이지 및 키오스크의 장애인 접근성 규정 의무화 공지 # 내용 1) 미국 소비자를 대상으로 하는 웹사이트를 운영하고 있는 항공사는 장애인 고객을 위해 웹 접근성을 개선해야 함 2) 항공권 판매자는 추가비용 없이 장애인 고객에게 비장애인 고객과 동일한 서비스를 제공해야 함 3) 항공사는 홈페이지에 장애인을 위한 서비스를 요청 할 수 있는 기능을 설치해야 함 - 국제항공운송협회 공문 - # 적용대상 1) 좌석수가 60석 이상인 항공기를 최소 1대 운항하고 있는 미국 및 외국 항공사 2) 미국 소비자를 대상으로 홈페이지를 운영하고 있는 항공사 # 적용범위 1) 1단계 : 2015년 12월 12일까지 ①예약 및 예약변경 ②체크인 ③개인여행 일정 확인 ④항공편 상태 확인 ⑤마일리지 계정 확인 ⑥항공편 스케줄 확인 ⑦항공사 연락처 확인 2) 2단계 : 2016년 12월 12일까지 1단계를 제외한 모든 범위 # 기술표준 1) 국제표준화기구인 W3C의 웹 접근성 규정(WCAG2.0) A~AA 조건 충족
  • 5. 5 Web Accessibility Guide WCAG2.0 ⇔ KWCAG 2.0 비 교
  • 6. Web Accessibility Guide 6 WCAG 2.0 1.1 대체텍스트 1.2 시간 기반 미디어 대체 콘텐츠 1.3 정보 또는 구조 소실 없는 콘텐츠 1.4 전경/배경색 구분 및 더 쉽게 듣고 볼 수 있는 콘텐츠 2.1 모든 기능을 키보드로 제공 2.2 충분한 시간 제공 2.3 광 과민성 발작 예방 2.4 네비게이션 제공 3.1 가독성 3.2 예측가능성 3.3 입력도움 4.1 보조공학을 포함한 웹 표시장치와 호환성의 극대화 WCAG2.0 ⇔ KWCAG2.0 비교 WCAG2.0과 KWCAG2.0 비교 # KWCAG 2.0은 WCAG의 4대원칙을 따르고 있으며, KWCAG 2.0의 세부지침을 국내 실정에 맞춰 반영 되었다. KWCAG 2.0 1.1 대체텍스트 1.2 멀티미디어 대체 수단 1.3 명료성 2.1 키보드 접근성 2.2 충분한 시간 제공 2.3 광 과민성 발작 예방 2.4 쉬운 네비게이션 3.1 가독성 3.2 예측가능성 3.3 콘텐츠 논리성 3.4 입력도움 4.1 문법 준수 4.2 웹 어플리케이션 접근성 인식의 용이성 운용의 용이성 이해의 용이성 견고성
  • 8. Web Accessibility Guide 8 KWCAG2.0 지침 한국형 웹 콘텐츠 접근성 지침 2.0 (KWCAG 2.0) 준수 항목 [1] 인식의 용이성 1.1. 대체 텍스트 1.1.1. 적절한 대체 텍스트 제공 1.2. 멀티미디어 대체 수단 1.2.1. 멀티미디어 콘텐츠에는 적절한 자막을 제공해야 한다. 1.3. 명료성 1.3.1. 콘텐츠는 색에 관계없이 인식되어야 한다. 1.3.2. 지시사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 한다. 1.3.3. 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상이어야 한다. 1.3.4. 자동으로 재생되는 배경 음을 사용하지 않아야 한다. [2] 운용의 용이성 2.1. 키보드 접근성 2.1.1. 모든 기능은 키보드만으로도 사용할 수 있어야 한다. 2.1.2. 키보드에 의한 초점은 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다. 2.2. 충분한 시간 제공 2.2.1. 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있어야 한다. 2.2.2. 자동으로 변경되는 콘텐츠는 움직임을 제어할 수 있어야 한다. 2.3. 광과민성 발작 예방 2.3.1. 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 한다. 2.4. 쉬운 네비게이션 2.4.1. 콘텐츠의 반복되는 영역은 건너뛸 수 있어야 한다. 2.4.2. 페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야 한다. 2.4.3. 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 한다. [3] 이해의 용이성 3.1. 가독성 3.1.1. 주로 사용하는 언어를 명시해야 한다. 3.2. 예측 가능성 3.2.1. 사용자가 의도하지 않은 기능(새 창, 초점 변화)은 실행되지 않아야 한다. 3.3. 콘텐츠의 논리성 3.3.1. 콘텐츠는 논리적인 순서로 제공해야 한다 3.3.2. 표는 이해하기 쉽게 구성해야 한다. 3.4. 입력 도움 3.4.1. 입력서식에는 대응하는 레이블을 제공해야 한다. 3.4.2. 입력오류를 정정할 수 있는 방법을 제공해야 한다. [4] 견고성 4.1. 문법 준수 4.1.1. 마크업 언어의 요소는 열고 닫음, 중첩관계 및 속성선언에 오류가 없어야 한다. 4.2. 웹 애플리케이션 접근성 4.2.1. 콘텐츠에 포함된 웹 애플리케이션은 접근성이 있어야 한다.
  • 10. Web Accessibility Guide 10 WCAG2.0 지침 인식의 용의성(인지 - 정보와 인터페이스 구성요소는 사용자가 인지할 수 있는 방법으로 표시해야 한다.) 1.1 텍스트 아닌 콘텐츠는 확대, 점자, 음성, 기호 또는 단순한 언어 등 다른 양식을 원하는 사람들의 욕구에 대응할 수 있도록 대체 텍스트를 제공해야 한다. 1.1.1 Non-text Content (수준 A) = (KWCAG 2.0지침 1.1.1) 1.2 실시간 미디어에 대한 대체 수단을 제공해야 한다. 1.2.1 음성과 영상 (녹화) Audio-only and Video-only (Prerecorded) (수준 A) = (KWCAG 2.0지침 1.2.1) 1.2.2 자막 (녹화) Captions (Prerecorded) (수준 A) = (KWCAG 2.0지침 1.2.1) 1.2.3 음성 해설 또는 미디어 대체 (녹화) Audio Description or Media Alternative (Prerecorded) (수준 A) = (KWCAG 2.0지침 1.2.1) 1.2.4 자막 (실시간) Captions (Live) (수준 AA) = (KWCAG 2.0지침 1.2.1) 1.2.5 음성 해설 (실시간) Audio Description (Prerecorded) (수준 AA) = (KWCAG 2.0지침 1.2.1) 1.2.6 수화 (녹화) (수준 AAA) 1.2.7 추가된 음성 해설 (녹화) (수준 AAA) 1.2.8 미디어 대체 (녹화) (수준 AAA) 1.2.9 음성 (실시간) (수준 AAA) 1.3 콘텐츠는 정보 또는 구조의 손실 없이 다른 형태(예를 들면 더 단순하게)로 표시될 수 있도록 제작해야 한다. 1.3.1 정보와 관계 Info and Relationships (수준 A) = (KWCAG 2.0지침 1.3.1, 2.4.2, 3.3.2) 1.3.2 의미 있는 배열 Meaningful Sequence (수준 A) = (KWCAG 2.0지침 3.3.1) 1.3.3 감각적인 특성 Sensory Characteristics (수준 A) = (KWCAG 2.0지침 1.3.2) 1.4 배경으로부터 전경을 분리하는 것을 포함하여 콘텐츠는 사용자가 보고 듣기 쉽게 제작해야 한다. 1.4.1 색의 사용 Use of Color (수준 A) = (KWCAG 2.0지침 1.3.2) 1.4.2 음성 제어 Audio Control (수준 A) = (KWCAG 2.0지침 1.3.4) 1.4.3 명암 대비 (Minimum) Contrast (Minimum) (수준 AA) = (KWCAG 2.0지침 1.3.3) 1.4.4 문자 크기 변경 Resize text (수준 AA) = (KWCAG 2.0지침 없음) 1.4.5 문자 이미지 Images of Text (수준 AA) = (KWCAG 2.0지침 없음) 1.4.6 명암 대비 (Enhanced) (수준 AAA) 1.4.7 Low or No Background Audio (수준 AAA) 1.4.8 시각적 표현 (수준 AAA) 1.4.9 문자 이미지 (No Exception) (수준 AAA)
  • 11. Web Accessibility Guide 11 WCAG2.0 지침 운용의 용의성 (운용 - 사용자 인터페이스 구성요소와 탐색 기능은 조작이 가능해야 한다.) 2.1 키보드로 모든 기능이 가능하도록 제작해야 한다. 2.1.1 키보드 Keyboard (수준 A) = (KWCAG 2.0지침 2.1.1) 2.1.2 키보드 트랩 방지 No Keyboard Trap (수준 A) = (KWCAG 2.0지침 2.1.1) 2.1.3 키보드 (No Exception) (수준 AAA) 2.2 사용자가 콘텐츠를 읽고 사용할 수 있는 충분한 시간을 제공해야 한다. 2.2.1 시간 조절 Timing Adjustable (수준 A) = (KWCAG 2.0지침 2.2.1) 2.2.2 Pause, Stop, Hide (수준 A) = (KWCAG 2.0지침 2.2.2) 2.2.3 타이밍 금지 (수준 AAA) 2.2.4 중단 (수준 AAA) 2.2.5 재 인증 (수준 AAA) 2.3 발작을 일으키는 것으로 알려진 콘텐츠를 디자인 하면 안 된다. 2.3.1 3회의 번쩍임 또는 임계치 이하 Three Flashes or Below Threshold (수준 A) = (KWCAG 2.0지침 2.3.1) 2.3.2 3회의 번쩍임 (수준 AAA) 2.4 탐색하거나 콘텐츠를 찾거나 위치를 판단할 수 있도록 도울 방법을 제공해야 한다. 2.4.1 블럭 우회 Bypass Blocks (수준 A) = (KWCAG 2.0지침 2.4.1) 2.4.2 페이지 제목 달기 Page Titled (수준 A) = (KWCAG 2.0지침 2.4.2) 2.4.3 포커스 순서 Focus Order (수준 A) = (KWCAG 2.0지침 2.1.2) 2.4.4 링크 목적 (In Context Link Purpose (In Context) (수준 A) = (KWCAG 2.0지침 2.4.3) 2.4.5 다양한 방법 Multiple Ways (수준 AA) = (KWCAG 2.0지침 없음) 2.4.6 Headings and Labels (수준 AA) = (KWCAG 2.0지침 2.4.2) 2.4.7 Focus Visible (수준 AA) = (KWCAG 2.0지침 2.1.2) 2.4.8 Location (수준 AAA) 2.4.9 링크 목적 (Link Only) (수준 AAA) 2.4.10 Section Headings (수준 AAA)
  • 12. Web Accessibility Guide 12 WCAG2.0 지침 이해의 용의성 (이해 - 정보와 사용자 인터페이스 조작은 이해할 수 있어야 한다.) 3.1 콘텐츠는 읽고 이해할 수 있도록 제작해야 한다. 3.1.1 페이지 언어 Language of Page (수준 A) = (KWCAG 2.0지침 3.1.1) 3.1.2 부분 언어 Language of Parts (수준 AA) = (KWCAG 2.0지침 없음) 3.1.3 낯선 단어 (수준 AAA) 3.1.4 약어 (수준 AAA) 3.1.5 독서 수준 (수준 AAA) 3.1.6 발음 (수준 AAA) 3.2 웹 페이지의 출현과 조작은 예측할 수 있도록 제작해야 한다. 3.2.1 On Focus (수준 A) = (KWCAG 2.0지침 3.2.1) 3.2.2 On Input (수준 A) = (KWCAG 2.0지침 3.2.1) 3.2.3 일관된 탐색 Consistent Navigation (수준 AA) = (KWCAG 2.0지침 3.3.1) 3.2.4 일관된 식별 Consistent Identification (수준 AA) = (KWCAG 2.0지침 3.4.1) 3.2.5 요청에 의한 변화 (수준 AAA) 3.3 실수를 예방하고 정정할 수 있도록 사용자를 도와야 한다. 3.3.1 오류 식별 Error Identification (수준 A) = (KWCAG 2.0지침 3.4.2) 3.3.2 레이블 또는 설명 Labels or Instructions (수준 A) = (KWCAG 2.0지침 3.4.1) 3.3.3 오류 의견 Error Suggestion (수준 AA) = (KWCAG 2.0지침 3.4.2) 3.3.4 오류 예방 (Legal, Financial, Data) Error Prevention (Legal, Financial, Data) (수준 AA) = (KWCAG 2.0지침 없음) 3.3.5 Help (수준 AAA) 3.3.6 오류 예방 (All) (수준 AAA) 견고성 (신뢰 - 콘텐츠는 보조 기술을 포함한 다양한 사용자 응용 프로그램에 의하여 해석이 가능하도록 충분히 견고해야 한다.) 4.1 보조 기술을 포함하여 현재와 미래의 사용자 응용 프로그램 호환성을 극대화 해야 한다. 4.1.1 Parsing (수준 A) = (KWCAG 2.0지침 4.1.1) 4.1.2 Name, Role, Value (수준 A) = (KWCAG 2.0지침 4.1.1)
  • 13. 13 Web Accessibility Guide WCAG 2.0 사례 분석 영문홈페이지 WCAG2.0 개선 사항
  • 14. Web Accessibility Guide 14 영문홈페이지 WCAG2.0 개선 사항 1.1.1 Non-text Content (수준 A) 영문 사이트임에도 한국어로 된 대체 텍스트를 제공함 예제> <공통영역> <메인 페이지> • 한국어 사이트를 기반으로 다국어 사이트가 개발된 것으로 판단되어지며 각 사이트에서 사용된 언어에 따른 대체 텍스트 제공되어야 함. • 텍스트가 아닌 콘텐츠에 대한 대체 콘텐츠 제공은 콘텐츠를 인식하는 최소한의 항목이므로 가장 필수적인 웹 접근성 준수를 위한 작업임.
  • 15. Web Accessibility Guide 15 영문홈페이지 WCAG2.0 개선 사항 1.3.1 Info and Relationships (수준 A) 테이블 구조는 테이블의 정보를 제공하여 마크업 되어야 함. 예제> <다수의 테이블> • 데이터 테이블의 경우 테이블 구조에 대한 정보를 마크업에 같이 제공하여야 함.
  • 16. Web Accessibility Guide 16 영문홈페이지 WCAG2.0 개선 사항 1.4.4 문자 크기 변경 Resize text (수준 AA) 전체 페이지에서(브라우저에서 지원하는) 화면확대를 Control 할 수 있는 기능을 구현  저 시력 장애인 등을 위한 기능으로 홈페이지의 레이아웃을 유지한 채 텍스트 글꼴의 크기만 확대/축소 되도록 제공하여야 한다.  브라우저의 기본 확대/축소 기능과 동일한 화면확대 버튼 Control 기능 제공을 제공하여 화면확대를 미지원하는 브라우저도 지원할 수 있도록 개선하여 야 한다. 1 1
  • 17. Web Accessibility Guide 17 영문홈페이지 WCAG2.0 개선 방안 2.1.1 키보드 Keyboard (수준 A) 키보드만으로 모든 기능을 제어 가능하게 하여야 한다.  키보드를 통하여 롤링 배너에 대한 접근이 가능하여야 하나 비주얼 배너 전체 영역만 선택된다.  2.2.2 Pause, Stop, Hide (수준 A) 기능을 제공하고 있으나 제어가 불가능 하므로 개선이 필요하다. 1
  • 18. Web Accessibility Guide 18 영문홈페이지 WCAG2.0 개선 사항 2.4.2 페이지 제목 달기 Page Titled (수준 A) 사용 언어에 맞는 페이지 제목을 제공해야 함. 예제>  사용자가 목표한 페이지에 명확히 이동하였는지에 대하여 Page Title을 Navigation에 맞게 제공한다.  시각장애인의 경우 링크를 통한 첫 페이지에 이동 시 현재 본인의 위치를 Page Title을 통하여 파악 한다. 만약 해당 페이지명만 제공할 경우 상위페이지에 대한 트리 구조를 분실하게 되므로 통일되게 개선하여야 한다. 1
  • 19. Web Accessibility Guide 19 영문홈페이지 WCAG2.0 개선 사항 2.4.3 Focus Order (수준 A) 레이어팝업 작업 완료 후 레이어팝업을 요청한 작업으로 되돌아 가지 못함 • 레이어팝업을 호출하여 해당 기능을 실행 한 뒤 레이어팝업을 닫게 되면 이전에 진행하던 작업을 계속 가능하도록 해야 하나 초점이 페이지 처음 링크로 돌아가는 문제가 있음. • 키보드 사용자는 제주항공의 서비스를 받기 위해 많은 불편이 존재하므로 반드시 수정해야 함. <다수 존재>
  • 20. Web Accessibility Guide 20 영문홈페이지 WCAG2.0 개선 방안 2.4.4 링크 목적 In Context Link Purpose (In Context) (수준 A) 링크가 제공되는 콘텐츠의 경우 명확한 목적을 제시하여야 한다.  <a>링크를 통하여 Wallpaper를 다운받는 기능을 제공하고 있으나 1280X1024 등 숫자를 통한 사이즈만 제공하고 있다.  어떠한 파일 인지, 새 창 열림인지 다운로드인지를 명확히 명시할 필요성이 있다.  목적 및 콘텐츠가 무엇인지 명확하게 제시하여야 한다. 1
  • 21. Web Accessibility Guide 21 영문홈페이지 WCAG2.0 개선 사항 2.4.5 다양한 방법 Multiple Ways (수준 AA) 콘텐츠의 위치(경로)를 찾아내는 방안(테크닉) # 사이트 맵은 다양한 목적들을 수행한다.  사이트 전체에 대한 개요를 제공한다.  사이트가 어떠한 것을 포함하고 있고, 그러한 콘텐츠들이 어떻게 조직화되어 있는지 사용자가 이해하는 것을 돕는다.  사이트의 다양한 부분에서 서로 다르게 나타날 수 있는 네비게이션 바 들의 복잡함을 경감하는 대체수단을 제공한다. # 차례는 두 가지 목적을 가지고 있다. (내용이 많은 페이지이며, 문단 구분되는 데이터가 있는 문서의 경우 제공)  사용자에게 문서의 콘텐츠와 구조에 대한 훑어보기를 제공한다.  독자들이 온라인 문서의 특정 섹션으로 바로 갈 수 있도록 한다.. # 관련 웹 페이지 탐색 링크 제공  연관된 웹 페이지들을 가리키는 링크들을 제공함으로써 사용자가 추가적인 정보를 얻을 수 있도록 하는 것 # 사용자가 콘텐츠를 찾아내는 것을 돕는 검색 기능 제공  웹 페이지를 검색하는 검색 기능을 제공하는 것은 사용자에게 콘텐츠를 찾을 방법을 제공하는 디자인 전략 # 사용자가 콘텐츠를 찾아내는 것을 돕는 검색 기능 제공  웹 페이지를 검색하는 검색 기능을 제공하는 것은 사용자에게 콘텐츠를 찾을 방법을 제공하는 디자인 전략
  • 22. Web Accessibility Guide 22 영문홈페이지 WCAG2.0 개선 사항 3.1.1 Language of Page (수준 A) 영문 사이트임에도 페이지 언어가 한국어로 제공함 예제> <공통영역> • 한국어 사이트를 기반으로 다국어 사이트가 개발된 것으로 판단되어지며 각 사이트에서 사용된 언어에 맞도록 언어 속성이 제공되어야 함. • 스크린리더 사용자를 위해 정확한 언어를 제공해야 함.
  • 23. Web Accessibility Guide 23 영문홈페이지 WCAG2.0 개선 사항 3.1.2 부분 언어 Language of Parts (수준 AA) 콘텐츠에서 각 절이나 문구의 언어는 프로그램방식으로 결정될 수 있어야 한다. # 콘텐츠의 부분에 포함된 타 언어.  콘텐츠에서 각 절이나 문구의 언어(human language)는 적절한 이름, 기술적 용어, 결정되지 않은 언어의 단어들, 텍스트 주위의 즉각적인 일 상용어의 부분이 되는 단어들이나 문장들은 제외하고 프로그램방식으로 결정(programmatically determined)될 수 있어야 한다. <blockquote xml:lang="de"> <p> Da dachte der Herr daran, ihn aus dem Futter zu schaffen, aber der Esel merkte, daß kein guter Wind wehte, lief fort und machte sich auf den Weg nach Bremen: dort, meinte er, könnte er ja Stadtmusikant werden. </p> </blockquote> 예제> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" height="420" id="myMovie" lang="fr" width="780" xml:lang="fr"> <param name="movie" value="myMovie.swf"/> <!--[if !IE]>--> <object data="languages.swf" height="420" lang="fr" type="application/x-shockwave-flash" width="780" xml:lang="fr"> <!--<![endif]--> <!--[if !IE]>--> </object> <!--<![endif]--> </object>
  • 24. Web Accessibility Guide 24 영문홈페이지 WCAG2.0 개선 방안 3.3.2 레이블 또는 설명 Labels or Instructions (수준 A) 레이블에 대한 명확한 Title 제공  레이블에 대한 명확한 Title 제공을 통해 해당 레이블의 기능을 인지할 수 있어야 하나, 다국어 홈페이지의 레이블에 한글을 제공하고 있어 해당 국가의 사용자가 혼동을 일으키게 한다.  레이블에 대한 명확한 Title 번역을 통한 개선이 필요하다. 1 2 3
  • 25. Web Accessibility Guide 25 다국어홈페이지 WCAG2.0 개선 방안 3.3.4 오류 예방 (Legal, Financial, Data) Error Prevention (Legal, Financial, Data) (수준 AA) # 법적인 책임/금융거래/자료저장시스템의 경우 원상회복/점검/확인이 가능하여야 한다.  전송을 완료하기 전 검토, 확인, 교정이 가능하여야 한다. 1
  • 26. 26 Web Accessibility Guide WCAG 2.0 대응 고려사항
  • 27. Web Accessibility Guide 27 WCAG2.0 대응 고려사항 # WCAG2.0의 수준A~AA 항목에 대한 접근성 개선을 진행하면서 가장 우선적으로 고려했던 사항은 다음과 같다. WCAG2.0 대응 고려사항 국제표준 WCAG2.0은 4개 원칙, 12지침, 38항목(수준A~AA)의 가이드라인을 제공하고 있으며, 그에 따른 다양한 General Techniques을 제공하여 해당 내용에 따라 접근을 할 수 있다. #참조 • http://www.w3.org/TR/WCAG20/ • http://www.wah.or.kr/w3c_doc/techs/general.html • KWCAG2.0과 비교하여 같은 방식으로 웹 접근성을 제공할 수 있는가? • KWCAG2.0과 매칭 되지 않는 항목에 대하여 어떻게 접근을 해야 하는가? • 기준이 만들어 진지 오래되어 현재의 기술에 대응이 되지 않는 경우 어떻게 접근하여야 하는가? • 예외기준을 적용할 방안이 있는가? 위와 같은 고민 속에 국내 항공사에 대한 WCAG2.0 기준을 나름대로 정리하여 적용을 하였으며, 시행착오 끝에 프로젝트를 마무리하고 있다. # 이슈사항 - 주요 가장 고려사항은 WCAG2.0 수준A~AA에서 까지의 적용 방안 중 예외처리가 가능 부분이 있는가? - 만약 예외처리를 했을 경우 해당 부분에 대하여 누가 보장하는가?  결론 : WCAG2.0의 접근성 기준을 최대한 적용하여 누락사항이 없도록 서비스를 제공한다.
  • 29. 29 Web Accessibility Guide 맺음말 본 사업을 수행하면서 느낀 점은 홈페이지를 포함하여 IT분야의 장애인 접근성은 국내에 국한된 문제가 아닌 전세계적인 이슈로 보여지고 있습니다.  고령화되어 가는 사회  소외계층에 대한 복지  장애인에 대한 시선변화 등 앞으로도 선진국가에서 자국의 시민을 위한 복지정책은 높아져만 갈 것이며, 이에 따라 외국 사용자를 대상으로 서비스하는 국내 기업들의 장애인 접근성은 필수적으로 지켜야 하는 항목이 되리라 보여집니다.