홈페이지 웹표준 가이드 차세대 학사정보시스템 구축 단계명 : 설계 시스템명 : 학생정보서비스(홈페이지)

Presentation on theme: "홈페이지 웹표준 가이드 차세대 학사정보시스템 구축 단계명 : 설계 시스템명 : 학생정보서비스(홈페이지)"— Presentation transcript:

1 홈페이지 웹표준 가이드 차세대 학사정보시스템 구축 단계명 : 설계 시스템명 : 학생정보서비스(홈페이지)
문서번호 : nKNOU-DEHP-05

2 목차 가. 웹 표준 가이드라인 ……………………………………………………………………… 2 웹 접근성 정의 ……………………………………………………………………… 3 기술가이드라인 ……………………………………………………………………… 9 웹 표준 준수지침 ………………………………………………………………… 10 접근성 시험 및 참조사이트……………………………………………………… 11

3 가. 웹 표준 가이드라인

4 가. 웹 표준가이드라인 A. 웹 접근성 정의 1.1 W3C 정의
1) Web Accessibility Initiative (WAI)에서의 정의 1. 웹 접근성은 장애를 지닌 사람이 웹을 이용할 수 있는 것을 의미. 2. 장애를 가진 사람들이 웹 콘텐츠를 인지하고, 편리하게 사용할 수 있으며, 그 내용이 이해하기 쉬워야 하며, 견고성을 지녀야 웹 접근성이 있다고 보는 관점. 2) Web Content Accessibility Guidelines ( WCAG 2.0 )의 웹접근성 지침의 목적 1. WCAG 1.0기준과 달리 장애인의 실제적인 사용성에 초점을 맞춘 것이 가장 큰 특징. 2. 인터넷 기술의 발전 속도에 맞는 신기술 수용 부분까지 고려해서 제정. 3. 사용성이란 접근성의 확대된 개념으로 단순히 장애인이 웹에 접근하는 수준에서 한 걸은 더 나아가 인터넷을 직접 활용할 수 있도록 하는데 초점을 맞춤. 3) WCAG 2.0 가이드 라인 1. 인지성 - 정보와 사용자 인터페이스 요소는 그들이 인지할 수 있도록 사용자에게 표시될 수 있어야 한다. 1-1. 모든 텍스트가 아닌 콘텐츠에 대체 텍스트를 사람들이 원하는 인쇄, 점자, 음성, 기호 또는 간단언어들과 같은 형태로 제공해야 한다. 1-2. 시간에 기본한 미디어에 대한 대안을 제공해야 한다. 1-3. 정보와 구조 손실 없이 콘텐츠를 다른 방식 (예를들면 더욱 간단한 형태)들로 표현될 수 있어야 한다. 1-4. 사용자들이 보다 쉽게 보고 들을 수 있는 전경에서 배경을 분리한 콘텐츠를 만들어야 한다.

5 가. 웹 표준가이드라인 A. 웹 접근성 정의 1.2 한국형 웹 콘텐츠 접근성 지침 2.0
2. 운용성 - 사용자 인터페이스 요소와 탐색은 운용 가능해야 한다. 2.1. 키보드로 모든 기능을 사용할 수 있도록 해야 한다. 2.2. 읽기 및 콘텐츠를 사용하는 사용자에게 충분한 시간을 제공해야 한다. 2.3. 알려진 방법으로 발작을 일으킬 수 있는 콘텐츠를 디자인하지 않아야 한다. 2.4. 사용자가 탐색하고, 콘텐츠를 찾고 그들이 어디에 위치해 있는지를 알 수 있도록 도와주는 방법을 제공 해야 한다. 3. 이해성 - 정보와 사용자 인터페이스 운용은 이해할 수 있어야 한다. 3.1. 텍스트 콘텐츠를 판독하고 이해할 수 있도록 만들어야 한다. 3.2. 웹페이지의 운용을 예측 가능한 방법으로 제작해야 한다. 3.3. 사용자의 실수를 방지하고 수정할 수 있도록 도와야 한다. 4. 내구성 - 콘텐츠를 보조기술을 포함한 넓고 다양한 사용자 에이전트에 의존되어 해석될 수 있도록 충분한 내구성을 가져야 한다. 4.1 보조기술을 포함한 현재 및 미래의 사용자 에이전트의 호환성을 극대화해야 한다. 1) 웹 접근성을 고려한 콘텐츠 제작 방법 1. 원칙, 지침, 검사 항목의 3단계로 구성. 2. 본 지침을 준수할 경우, 비장애인, 노인 등이 장애인, 젊은이 등과 동등하게 웹 사이트에서 제공하는 콘텐츠를 인식하고, 이를 운영하고 이해할 수 있게 되는 것. 1.2 한국형 웹 콘텐츠 접근성 지침 2.0

