한국형 웹 콘텐츠 접근성 지침 2.0(Korean Web Content Accessibility Guidelines 2.0)이 2010년 12월 31일자로 확정되었습니다.

본 국가표준은 웹 콘텐츠의 접근성을 향상시키기 위한 기술적 규격을 포함하고 있으며, 개정된 웹 접근성 표준은 원칙(Principle), 지침(Guideline), 검사항목(Requirement)의 3단계로 구성되었다. 웹 접근성 제고를 위한 4가지 원칙과 각 원칙을 준수하기 위한 13개 지침 및 해당 지침의 준수여부를 확인하기 위해 22개의 검사항목으로 구성되어 있다.

자세한 내용은 첨부한 표준 전문을 참고하시기 바랍니다. 감사합니다.

출처 : http://www.wah.or.kr/Board/brd_view.asp?page=1&brd_sn=4&brd_idx=625

1296539622_한국형 웹 콘텐츠 접근성 지침 2.0_KICS_OT-10_0003R1_20101231.pdf

파일 Down : http://www.wah.or.kr/_Upload/pds/한국형%20웹%20콘텐츠%20접근성%20지침%202.0_KICS_OT-10_0003R1_20101231.pdf

1278662874_전자정부서비스_호환성_준수지침_20100624.hwp

전자정부서비스 호환성 준수지침

제정 2009. 8. 19. 행정안전부고시 제2009-185호

개정 2010. 6. 24. 행정안전부고시 제2010-40호

제1조(목적) 이 지침은「전자정부법」제50조에 따라 행정기관 및 공공기관(이하 “행정기관등”이라 한다)이 전자정부서비스의 호환성 확보를 위해 지켜야 할 사항을 규정함을 목적으로 한다.

제2조(용어 정의) 이 지침에서 사용하는 용어의 뜻은 다음과 같으며, 정의하지 아니한 용어는 「전자정부법」 및 동법 시행령을 따른다.

1. “호환성”이란 서비스 이용자 단말기의 하드웨어 및 소프트웨어 환경이 다른 경우에도 동등한 서비스를 제공하는 것을 말한다.

2. “웹페이지”란 인터넷을 통해 문서, 영상, 음성 등의 정보를 제공하기 위해 HTML, CSS, Javascript 등을 사용하여 만들어진 파일을 말한다.

3. “웹사이트”란 특정 서비스를 위해 구성된 웹페이지의 집합체를 말한다

4. “웹브라우저”란 웹페이지를 해석하여 서비스 이용자에게 정보를 전달하는 프로그램을 말한다.

제3조(적용범위) 이 지침은 다른 법령에서 따로 정한 경우를 제외하고는 행정기관등의 장이 전자정부서비스를 구축, 개선, 유지보수 및 운영하는 업무 수행에 적용한다.

제4조(웹사이트 호환성 확보) ① 행정기관등의 장은 전자정부서비스를 위한 웹사이트를 신규 구축하는 경우 기술적 제약이 없는 한 3종 이상의 웹브라우저에서 동등하게 서비스를 제공하도록 하여야 한다.

② 행정기관등의 장은 전자정부서비스를 위한 웹사이트를 개선, 유지보수, 운영하는 경우 기술적 제약이 없는 한 3종 이상의 웹브라우저에서 동등하게 서비스를 제공하도록 노력하여야 한다.

③ 제1항 및 제2항에서 웹브라우저의 종류는 해당 전자정부서비스를 구축, 개선, 유지보수 및 운영하는 행정기관등의 장이 정한다.

제5조(웹페이지 표준) 제4조에 따라 행정기관등의 장이 웹사이트 구축 시 준수해야 하는 사항은 다음 각 호와 같다.

1. 웹페이지가 어떤 종류의 문법을 사용하는지 선언하고, 선언한 문법으로 구현하여야 한다. 문법의 종류를 선언하는 방법은 별표 1을 따른다.

2. 웹페이지에서 문자를 부호화하는 방식은 EUC-KR 또는 UTF-8 중 하나를 지정하여 선언하고 선언된 방식에 따라 구현하여야 한다.

3. 웹페이지의 크기, 색채, 배치, 정렬 및 여백 등 시각적 속성은 W3C CSS 2.1 또는 CSS 3 표준으로 구현하여야 한다.

4. 웹페이지를 동적으로 구성하고 제어하는 기능은 W3C DOM Level 2 또는 Level 3 또는 ECMA-International ECMA-262 3rd의 표준으로 구현하여야 한다.

제6조(모바일 서비스 호환성 확보) ① 행정기관등의 장은 모바일 전자정부서비스를 제공하는 경우, 보편적 접근성 제고 등을 위하여 모바일 웹 방식으로 제공하도록 노력하여야 한다. 다만 모바일 웹 방식으로 제공시 기술적 제약이 있거나 현저하게 비용이 증가할 우려가 있는 경우에는 다른 방식으로 제공할 수 있다.

