웹 접근성 실태조사 항목별 체크리스트

웹 접근성 실태조사 항목별 체크리스트

 

1. 인식의 용이성(43점)

1-1. 텍스트 아닌 콘텐츠의 인식(21점)
지 표	체크리스트	배점
< 1-1-1 > 텍스트가 아닌 콘텐츠에는 모두 대체 텍스트가 제공되어야 한다.	(1) 텍스트가 아닌 콘텐츠에 대해서는 대체 텍스트를 제공하고 있는가?	11점
< 1-1-2 > 대체 텍스트의 내용은 적절하게 제공되어야 한다.	(2) ~링크, ~버튼, ~로고, ~바로가기, ~메뉴와 같이 중복된 내용을 대체 텍스트로 제공하지 않으며, 콘텐츠를 파악할 수 있는 구체적인 설명을 제공하고 있는가?   (3) 콘텐츠 이미지의 경우 이미지를 설명하는 적절한 대체 텍스트를 제공하고 있는가? ※ 이미지의 의미가 없는 경우 대체 텍스트를 alt=""로 제공   (4) 대체 텍스트의 내용이 길거나 복잡한 경우 longdesc 속성을 이용하여 적절한 추가적인 정보를 제공하고 있는가?	7점
<1-1-3> 정보가 있는 콘텐츠를 배경 이미지로 사용하지 않아야 한다.	(5) 텍스트로 표현이 가능한 내용을 전부 이미지로 제작하여 배경으로 삽입하는 경우 대체 텍스트를 넣을 수 없으므로, 일반적인 텍스트로 표현하거나 전경 이미지와 대체 텍스트로 표현하고 있는가?	3점
1-2. 영상매체의 인식(10점)
지 표	체크리스트	배점
< 1-2-1 > 동영상 등의 시청각 멀티미디어 콘텐츠에는 동기화된 자막이 제공되어야 한다.	(6) 동영상, 오디오 등 멀티미디어 콘텐츠는 동기화된 자막을 제공하고 있는가? ※ 동기화된 자막이 원칙이나, 콘텐츠의 내용을 즉시적으로 충분히 이해할 수 있는 자막 또는 원고를 제공할 경우 허용됨	10점

1-3. 콘텐츠의 시각적 명료성(12점)
지 표	체크리스트	배점
< 1-3-1 > 색상으로 표현된 정보는 색상을 배제하여도 원하는 내용을 전달할 수 있어야 한다.	(7) 색상 이외에도 명암이나 패턴으로 콘텐츠 구분이 가능한가?	3점
<1-3-2> 전경색과 배경색은 충분한 대비를 가지고 있어야 한다.	(8) 흰 바탕에 밝은 회색글자처럼 판독이 어려운 색조합을 피하고, 흰 바탕에 검정 글자처럼 대비가 큰 색조합을 제공하고 있는가?	4점
<1-3-3> 텍스트는 쉽게 읽을 수 있도록 충분한 크기로 제공되어야 한다.	(9) 저시력자나 다양한 환경의 사용자도 텍스트를 쉽게 읽을 수 있도록 적절한 크기로 텍스트를 제공하고 있는가?	5점

 

2. 운용의 용이성(25점)

2-1. 이미지맵 기법 사용 제한(1점)
지 표	체크리스트	배점
< 2-1-1 > 서버측 이미지맵을 불필요하게 사용하지 않아야 한다.	(10) 불필요하게 서버측 이미지맵을 사용하는 경우는 없는가?   (11) 서버측 이미지맵을 사용할 경우, 해당 내용 및 기능을 동등하게 사용할 수 있는 대체 수단을 제공하고 있는가?	1점
2-2. 프레임의 사용 제한(5점)
지 표	체크리스트	배점
< 2-2-1 > 불필요하거나 과도하게 많은 프레임을 사용하지 않아야 한다.	(12) 화면을 분할하거나 외부 콘텐츠를 불러들이는 용도 이외로 프레임을 사용하는 경우는 없는가?   (13) 한 페이지 내에 과도하게 많은 수(4개 이상)의 프레임을 사용하는 경우는 없는가?	3점
< 2-2-2 > 각 프레임의 title 속성을 적절하게 제공하여야 한다.	(14) 프레임 별로 적절한 title 속성을 제공하고 있는가?	2점