6 가. 웹 표준가이드라인 A. 웹 접근성 정의 2) 한국형 웹 콘텐츠 접근성 2.0 개요 ( KWCAG 2.0 )
1. 인식의 용의성 - 모든 콘텐츠는 사용자가 인식할 수 있어야 한다. 1.1 대체 텍스트 - 적절한 대체 텍스트 제공 : 텍스트 아닌 콘텐츠는 그 의미나 용도를 이해할 수 있도록 대체 텍스트를 제공 해야 한다. 1.2 멀티미디어 대체 수단 - 자막 제공 : 멀티미디어 콘텐츠에는 자막, 원고 또는 수화를 제공해야 한다. 1.3 명료성 - 색에 무관한 콘텐츠 인식 : 콘텐츠는 색에 관계없이 인식될 수 있어야 한다. - 명확한 지시사항 제공 : 지시사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 한다. - 텍스트 콘텐츠의 명도 대비 : 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상이어야 한다. - 배경음 사용 금지 : 자동으로 재생되는 배경음을 사용하지 않아야 한다. 2. 운용의 용의성 -사용자 인터페이스 구성요소는 조작 가능하고 내비게이션할 수 있어야 한다. 2.1 키보드 접근성 - 키보드 사용 보장 : 모든 기능은 키보드만으로도 사용할 수 있어야 한다. - 초점 이동 : 키보드에 의한 초점은 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다. 2.2 충분한 시간 제공 - 응답시간 조절 : 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있어야 한다. - 정지 기능 제공 : 자동으로 변경되는 콘텐츠는 움직임을 제어할 수 있어야 한다.

7 가. 웹 표준가이드라인 A. 웹 접근성 정의 2.3 광과민성 발작 예방
- 깜빡임과 번쩍임 사용 제한 : 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 한다. 2.4 쉬운 내비게이션 - 반복 영역 건너뛰기 : 콘텐츠의 반복되는 영역은 건너 뛸 수 있어야 한다. - 제목 제공 : 페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야 한다. -적절한 링크 텍스트 : 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 한다. 3. 이해의 용이성 -콘텐츠는 이해할 수 있어야 한다.) 3.1 가독성 - 기본 언어 표시 : 주로 사용하는 언어를 명시해야 한다. 3.2 예측가능성 - 사용자 요구에 따른 실행 : 사용자가 의도하지 않은 기능(새 창, 초점 변화 등)은 실행되지 않아야 한다. 3.3 콘텐츠의 논리성 - 콘텐츠의 선형화 : 콘텐츠는 논리적인 순서로 제공해야 한다. - 표의 구성 : 표는 이해하기 쉽게 구성해야 한다. 3.4 입력 도움 - 레이블 제공 : 입력 서식에는 대응하는 레이블을 제공 해야 한다. - 오류 정정 : 입력 오류를 정정할 수 있는 방법을 제공 해야 한다.

