| NUM | 항목 | 상세내용 | 적용여부 | 비고 | ||
|---|---|---|---|---|---|---|
| 1.인식의 용이성 | 1.1 대체 텍스트 | 1.1.1 적절한 대체 텍스트 제공 | 텍스트 아닌 콘텐츠는 그 의미나 용도를 이해할 수 있도록 대체 텍스트를 제공해야 한다. | 준수 | 퍼블리싱 및 개발 고려사항 - 모든 이미지 태그 및 input type="image" 일 경우 대체텍스트 필수. - input type="text" 사용 시에도 전화번호 주소/상세주소로 input가 구분될경우 title 제공 필수. ex)<input type="text" value="" name="address" title="기본 주소"> < input type="text" value="" name="address" title="상세 주소"> |
|
| 1.2 멀티미디어 대체 수단 | 1.2.1 자막 제공 | 멀티미디어 콘텐츠에는 자막, 원고 또는 수화를 제공해야한다. | 준수 | 공통 1. 플래쉬 컨텐츠 삭제 - DB연동하는 플래쉬 컨텐츠 : 액션스크립트 활용 - 단순한 모션의 플래쉬 컨텐츠 : HTML 및 jquery로 대체 2. 동영상 컨텐츠 삭제 - 미삭제 동영상 컨텐츠의 경우 디스크립션제공 |
||
| 1.3 명료성 | 1.3.1 색에 무관한 콘텐츠 인식 | 콘텐츠는 색에 관계없이 인식될 수 있어야 한다 | 준수 | 개발 : 그래프 및 차트 오픈 api 사용시 적용 | ||
| 1.3.2 명확한 지시사항 제공 | 지시 사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 한다. | 준수 | 디자인 및 기획 고려사항 - '웹 콘텐츠는 콘텐츠에 접근하는 사용자들이 색, 크기, 모양 또는 위치에 관한 정보를 인식하지 못하더라도 원하는 콘텐츠에 접근할 수 있도록 제작되어야 한다' - ex) 하단 원형 버튼을 누르세요. - ex) 위 박스 안의 붉은 글씨 내용을 참고하세요 |
|||
| 1.3.3 텍스트 콘텐츠의 명도 대비 | 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상 이어야 한다. | 준수 | 디자인 고려사항 - 바탕화면이 백색이라고 가정할 경우 텍스트 색상은 #7d7d7d보다 어두워야함 - 권장은 7:1로 #595959 보다 어두워야 함 (상단 관련자료의 내용 참고바람) |
|||
| 1.3.4 배경음 사용금지 | 자동으로 재생되는 배경음을 사용하지 않아야 한다. | 준수 | 공통 : 자동으로 재생되는 배경음 지양. | |||
| 2.운용의 용이성 | 2.1 키보드 접근성 | 2.1.1 키보드 사용 보장 | 모든 기능은 키보드만으로도 사용할 수 있어야 한다. | 준수 | 퍼블리싱 및 개발고려사항 - 제이쿼리 기능구현(키보드 이동 필수)및 개발 기능구현을 위한 빈프레임(반드시 title 제공)사용, ajax(새로고침 버튼등을 이용한 정보의 수동업데이트 수단 제공), api(skip navigation 등을 제공)등 사용시 포커스 미스가 발생하지 않도록 보완작업 필수. |
|
| 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 기본 언어 표시 | 주로 사용하는 언어를 명시해야 한다 | 준수 | 퍼블리싱 및 개발 - html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko" - 다국어 사용시 해당국가 언어로 표시(ISO 639 국가코드 및 언어코드 참고) |
|
| 3.2 예측 가능성 | 3.2.1 사용자 요구에 따른 실행 | 사용자가 의도하지 않은 기능(새 창, 초점변화 등)은 실행되지 않아야 한다. | 준수 | 사용자 입력중 키보드 포커스, 마우스 오버 등으로 기능의 실행이 일어나면 안됨. - 공통 : 폼의 자동 전송, 새창 자동 열림, 드롭다운(셀렉트박스) 선택시 기능 자동 실행 등(적용) - 퍼블리싱 및 개발: 사용자가 예측할 수 없는 새창, 팝업, 레이어팝업 - 퍼블리싱 및 개발: 동영상 컨텐츠의 경우 자동 재생되지 않아야 함 - 개발 : 주민등록 입력폼 등에서 흔히 보이는, 앞자리를 채웠을 경우 뒷자리로 자동 포커스 이동하는 등의 기능 사용되어서는 안됨. 서식폼 오류 발생시 해당 오류부분으로 포커스 이동되어야 함. |
||
| 3.3 콘텐츠의 논리성 | 3.3.1 콘텐츠 선형화 | 콘텐츠는 논리적인 순서로 제공해야 한다. | 준수 | 퍼블리싱 및 개발고려사항 - CSS 제거후 화면 확인시 컨텐츠의 내용이 논리적 순서로 선형화되어 구성되어야 함. |
||
| 3.3.2 표의 구성 | 표는 이해하기 쉽게 구성해야 한다. | 준수 | 퍼블리싱 및 개발 고려대상 - 레이아웃용 표테이블의 경우 caption, thead, tbody, th 등의 데이터테이블로 구성되면 안됨. - 데이터 테이블의 경우 caption, thead, tbody, th 등의 규칙에 맞게 적용되어야 함. - 크게 thead의 유무에 따라 레이아웃용과 데이터테이블로 구분. (thead가 존재하면 필수 데이터테이블. thead가 없는 경우 선택적 레이아웃용테이블) |
|||
| 3.4 입력 도움 | 3.4.1 레이블 제공 | 입력 서식에는 대응하는 레이블을 제공해야 한다. | 준수 | 퍼블리싱 및 개발 고려대상 표로 구성되지 않는 입력서식의 경우 레이블 제공(명시적 레이블 사용) 필수 - ex) <input type="radio" value="" name="test" id="this"><label for="this">선택</label> - 약관/로그인 화면/검색 구성시 fieldset 사용 필수 |
||
| 3.4.2 오류 정정 | 입력 오류를 정정할 수 있는 방법을 제공해야 한다 | 준수 | 공통 : 알럿으로 오류사항 전달함. | |||
| 4.견고성 | 4.1 문법 준수 | 4.1.1 마크업 오류 방지 | 마크업 언어의 요소는 열고 닫음, 중첩 관계 및 속성 선언에 오류가 없어야 한다. | 준수 | 퍼블리싱 및 개발 고려사항 - http://validator.w3.org 검수 - 파이어폭스 또는 크롬 부가기능 활용. (Firebug, Html Validator 사용) |
|
| 4.2 웹 애플리케이션 접근성 | 4.2.1 웹 애플리케이션 접근성 준수 | 콘텐츠에 포함된 웹 애플리케이션은 접근성이 있어야 한다. | 준수 | 퍼블리싱 및 개발 고려사항 |
||