2-3. 깜빡거리는 객체 사용 제한(3점)
지 표	체크리스트	배점
< 2-3-1 > 깜빡이는 콘텐츠를 사용할 경우, 이에 대한 경고 및 제어방안을 제공하여야 한다.	(15) 깜빡이는 콘텐츠가 있을 경우 사전 경고를 제공하고 있는가? ※ 깜빡임 기준 : 초당 4~59번을 깜빡이는 콘텐츠   (16) 깜빡임을 중지 또는 제어할 수 있는 컨트롤을 제공하고 있는가?   (17) 동영상/멀티미디어 콘텐츠를 정지된 상태에서 제공하고 있는가?	3점
2-4. 키보드로만 운용 가능(7점)
지 표	체크리스트	배점
< 2-4-1 > 키보드만으로 모든 콘텐츠를 제어할 수 있어야 한다.	(18) 키보드만으로 콘텐츠가 제공하는 모든 기능에 대한 제어가 가능한가? ※ 온라인 입력서식은 중요도가 높으므로 ‘3-3-2’ 항목에서 별도 체크   (19) 키보드로 폼 컨트롤, 링크, 객체 사이를 이동할 때, 논리적 이동 순서가 적절한가?   (20) <select>(목록상자) 사용시 해당 목록을 선택한 후 [이동] 버튼을 반드시 제공하고 있는가?(키보드로 모든 목록을 선택할 수 있는 방법을 제공)   (21) focus만으로 급격하게 상황이 바뀌지 않으며, 활성화(activate)에 의해 상황이 바뀌고 있는가?   (22) 하위 메뉴를 제공하는 주(상단) 메뉴의 경우, 키보드만으로도 서브 메뉴를 이용할 수 있는가?	9점
2-5. 반복 내비게이션 링크(3점)
지 표	체크리스트	배점
< 2-5-1 > 반복되는 링크가 많은 페이지를 효율적으로 이용하기 위한 스킵 내비게이션 링크를 제공하여야 한다.	(23) 스킵 내비게이션 링크를 제공하고 있는가?   (24) 링크가 이동되는 위치보다는 링크로 인해 건너뛰는 부분을 알려줄 수 있도록 링크명을 정하는 등 제공 내용이 적절한가?	3점

2-6. 반응 시간의 조절기능(6점)
지 표	체크리스트	배점
< 2-6-1 > 이용에 시간제한이 있는 콘텐츠의 경우 경고 및 시간조절 기능을 제공하여야 한다.	(25) 이용에 시간제한이 있는 콘텐츠의 경우 경고를 적절히 제공하고 있으며, 경고의 시점(사전경고, 시간 만료전 재경고 등)이 적절한가?   (26) 이용에 시간제한이 있는 콘텐츠의 경우 시간 설정을 변경할 수 있는 기능을 제공하고 있는가?	2점
< 2-6-2 > 팝업창을 불필요하게 사용하지 않아야 한다.	(27) 사용자의 입력 없이 자동으로 발생하는 팝업창을 사용하는 경우는 없는가?   (28) 사용자의 입력에 의해서 발생하는 팝업창은 미리 팝업창임을 알리고 있는가?	2점

 

3. 이해의 용이성(22점)

3-1. 데이터 테이블 구성(6점)
지 표	체크리스트	배점
< 3-1-1 > 테이블에 대한 summary와 caption을 제공하여야 한다.	(29) summary 속성을 통해서 미리 표의 내용을 요약해서 전달하고 있는가?   (30) 표의 제목을 <caption> 태그로 제공하고 있는가? ※ <h1>~<h6> 태그를 이용하여 표의 제목을 제공할 수 있음	3점
< 3-1-2 > 데이터 테이블을 의미적으로 이해할 수 있도록 적절히 태그를 사용하여야 한다.	(31) 행단위 구분을 위한 태그를 제공하고 있는가? ※ <thead>, <tbody>, <tfoot> 등   (32) 제목셀과 내용셀의 구분을 위한 태그를 제공하고 있는가? ※ <th>, <td> 등   (33) 헤더는 행과 열의 범위를 구분하여 적절히 배치하고 있는가?   (34) colspan, rawspan이 많이 사용되어 헤더 구조가 복잡한 테이블의 경우 적절하게 사용되고 있는가?   (35) 헤더에 긴 내용이 들어갈 경우 abbr 속성을 사용해 약어를 표시하고 있는가?	3점