8 가. 웹 표준가이드라인 A. 웹 접근성 정의 4. 견고성 -웹 콘텐츠는 미래의 기술로도 접근할 수 있도록 견고하게 만들어야 한다. 4.1 문법준수 - 마크업 오류 방지 :마크업 언어의 요소는 열고 닫음, 중첩 관계 및 속성 선언에 오류가 없어야 한다. 4.2 웹 애플리케이션 접근성 - 웹 애플리케이션 접근성 준수 : 콘텐츠에 포함된 웹 애플리케이션은 접근성이 있어야 한다.

9 가. 웹 표준가이드라인 A. 웹 접근성 정의 1.3 웹 접근성 및 정보통신 접근성에 대한 주요 정의 구분 정의
1.3 웹 접근성 및 정보통신 접근성에 대한 주요 정의 구분 정의 장애인·노인 등의 정보통신 접근성 향상을 위한 권장지침 정보통신 제품과 서비스를 활용하고자 하는 사람에게 이의 활용 가능성이 제공되는 것 웹 접근성 이니셔티브 (WAI: Web Accessibility Initiative) 장애를 가진 사람들도 웹을 이용할 수 있도록 보장하는 것으로, 장애를 가진 사람들이 웹 콘텐츠를 인지하고(Perceivable), 운영하고(Operable), 이해하고(Understandable), 기술에 상관없이 이용할 수 있도록 견고한(Robust)하게 웹콘텐츠를 만드는 것 Wikipedia 표준 브라우저 뿐만 아니라 다양한 사용자 에이전트(User Agent)를 사용하는 사람들이 웹 페이지에 접근하기 쉽게 만드는 것으로, 이를 통해 장애인들도 웹을 사용할 수 있도록 보장하는 것 한국정보화진흥원 어떠한 사용자(장애인, 노인 등), 어떠한 기술환경에서도 사용자가 전문적인 능력 없이 웹 사이트에서 제공하는 모든 정보에 접근할 수 있도록 보장하는 것