② 제1항에 의한 모바일 웹사이트를 구축하는 경우 다양한 모바일 단말기의 화면 크기에 적합한 서비스를 제공하도록 노력하여야 하며, 이를 위하여 단말정보저장소(DDR) 또는 미디어쿼리(Media Queries) 또는 기타 기술을 활용 할 수 있다.

제7조(서비스 호환성 진단) ① 행정안전부 장관은 행정기관등을 대상으로 전자정부서비스 호환성 준수 여부를 연 1회 이상 진단할 수 있다.

② 제1항에 의한 진단은 별표 2 및 별표 3을 따른다.

부 칙

제1조(시행일) 이 지침은 고시한 날로부터 시행한다. 다만, 제4조제1항은 2011년 1월1일부터 시행한다.

한국형 웹 콘텐츠 접근성 지침 2.0이 TTA 단체 표준으로 2009년 12월 22일에 제정되었습니다.

본 표준은 2010년에 국가표준을 추진할 예정입니다. 참고하시기 바랍니다

다운로드 : http://www.wah.or.kr/_Upload/pds/2008-676-한국형%20웹%20콘텐츠%20접근성%20지침%202.0_ttas.pdf

[ 출처 : 웹접근성연구소 (http://www.wah.or.kr/) ]

행정안전부고시 제2009-185호

국민 누구라도 이용환경에 구애받지 않고 전자정부 서비스 이용이 가능하도록 기술적․절차적 사항을 정한「전자정부 웹호환성 준수지침」을 마련하였기에 ｢전자정부법｣ 제25조 및 같은 법 시행령 제33조, ｢행정업무용 표준관리규정｣(행정안전부고시 제2008-8호)에 의하여 다음과 같이 확정․고시합니다.

2009년 8월 19일

행정안전부장관

｢전자정부 웹호환성 준수지침｣ 제정 고시

- ｢전자정부 웹호환성 준수지침｣의 전문은 “전자정부 표준관리 시스템(www.guide.go.kr)」-최근 제․개정”에 게시할 예정임

1251703265_전자정부_웹호환성_준수지침.hwp

1251703265_붙임._전자정부_웹호환성_준수지침_고시문.hwp

1250576097_web-standard-guide-2005.zip

목차

목차 ························································································································································ 3
그림 목차················································································································································ 6
저자 소개················································································································································ 9
서론 ························································································································································ 10
이 가이드의 목적 ································································································································· 11
웹 표준에 대한 오해····························································································································· 15
웹 표준이란 무엇인가?························································································································ 16
웹 표준 스펙 소개 ······························································································································· 18
웹 표준 홈페이지 방법론 ···················································································································· 22
우리 나라 웹 표준 현실 및 과제 ········································································································ 29
실전 XHTML 가이드 ····························································································································35
XTHML 소개········································································································································· 36
XTHML이란 무엇인가? ······················································································································ 36
왜 XTHML을 사용해야 하는가?········································································································ 37
XTHML 문서 구조 ······························································································································ 38
XHTML 일반 문법 준수 ····················································································································· 40
구조적 XHTML 사용 방법··················································································································· 43
잘못 사용하고 있는 태그 ··················································································································· 43
그룹 요소: div, span··························································································································· 45
표제(Heading) ···································································································································· 45
문단(paragraph)·································································································································· 45
구문(em, strong, dfn, code, samp, kbd, var, cite, abbr, acronym)······································ 46
형식을 가지고 있는 컨텐츠 (pre) ····································································································· 47
추가 및 삭제(ins, del) ························································································································ 47
목록 (ul, ol, dl)····································································································································· 47
실전 CSS 레이아웃·······························································································································49
CSS 제대로 사용하기 ························································································································· 50
CSS 개념 및 소개································································································································· 52
CSS(Cascading Style Sheet)란 무엇인가? ·················································································· 52
CSS 선택자(Selector)························································································································· 53
CSS 선언 방법 ····································································································································· 64
CSS 적용의 체크 포인트 4가지 ········································································································ 65
CSS 레이아웃(LAYOUT) 기초 ········································································································· 69

테이블 레이아웃 ································································································································· 69
CSS 레이아웃이란?···························································································································· 69
기본 레이아웃 ···································································································································· 71
컬럼형 레이아웃 ································································································································· 76
목록(List)············································································································································ 80
박스 모델(Box Model)························································································································ 82
테이블(Tables)···································································································································· 89
CSS Hack············································································································································ 92
실전 예제를 통한 CSS 레이아웃 ··········································································································· 94
전체적인 구조와 마크업 ···················································································································· 94
상단 부분(#head) ······························································································································· 96
좌측 영역 (#sub)································································································································ 100
본문 영역 (#body) ····························································································································· 104
하단 영역 (#foot)······························································································································· 106
완료····················································································································································· 108
고급 CSS 레이 아웃 ······························································································································ 109
CSS를 이용한 디자인 팁 ··················································································································· 109
CSS 개발 및 검증 도구 ····················································································································· 114
실전 DOM/Script 가이드 ···············································································121
표준 DOM 기반 개발 ···························································································································· 122
W3C DOM vs. MS DOM···················································································································· 122
DOM 기본 기능 ································································································································· 124
DOM 호환 기능 ································································································································· 127
이벤트(Events) 기능 ··························································································································· 130
XML 기능 ··········································································································································· 132
표준 JAVASCRIPT 사용 방법 ················································································································· 135
ECMAscript vs. Jscript?····················································································································· 135
스크립트 개발시 유의점 ···················································································································· 136
디버깅 및 품질 관리 ······························································································································ 142
기본 디버깅 방법론 ··························································································································· 142
디버깅 도구 이용 ······························································································································· 143
올바른 플러그인(PLUGIN) 사용 ············································································································· 148
외부 객체 이용 방법·························································································································· 148
ActiveX와 대안 Plugin 기술 ············································································································· 151
브라우저 내장 기술 ··························································································································· 155
웹 어플리케이션 표준화 동향 ··········································································································· 157

실전 표준 웹 프로그래밍··················································································161
표준 MIME 타입 설정··························································································································· 162
Apache에서 설정 방법 ······················································································································· 164
IIS에서 설정 방법 ······························································································································ 166
PHP에서 설정 방법 ··························································································································· 167
Apache Tomcat에서 설정 방법 ·········································································································· 167
Perl/Python 등으로 쓴 CGI·············································································································· 169
표준 문자 인코딩 지정··························································································································· 170
문서에서 지정 ···································································································································· 172
웹 서버 프로그램에서 지정 ··············································································································· 174
참고 문헌················································································································································ 178
실전 웹 표준 개발 프로세스··············································································180
기존 웹 개발 프로세스··························································································································· 181
현재 프로세스 소개(Waterfall 방식)································································································· 181
역할을 중심으로 한 개발 공정 ········································································································· 186
개선된 모델(퍼블리셔 중심) ·············································································································· 191
새로운 개발 프로세스 ···························································································································· 194
기획/분석/회의 ···································································································································· 194
기획자 공정 ········································································································································ 195
퍼블리셔 공정 ···································································································································· 198
디자이너 공정 ···································································································································· 208
프로그래머 공정 ································································································································· 209
맺음말····················································································································································· 212
부록. 웹 표준 브라우저 호환표 ··········································································213
웹 브라우저 현황 ··································································································································· 214
인터넷 익스플로러7 ··························································································································· 214
모질라(Mozilla) 계열 웹브라우저 : 파이어폭스··············································································· 215
오페라 브라우저 ································································································································· 216
사파리 ················································································································································· 217
장애인 웹 접근성 체크 리스트 ·············································································································· 219
참고 사이트 ············································································································································ 222
각 웹 표준 브라우저별 호환 여부 ···································································································· 222
국내 웹 표준 커뮤니티 ······················································································································ 222

Translated d0cument may contain errors from translation.
이 번역본은 원본 문서에 없으나 번역 과정에서 생긴 오류를 포함할 수도 있습니다. 번역 과정에서 생긴 오류를 발견하신 분은 gregshin at hanafos.com으로 내용을 보내주시면 감사하겠습니다.

요약

이 지침은 장애인들이 어떻게 웹 콘텐츠 에 접근할 수 있게 할 것인지 설명하고 있다. 이 지침은 모든 웹 콘텐츠 개발자 (페이지를 제작하는 사람과 사이트 디자이너)와 저작 도구 개발자를 위한 것이다. 이 지침의 첫째 목표는 웹 페이지의 접근성을 높이는 것이다. 그러나 이 지침을 따름으로써 웹 표시 장치(user agent)(예를 들어, 데스크탑 브라우저, 음성 브라우저, 이동 전화, 자동차용 컴퓨터 등)의 종류나 사용 환경(소음이 심한 곳, 조명이 지나치게 어둡거나 지나치게 밝은 곳, 손을 사용할 수 없는 환경 등 매우 다양한 환경에서 웹이 쓰인다.)과 무관하게 모든 이가 보다 쉽게 웹 콘텐츠에 접근할 수 있을 것이다. 또, 이 지침을 따름으로써 웹 정보 검색을 더 빠르게 할 수 있다. 이 지침은 개발자에게 그림(이미지)이나 동영상 등을 쓰지 말라고 권하지는 않는다. 그러나 멀티미디어에 담긴 내용을 더 많은 사람들이 향유하게 하는 방법을 설명하고 있다.

이 문서는 접근성 원칙(accessibility principles)과 디자인 아이디어에 대한 참고서라고 할 수 있다. 이 문서에서 논의된 방법들은 웹의 국제화와 무선 접속에 대한 고려 사항을 포함하고 있다. 그러나 이 문서는 접근성에 관해 집중적으로 다루고 있으며, W3C의 다른 관련 활동에 대해서 상세하게 다루지는 않는다. 이들에 대한 자세한 정보는 W3C의 무선 및 이동 접속에 대한 활동 홈페이지 와 W3C의 국제화 활동에 대한 홈페이지를 참조하라.

이 문서는 다양한 웹 기술에 대한 브라우저의 지원 여부나 지원 정도에 대한 정보를 제공하지 않으며 (그런 정보는 안정적인 문서에 포함하기에는 너무 빨리 변화한다.) 그런 것과 상관없는 안정적인 (역자 추가: 그리고 보편적인) 내용을 제공하려고 한다. 대신에 웹 접근성 이니셔티브 (WAI) 웹사이트에서 그런 정보를 제공하고 있다([WAI-UA-SUPPORT]를 참조하라.).

이 문서의 부록은 주제와 중요도에 따라 분류한 모든 체크포인트를 담고 있다. 부록에 있는 체크포인트는 이 문서에 있는 해당 정의와 연결되어있다. 부록에서는 이미지, 멀티미디어, 표(tables), 프레임, 폼(forms), 스크립트 등이 다뤄지고 있다. 부록은 표 형식 또는 단순 나열식으로 볼 수 있다.

다른 문서인 "웹 콘텐츠의 접근성을 높이기 위한 기술적 방법 1.0"([TECHNIQUES])에서는 이 문서에서 정의한 체크포인트를 어떻게 구현할 것인지 설명하고 있다. 그 문서에서는 각 체크포인트를 더 자세하게 다루고 있고, Hypertext Markup Language (HTML), Cascading Style Sheets(CSS), Synchronized Multimedia Integration Language (SMIL), Mathematical Markup Language (MathML)를 사용한 예제를 제시하고 있다. 또 그 문서에서는 문법 검사(validation)와 시험 기법에 대한 내용이 들어있으며, HTML 요소(elements) 및 속성(attributes)에 대한 색인과 어떤 기술이 그것을 사용하는지에 대해서도 나와 있다. 기술적 방법을 다루는 문서는 기술의 변화를 따라가는 것이 중요하므로 이 문서보다는 더 자주 개정될 것이다. Note. 모든 브라우저와 멀티미디어 프로그램이 지침에서 제시한 모든 기능을 지원하지는 않는다. 특히 HTML 4.0이나 CSS 1, CSS 2에서 새로이 규정한 것은 지원되지 않을 가능성이 더 높다.

"웹 콘텐츠 접근성을 높이기 위한 제작 지침 1.0"은 웹 접근성 이니셔티브가 발행하는 접근성 지침 시리즈의 일부이다. 시리즈에는 접근성을 높이기 위한 웹 표시 장치 제작 지침 (User Agent Accessibility Guidelines, [WAI-USERAGENT])과 접근성을 높이기 위한 저작 도구 개발 지침(Authoring Tool Accessibility Guidelines, [WAI-AUTOOLS])도 들어있다.

이 문서의 현재 상태

이 문서는 W3C 회원과 다른 관계자의 검토를 거쳐 W3C 총재가 W3C 권고안으로 승인하였다. 이 문서는 안정적인 문서이므로 참고 자료로 쓰이거나 규범적인 참고 문헌으로 다른 문서에서 인용할 수 있다. W3C가 권고안을 만드는 것은 (표준) 사양에 대해 주의를 환기시키고, 보다 넓은 범위에서 그 사용을 촉진하기 위해서이다. 이렇게 함으로써 웹의 기능성과 보편성을 향상시킬 수 있다.

이 사양에 대한 영어판만이 규범력을 지닌다. 그러나 다른 언어 번역판을 보고 싶으면, http://www.w3.org/WAI/GL/WAI-WEBCONTENT-TRANSLATIONS 를 참조하면 된다.

이 문서에 대해 지금까지 알려진 오류 목록은 http://www.w3.org/WAI/GL/WAI-WEBCONTENT-ERRATA 에서 볼 수 있다. 이 문서에 오류가 있으면 wai-wcag-editor@w3.org 로 메일을 보내주기 바란다.

W3C의 권고안 문서 목록이나 다른 기술적인 문서는 http://www.w3.org/TR에서 찾아볼 수 있다.

이 문서는 W3C의 웹 접근성 이니셔티브의 일환으로 만들어진 것이다. 웹 콘텐츠 지침에 관한 워킹 그룹 (Web Content Guidelines Working Group)의 목적은 이 그룹의 헌장에 나와있다.