3-2. 페이지의 논리적 구성(9점)
지 표	체크리스트	배점
< 3-2-1 > 의미에 맞는 적절한 HTML 태그를 사용하여야 한다.	(36) 모든 문서마다 문서의 제목(<title>)을 제공하고, 문서의 제목은 문서의 특성을 잘 나타내도록 간단명료하게 기술하고 있는가?   (37) 제목(<h1>~<h6>), 문단(<p>), 목록(<ul>, <ol>, <dl>) 등을 나타내기 위한 적절한 HTML 태그를 사용하고 있는가?   (38) 디자인 요소를 CSS를 사용하여 분리하고 있는가?   (39) 스타일 시트 기능을 해제하여도 콘텐츠를 이해할 수 있는가?	3점
< 3-2-2 > 콘텐츠의 내용은 선형화(순서대로 나열) 했을 때에도 무리 없이 인식을 할 수 있어야 한다.	(40) 레이아웃을 설정하는 CSS(테이블을 사용했을 경우는 테이블)를 제거하여도 콘텐츠의 구성순서가 논리적으로 배치되는가?	3점
< 3-2-3 > 레이아웃 테이블 작성에 테이블의 구조 정보를 정의하는 태그를 사용하지 않아야 한다.	(41) <caption>, <thead>, <tbody>, <th> 등 테이블 구조화를 위한 태그를 레이아웃용 테이블에 사용하는 경우는 없는가?	1점
< 3-2-4 > 각 링크의 목표 위치를 명확하게 하여야 한다.	(42) 주변 맥락을 제거하고 링크만 독립적으로 접근하여도 링크의 목표 위치가 명확히 드러나도록 링크 텍스트를 만들거나, 부가적인 설명을 title 속성으로 제시하고 있는가?	2점
3-3. 온라인 서식 구성(7점)
지 표	체크리스트	배점
< 3-3-1 > 각 서식 제어 요소를 설명하는 레이블을 사용하여야 한다.	(43) <label> 태그를 이용하여 서식 제어 요소와 레이블을 서로 연결하고 있는가? ※ id와 for를 적절히 매칭시키고 있는가?   (44) 전화번호, 우편번호와 같은 필드를 여러 개로 나누어 입력해야 하는 경우 정확한 title 속성을 제공하고 있는가?	3점

< 3-3-2 > 키보드만으로도 온라인 서식 입력 및 서식 간 이동이 가능하여야 한다.

(45) 키보드만으로 서식의 이용이 가능한가? ※ 주민등록번호 입력시 자동으로 포커스가 이동되지 않고 있는가?   (46) 키보드로 서식을 이용할 때 포커스의 이동 순서가 논리적인가?

4점

 

4. 기술적 진보성(10점)

4-1. 신기술의 사용(10점)
지 표	체크리스트	배점
< 4-1-1 > 스크립트, 애플릿, 플러그인 등 부가 어플리케이션에 의한 콘텐츠는 자체적인 접근성을 지니고 있어야 한다.	(47) 자바스크립트, 자바애플릿, ActiveX, 플래시 등 외부 콘텐츠가 자체적인 접근성을 지원하고 있는가?	3점
< 4-1-2 > 부가 어플리케이션이 작동하지 않을 경우에도 동일한 내용을 전달할 수 있는 대체 콘텐츠를 제공하여야 한다.	(48) 대체 콘텐츠는 간단명료하면서 원본과 동일한 기능을 수행하고 있는가?   (49) 텍스트 브라우저로도 해당 기능을 제어하고 있는가?   (50) 링크는 자바스크립트 없이도 작동하고 있는가? ※ 자바스크립트로만 링크를 구성하지 않아야 함	5점
< 4-1-3 > 부가 어플리케이션의 설치가 요구되는 페이지는 해당 페이지에서 직접 어플리케이션을 설치할 수 있는 링크를 제공하여야 한다.	(51) 어플리케이션의 링크나 어플리케이션을 다운받을 수 있는 페이지의 링크를 제공하고 있는가?	2점

 

출처 : 한국정보문화진흥원(KADO)