10 이해의 용이성 (Understandable)
가. 웹 표준가이드라인 B. 기술 가이드라인 인식의 용이성 (Perceivable) 1.1( 대체 텍스트 ) 텍스트 아닌 콘텐츠에는 대체 텍스트를 제공해야 한다 . 1.2( 멀티미디어 대체 수단 ) 동영상 ,음성 등 멀티미디어 콘텐츠를 이해할 수 있도록 대체 수단을 제공해야 한다 . 1.3( 명료성 ) 콘텐츠는 명확하게 전달되어야 한다 운용의 용이성 (Operable) 2.1( 키보드 접근성 ) 콘텐츠는 키보드로 접근할 수 있어야 한다 . 2.2( 충분한 시간 제공 ) 콘텐츠를 읽고 사용하는 데 충분한 시간을 제공해야 한다 2.3( 광과민성 발작 예방 ) 광과민성 발작을 일으킬 수 있는 콘텐츠를 제공하지 않아야 한다 2.4( 쉬운 내비게이션 ) 콘텐츠는 쉽게 내비게이션할 수 있어야 한다 . 이해의 용이성 (Understandable) 3.1( 가독성 ) 콘텐츠는 읽고 이해하기 쉬워야 한다 . 3.2( 예측 가능성 ) 콘텐츠의 기능 과 실행결과는 예측 가능해야 한 다 . 3.3( 콘텐츠의 논리성 ) 콘텐츠는 논리적으로 구성해야 한다 . 3.4( 입력 도움 ) 입력 오류를 방 지하거나 정정할 수 있어야 한 다 . 견고성 (Robust 4.1( 문법 준수 ) 웹 콘텐츠는 마 크업 언어의 문법을 준수해야 한 다 . 4.2( 웹 애플리케이션 접근성 ) 웹 애플리케이션은 접근성이 있어야 한다 .

11 가. 웹 표준가이드라인 C. 웹 표준 준수지침 1.1 전자정부 웹 표준 준수지침 1.2 지침의 적용범위
1.1 전자정부 웹 표준 준수지침 - 목적 : 정부기관에서 홈페이지 구축 시 콘텐츠에 접근하려는 모든 사람들이 어떤 컴퓨터나 운영체제, 또는 웹 브라우저(web browser)를 사용하는 환경에 구애 받지 않고 홈페이지를 이용할 수 있도록 하는 것을 목적으로 한다. - 본 지침은 공포 이후 정부기관에서 구축하는 모든 정보화 시스템 구축 사업의 계획 수립, 시스템 구축, 감리 등 전 단계에 적용한다. 다만, 관계법령에서 따로 정한 경우는 제외할 수 있다. 1.2 지침의 적용범위 내용의 문법준수 모든 웹 문서는 적절한 문서타입을 명시해야 한다. 명시한 문서타입에 맞는 문법을 준수해야 한다. 모든 페이지는 사용할 인코딩 방식을 표기해야 한다. 내용과 표현의 분리 논리적인 마크업을 구성하여 구조적인 페이지를 만들어야 한다. 사용된 스타일 언어는 표준적인 문법을 준수해야 한다. 동작의 기술 중립성 보장 스크립트의 비 표준 확장 사용은 배제되어야 한다. 스크립트 비 사용자를 위한 대체텍스트나 정보를 제공해야 한다. 플러그인의 호환성 플러그인은 다양한 웹 브라우저를 고려해야 한다. 콘텐츠의 보편적 표현 메뉴는 다양한 브라우저 사용자도 접근할 수 있어야 한다. 다양한 인터페이스(입력기기)로 웹 사이트를 이용할 수 있어야 한다. 운영체제 독립적인 콘텐츠 제공 제공되는 미디어는 범용적인 포맷을 사용해야 한다. 부가기능의 호환성 확보 인증기능은 다양한 브라우저에서 사용 가능해야 한다. 다양한 프로그램 제공 정보를 열람하는 기능은 다양한 브라우저에서 사용 가능해야 한다. 별도의 다운로드가 필요한 프로그램은 윈도우, 리눅스, 매킨토시 중 2개 이상의 운영체제를 지원해야 한다.

12 가. 웹 표준가이드라인 D. 접근성 시험 및 참조사이트 1.1 웹 접급성 / 웹 표준화 관련단체
1.1 웹 접급성 / 웹 표준화 관련단체 W3C 월드와이드웹 컨소시엄 ENG : KOR : WAI 웹 접근성에 대한 전략, 가이드라인, 리소스의 개발 한국정보화진흥원 국내·외의 정보격차 해소를 종합적으로 지원하기 위한 사업수행: IABF 정보통신 접근성 향상 표준화 포럼 1.2 웹 접근성 / 웹 표준 테스트 웹 접근성 테스트 프로그램 웹 접근성 테스트 프로그램 KADO-WAH 프로그램 다운로드 Markup Validation 테스트 웹 문서의 markup (HTML, XHTML, …)을 검사 CSS Validation 테스트 캐스케이딩 스타일시트 (CSS) 와 스타일시트를 포함한 (X)HTML 문법검사 Link Checker 테스트 RSS/Atom 피드, MobileOK 컨텐츠, 또는 깨진 링크 찾기 등의 특정 콘텐츠 검색

13 가. 웹 표준가이드라인 D. 접근성 시험 및 참조사이트 1.3 웹 접근성 관련 표준자료 HTML5 한글 명세서
1.3 웹 접근성 관련 표준자료 웹 접근성 국제 표준 W3C Recommendation WCAG 1.0 Eng WCAG 1.0 Kor 웹 접근성 국제 표준 후보 W3C Working Draft WCAG 2.0 Eng 웹 접근성 국내 표준 KWCAG 2.0 PDF HTML 표준 HTML 4.01 Eng HTML 4.01 Kor XHTML 표준 XHTML 1.0 Eng XHTML 1.0 Kor HTML5 초안 W3C Working Draft HTML 5 Eng HTML 5 differences from HTML 4 Eng HTML5 한글 명세서 ttp://html5.clearboth.org/spec