접근성과 웹 The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. Tim Berners-Lee, the inventor

Size: px

Start display at page:

Download "접근성과 웹 The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. Tim Berners-Lee, the inventor "

연수 류(유)
8 years ago
Views:

1 웹 접근성 : 최근 동향 신정식 jshin@i18nl10n.com 웹 접근성 : 최근 동향 2 / 30 신정식

2 접근성과 웹 The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. Tim Berners-Lee, the inventor of the web 웹 접근성 : 최근 동향 3 / 30 신정식 두 가지 꿈 정보 공유를 통해 소통할 수 있는 공통의 정보 공간 공간 상에서 일어나는 우리의 소통을 컴퓨터가 분석, 이해, 나아가 우리의 좌표와 보다 나은 협력 방법 제시 Tim Berners-Lee, 1998 웹 접근성 : 최근 동향 4 / 30 신정식

Tim Berners-Lee, the inventor of the web 웹 접근성 : 최근 동향 3 / 30 신정식 두 가지 꿈 정보 공유를

3 접근성 장치 독립성 상호 운용성 사용자 편의성 웹 표준 준수 구조, 내용, 표현 양식 분리 의미론적/있는 웹 (Symantic Web) : 기계 친화성 웹 접근성 : 최근 동향 5 / 30 신정식 (2) 접근성 사용성 웹 표준/상호 운용성 장치 독립성 웹 접근성 : 최근 동향 6 / 30 신정식 웹 표준/상호 운용성

4 (3) 접근성 웹 접근성 : 최근 동향 7 / 30 신정식 사용성 (4) 웹 표준/상호 운용성 장치 독립성 웹 표준/상호 운용성 장치 독립성 접근성 웹 접근성 : 최근 동향 8 / 30 신정식

5 접근성의 필수 요소 웹 상의 정보를 이루는 내용물 텍스트, 그림, 사운드, 동영상 구조와 표현 양식을 지정하는 코드, 마크업 웹 브라우저, 미디어 재생기 등 웹 표시 장치 화면 낭독기, 대체 키보드, 화면 확대기 등 장애인 보조 장치 사용자의 지식, 경험, 어떤 경우에는 웹 사용을 위해 특화된 전략 웹 디자이너, 마크업 작성자, 내용물 저자 등 웹 개발자 (장애를 가진 개발자 포함) 웹 접근성 : 최근 동향 9 / 30 신정식 접근성의 필수 요소 간의 관계 웹 개발자는 저작 도구와 평가 도구를 써서 웹 내용물을 창작 웹 사용자는 웹 브라우저, 미디어 재생기, 보조 기구나 다른 웹 표시 장치를 써서 웹 내용물을 읽고, 보고, 듣고 파악하면서 상호 작용 WCAG (웹 내용물 접근성 지침) ATAG (웹 저작 도구 접근성 지침) UAAG (웹 표시 장치 접근성 지침) 웹 접근성 : 최근 동향 10 / 30 신정식

9 / 30 신정식 접근성의 필수 요소 간의 관계 웹 개발자는 저작 도구와 평가 도구를 써서 웹 내용물을 창작 웹 사용자는 웹 브라우저, 미디어 재생기, 보조 기구나 다른 웹 표시 장치를 써서 웹 내용물을

6 웹 저작 도구 접근성 지침 (1) 2000년 2월, 지침 1.0 발표 WCAG 2.0 개발과 아울러 2.0 준비 중 한국어 번역 2002년 9월, 기법 문서 발표 : 영어 원문 ( 개관 : 웹 접근성 : 최근 동향 11 / 30 신정식 웹 저작 도구 접근성 지침 (2) 접근성 있는 웹 내용물 생산 누구나 웹 내용물 저작 가능 사용자에게 접근성 관련 정보 제공 접근성 검사 및 접근성 없는 내용물 교정 접근성을 look and feel, 도움말, 문서 등에 포함 3단계 중요도 수준 : WCAG 중요도와 대응 웹 접근성 : 최근 동향 12 / 30 신정식

php 웹 접근성 : 최근 동향 11 / 30 신정식 웹 저작 도구 접근성 지침 (2) 접근성 있는 웹 내용물 생산 누구나 웹 내용물 저작 가능 사용자에게 접근성 관련 정보

7 웹 저작 도구 접근성 지침 (3) 적용 대상 HTML/XML용 편집기 (특히, WYSWYG) 웹 형식으로 문서를 저장할 수 있는 워드 프로세서, DTP 프로그램 웹 형식 문서 변환 도구 : latex2html, sgml2html, XML/XSL 웹용 멀티 미디어 저작 도구 : SMIL 저작 도구, 비디오 편집기 웹 사이트 괸리 및 출판 도구 : CMS, Wiki, Blog, 신문 기사 작성 도구, 웹 게시판 내용물 배치 도구 : CSS formtter 등 누가 알아야 하나? 저작 도구 개발자 : Blog, CMS, 게시판 theme/skin 포함 저작 도구 평가 및 선택권이 있는 관리자, 정책 결정자 웹 접근성 : 최근 동향 13 / 30 신정식 ATAG : 몇 가지 보기 도구가 지원하는 마크업 언어로 접근성 있는 콘텐츠를 만들 수 있도록 보장해야 한다. (1) 도구는 자동으로 유효한 마크업을 생성해야 한다. (1) 접근성 있는 콘텐츠 개발을 장려하는 모든 기능을 문서화해야 한다. (1) 저자에게 등가인 대체 정보를 제공하도록 요구해야 한다. (1) 내용을 채워 넣을 수 있도록 제공하는 주형(template)이 WCAG 1.0의 기준에 부합해야 한다 (2) 구조화된 콘텐츠를 만들고, 정보의 내용을 표현 방법과 분리하는 것을 도와 주어야 한다. (2) 접근성 관련 문제점의 존재 유무를 검사하고 저자에게 (문제점에 대해) 알려 주어야 한다. (2) 멀티 미디어 내용물에 대한 등가 대체물을 관리하고, 편집하고, 재사용할 수 있는 기능을 제공해야 한다. (3) 웹 접근성 : 최근 동향 14 / 30 신정식

저작 도구 개발자 : Blog, CMS, 게시판 theme/skin 포함 저작 도구 평가 및 선택권이 있는 관리자, 정책 결정자 웹 접근성 : 최근 동향 13 / 30 신정식 ATAG : 몇 가지 보기 도구가 지원하는 마크업 언어로 접근성 있는 콘텐츠를 만들 수 있도록 보장해야 한다. (1) 도구는 자동으로 유효한 마크업을 생성해야 한다.

8 저작 도구 접근성 사례 (1) 표 (신문 기사) 그림 파일로 처리 ( 보기 1, 보기 2, 보기 3, 좀 다른 보기) pre tag 사용 table 용이한 생성 방법 제공 필요 기사 작성 도구에서 표 입력 위한 쉬운 방법 제공 필요 몇몇 Wiki에서는 제공 그래프, 사진 그림 파일 alt나 longdesc 요구 필요 멀티미디어 저자에게 최소한 문제점 알릴 필요 모든 부담을 저자에게 지울 수 있는가? Tim Berners-Lee : tagging 등 Web 2.0 식 해결법 제안 c.f. : object vs embed 웹 접근성 : 최근 동향 15 / 30 신정식 저작 도구 접근성 사례 (2) Blog 및 웹 게시판의 theme, 스킨 색상 대조 도구 : WAT-C에서 개발 글자 크기 지나치게 작은 아이콘 (alt 제공하지 않음) Blogging 도구 ATAG 관점 평가 및 개선 필요 Word Press : Joe Clark의 평가 Google Blogger : Word Press에 비해 더 많은 문제점 Movable Type, 테터툴즈, 이글루, 네이버 블로그 등 웹 접근성 : 최근 동향 16 / 30 신정식

: object vs embed 웹 접근성 : 최근 동향 15 / 30 신정식 저작 도구 접근성 사례 (2) Blog 및 웹 게시판의 theme, 스킨 색상 대조 도구 : WAT-C에서 개발 글자 크기 지나치게 작은 아이콘 (alt 제공하지 않음)

9 WCAG : 지침 발표 2003, 한국어 번역 (신승식) 14개 지침 및 하위 체크 포인트 중요도 : 3단계. 많은 경우 중요도 1,2만 현실적 기법 문서 : Core, HTML, CSS 한국형 웹 접근성 지침의 기반 웹 접근성 : 최근 동향 17 / 30 신정식 WCAG 2.0 (1) 현재 마무리 단계 1.0에 대한 비판 수용 HTML 이외의 새로운 웹 기술 (script, 멀티 미디어, 애플릿, SVG, AJAX 등) 4대 디자인 원칙 내용물 인지 가능성 (4) 사용자 인터페이스 사용 가능 (5) 내용물과 제어 요소 이해 가능 (2) 내용물의 (미래 기술에 대한) 견고성 (2) 각 디자인 원칙에 하위 지침 각 지침에 따른 성공적 적용 기준 제시 1.0과 마찬가지로 3단계 중요도 웹 접근성 : 최근 동향 18 / 30 신정식

10 WCAG 2.0 (2) Baseline 개념 도입 이해 문서 : 의도, 용어, 기법, 성공 및 실패 사례, 이점 기법 문서 일반적 기법 HTML, CSS, Script (클라이언트 및 서버 측) SMIL Plain text 흔한 실수 Quick Reference 웹 접근성 : 최근 동향 19 / 30 신정식 WCAG 1.0 vs 2.0 (1) WAI WG의 견해 좀더 견고 기술 중립적 검사 용이성 용어 정의 명료화 좀더 많은 보조 정보 제공 기법 문서 : 훨씬 상세, 이해 문서와 유기적 연계 1.0과 비교 1.0 체크 포인트와 2.0 성공 기준 1:1 대조 웹 접근성 : 최근 동향 20 / 30 신정식

11 WCAG 1.0 vs 2.0 (2) 비판 (Joe Clark : To Hell with WCAG 2.0) 너무 방대 지나치게 일반적 개발자가 이해 불가능 떄로는 지나치게 구체적 Baseline : 루프 홀 더 이상 W3C 표준 준수 의무 없다? : 적법한 HTML 불필요?? 심지어 화면 자리 배치용 표도 허용 프로그램에 의해 결정 가능 : 루프 홀 혹은 웹 표시 장치에 지나친 부담 (c.f. Opera와 table 선형 표시) 접근성 있는 문서와 그렇지 않은 문서 동시 제공 의무? 충족 여부 시험 불가능? 웹 접근성 : 최근 동향 21 / 30 신정식 정부, 교육, 기업 웹 접근성 : 최근 동향 22 / 30 신정식

: 적법한 HTML 불필요?? 심지어 화면 자리 배치용 표도 허용 프로그램에 의해 결정 가능 : 루프 홀 혹은 웹 표시 장치에 지나친 부담 (c.f.

12 정부, 교육, 기업 정부 한국형 웹 콘텐츠 접근성 지침 정부 기관 웹 사이트 RFP에서 접근성, 웹 표준 준수 등 명시 시각 장애인용 별도 페이지 폐지, TTS 제공 (?) 교육 시각 장애인용 별도 페이지 운영 온라인 교육 매체 접근성 개선 미미 기업 그림 파일 광고 (보기 1, 보기 2) 몇몇 기업의 텍스트 모드 별도 웹 사이트 IBM, MS, Apple,HP, BBC 등 전담 부서 설치와 대조 인식 제고 절실 Business case, 법률 장애인 = 시각 장애인? 웹 접근성 : 최근 동향 23 / 30 신정식 접근성 HTML/CSS에 비해 접근성 떨어짐 (Acrobat 4.0 이전 불가능) tag가 붙은 Acrobat의 경우 JAWS, Windows Eye 등 영어용 화면 낭독기가 처리 가능 (한국어?) tagged : /A (ISO :2005) Document Accessibility Quick Check로 tag 여부 확인 가능 Acroread 음성 변환기 내장 (영어?) Acroread 7 화면 확대기도 지원 구조화된 문서 글자 크기, 색상 대조, hot spot 크기 등 유의 http: // 를 HTML로 무료 변환 서비스 웹 접근성 : 최근 동향 24 / 30 신정식

웹 접근성 : 최근 동향 23 / 30 신정식 접근성 HTML/CSS에 비해 접근성 떨어짐 (Acrobat 4.0 이전 불가능) tag가 붙은 Acrobat의 경우 JAWS, Windows Eye 등 영어용 화면 낭독기가 처리 가능 (한국어?

13 (CAPTCHA) Completely Automated Public Turing test to Tell Computers and Humans Apart 이미지 파일을 이용한 시험은 접근성 문제 (시각 및 인지 장애인) 간단한 상식, 논리 질문 몇 개 (인지 장애) 간단한 계산 (인지 장애) 음성 합성 (시각 및 청각 장애, 시끄러운 환경, 음성 인식) 크레디트 카드, 신분증 번호 (ID 절도, 프라이버시) 휴대 전화 문자 메시지 스팸 필터링 PKI, 공인 인증서 웹 접근성 : 최근 동향 25 / 30 신정식 결어 (웹 관련 개발자로서) 프로 정신 의 또다른 측면은 접근성에 대한 인식이다. (웹은) 모든 이를 수용할 수 있어야 한다. 더욱이, 전체 인구의 약 20%가 (하나 이상의) (웹을 사용하기 위해서) 특수한 설정/기구를 필요로 하다는 사실을 감안하면 더욱 그렇다. 실상 마이크로소프트의 최근 조사에 따르면 거의 50%의 사람들이 그들 컴퓨터를 쓰기 위해 뭔가 조정을 해야 한다고 한다. 50세가 되고 나니, 깨알 같은 글꼴을 쓴 이메일을 받는 게 어떤 것인지 잘 안다. 사람들은 웹 페이지를 보기 위해 (돋보기) 안경을 쓰고 싶어 하지 않는다. Tim Berners-Lee, 웹의 창시자, W3C 총재 웹 접근성 : 최근 동향 26 / 30 신정식

org/tr/turingtest 웹 접근성 : 최근 동향 25 / 30 신정식 결어 (웹 관련 개발자로서) 프로 정신 의 또다른 측면은 접근성에 대한 인식이다. (웹은) 모든 이를 수용할 수 있어야 한다.

14 Resources I : 웹 내용물 접근성 지침 (WCAG) : 웹 저작 도구 접근성 지침 (ATAG) : 웹 표시 장치 접근성 지침 (UAAG) 1.0 2장 : W3C 웹 접근성 (향상) 이니셔티브 (번역되지 않은 많은 문서와 많은 리소스로 가는 링크 : 색상 대비 도구 : 웹 접근성 도구 개발 컨소시엄 웹 접근성 : 최근 동향 27 / 30 신정식 Resources II WordPress-ATAG-evaluation.html : Word Press에 대한 Joe Clark의 평가 : WCAG 1.0과 2.0의 다른 점 : WCAG 2.0 (Last Call 초안) : WCAG 1.0 체크 포인트와 2.0 성공 기준 1:1 비교 : Joe Clark : To Hell with WCAG 2.0 해외 기업의 접근성 전담 부서 : IBM : MS 웹 접근성 : 최근 동향 28 / 30 신정식

org/tools/cca/1.1/ : 색상 대비 도구 http://www.wat-c.org/ : 웹 접근성 도구 개발 컨소시엄 웹 접근성 : 최근 동향 27 / 30 신정식 Resources II http://joeclark.org/access/webaccess/ WordPress-ATAG-evaluation.

15 Resources III : Apple : BBC : 접근성이 왜 기업에 도움이 되는가? 웹 접근성 : 최근 동향 29 / 30 신정식 감사합니다. talk 2006.pdf 웹 접근성 : 최근 동향 30 / 30 신정식

org/ http://www.usability.com.au/ 웹 접근성 : 최근 동향 29 / 30 신정식 감사합니다. http://i18nl10n.

HTML5가 웹 환경에 미치는 영향 고 있어 웹 플랫폼 환경과는 차이가 있다. HTML5는 기존 HTML 기반 웹 브라우저와의 호환성을 유지하면서도, 구조적인 마크업(mark-up) 및 편리한 웹 폼(web form) 기능을 제공하고, 리치웹 애플리케이 션(RIA)을

HTML5가 웹 환경에 미치는 영향 고 있어 웹 플랫폼 환경과는 차이가 있다. HTML5는 기존 HTML 기반 웹 브라우저와의 호환성을 유지하면서도, 구조적인 마크업(mark-up) 및 편리한 웹 폼(web form) 기능을 제공하고, 리치웹 애플리케이 션(RIA)을 동 향 제 23 권 5호 통권 504호 HTML5가 웹 환경에 미치는 영향 이 은 민 * 16) 1. 개 요 구글(Google)은 2010년 5월 구글 I/O 개발자 컨퍼런스에서 HTML5를 통해 플러 그인의 사용이 줄어들고 프로그램 다운로드 및 설치가 필요 없는 브라우저 기반 웹 플랫폼 환경이 점차 구현되고 있다고 강조했다. 그리고 애플(Apple)은 2010년