티스토리 뷰

반응형

운용의 용이성(1)

운용의 용이성이란 어떤 사용자나 환경에서도 키보드만으로도 자유롭게 웹사이트에서 제공하는 모든 콘텐츠의 기능을 이용할 수 있게 하는 것

운용의 용이성 관련 지침 및 검사항목

지침(4개) 검사항목(8개)
2.1(입력장치 접근성) 콘텐츠는 키보드로 접근할 수 있어야 한다.
2.1.1 (키보드 사용 보장) 모든 기능은 키보드만으로도 사용할 수 있어야 한다.
2.1.2 (초점 이동) 키보드에 의한 초점은 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다.
2.1.3 (조작 가능) 사용자 입력 및 컨트롤은 조작 가능하도록 제공되어야 한다.
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(적절한 링크 텍스트) 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 한다.

검사항목 8 : 키보드 사용 보장

1>키보드 사용 보장 개념

텍스트를 입력하기 위한 키보드 조작 이외에도 마우스로 이용할 수 있는 모든 기능에 대해 키보드로도 이용할 수 있도록 하는 것

2>키보드 사용 보장 목적

시각장애, 상지장애, 운동장애 등과 같이 마우스를 이용하기 어려운 사용자가 키보드를 이용할 수 있도록 한다

3>키보드 사용 보장의 필요성

  • 마우스를 사용하기 어려운 사용자가 키보드를 이용할 수 있도록 한다.
  • 일반 사용자도 키보드로 더욱 빠르고 정확한 컨트롤 가능해진다.

4>키보드 사용보장 검사항목 해설

마우스로 이용 가능한 기능은 키보드로도 이용할 수 있도록 구현한다.

예외사항
  • 자유롭게 움직이는 아날로그적인 기능
  • 시뮬레이션과 같은 콘텐츠
  • 입체적인 시각화 기능
  • 마우스를 끌어서 거리를 측정할 수 있는 기능

5>키보드 사용 보장 제공 방법

모든 기능을 키보드로 접근가능하고, 사용 가능하도록 제공한 경우 준수한 것으로 인정
오류 유형
  • 마우스가 제어할 수 있는 요소를 키보드로 제어할 수 없는 경우
    • 오류 사례1 : 이미지에 onclick 자바코드 이벤트를 적용한 경우 : A, input, select, textarea, button 등으로 수정
    • 오류 사례2 : 마우스에 대응되는 키보드 이벤트 핸들러를 적용하지 않아 키보드 접근이 안되는 경우 : 키보드 포커스 초점이 영역 벗어나면 동작하지 않음 --> 키보드 이벤트 핸들러 추가
    • 오류 사례3 : readonly 속성을 사용하여 키보드 접근이 안되는 경우 : 키보드로 우편번호를 선택 불가, 버튼은 자바스크립트코드에 의존적으로 구현 --> readonly 속성 제거, 버튼을 href에 유효한 URL로 수정
    • 오류 사례4 : 마우스에 종속적인 자바코드를 사용한 경우 : 자바스크립트코드로 hover에만 기능을 제공하여 키보드 접근 시 아무 반응 없음 --> hover에 정의했던 기능에서 keyup 이벤트 추가
  • 부가 어플리케이션 콘텐츠의 wmode 값 설정으로 키보드 이용이 불가능한 경우
    • wmode를 transparent로 지정하여 키보드가 접근하지 못하는 상태 --> 플래시 콘텐츠 wmode 값을 window로 지정하여 수정

6>키보드 사용 보장의 주의사항

  1. 반드시 IE8에서 확인할 것
  2. onkeypress, onkeydown, onkeyup 이벤트 핸들러를 사용하여 키보드로 제어가 불가한 경우 감점
  3. 지리정보(GIS), 가상현실(VR) 콘텐츠의 경우 예외 인정하나 기타 인터페이스는 키보드만으로 사용할 수 있어야 함
  4. 키보드로 탭 메뉴에서 탭1-> 탭2-> 탭3으로 이동하여 모든 탭 내용을 확인할 수 없는 경우 감점
  5. onfocus="this.blur();"를 사용하는 경우 검사항목 8,9,19 동시 감점
  6. 플래시 콘텐츠의 wmode값을 transparent 또는 opaque로 지정하게 되면 화면낭독기로 인식이 불가함

검사항목 9 : 초점 이동

1>초점 이동의 개념

키보드에 의한 초점은 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다.초점 : 웹사이트에서 현재 위치하는 영역을 시각적으로 안내하기 위해 제공되는 형태로써 포커스 형태와 커서 형태 등으로 위치를 안내하는 것

2>키보드 사용 보장 목적

시각장애인이나 상지장애인 등 키보드로만 웹사이트를 이용하는 사용자들이 현재의 초점의 위치를 이해하고 원하는 콘텐츠를 이용할 수 있도록 하기 위함

3>초점이동 검사항목 해설

초점은 반드시 기본 점선일 필요 없지만, 초점을 받았을 때 시각적으로 구분 가능하고 현재 키보드 위치를 이해할 수 있게 하면 됨

4>초점 이동 제공 방법

키보드 초점을 받은 링크, 컨트롤 및 입력 서식은 초점을 받지 않은 객체들로부터 구분될 수 있도록 제공한 경우 준수한 것으로 인정
오류 유형
  1. 오류 유형1 : 초점의 이동순서가 논리적이지 않으며 일관성이 없는 경우
    • Tab키와 Sfift+Tab 키에 의한 초점의 이동순서가 논리적이지 않고 일관성 없는 경우 :콘텐츠들을 테이블을 사용하여 위치시키지 않고 논리적 순서로 소스코드를 배열하여 CSS 활용하여 시각적으로 동일한 배치 효과를 가지는 로그인 입력 폼으로 변경하여 초점 개선
  2. 오류 유형2 : 초점 또는 키보드의 위치를 나타내는 요소가 시각적으로 표시되지 않은 경우
    • onfocus="this.blur();"을 사용하여 초점의 시각적 표시를 막음 : onfocus="this.blur();"을 제거하여 개선
  3. 오류 유형3 : <area> 요소의 진행 순서에 의미가 있으나 키보드 접근 순서가 의미와 일치하지 않은 경우
    • <area>의 키보드 접근 순서가 의미와 일치하지 않는 경우 : 이미지 맵을 계층의 순서로 소스 순서를 바꿈

5>초점 이동의 주의사항

onfocus="this.blur();"를 사용하는 경우 키보드 접근은 물론 초점의 시각적 구분이 불가하고, 의도하지 않은 초점변화가 실행되므로 검사항목 8,9,19에서 동시 감점

검사항목 10: 조작 가능

1>조작 가능의 개념

사용자의 입력 및 컨트롤을 조작할 수 있도록 하는 것 : 콘텐츠에 포함된 모든 컨트롤은 대각선 방향의 길이를 6.0mm이상으로 제공

2>조작 가능의 목적

터치 스크린을 채용한 기기를 이용하는 손 떨림이 있는 사용자와 시각 장애인도 컨트롤을 용이하게 찾아서 조작 가능하도록 하기 위함.

3.>조작 가능의 검사항목 해설

링크, 사용자 입력, 기타 컨트롤 등의 안쪽여백 : 링크, 사용자 입력 및 기타 컨트롤은 테두리 안쪽으로 1 픽셀 이상의 여백을 두고 이곳에서는 위치 지정 도구의 조작에 반응하지 않도록 구현하는 것이 바람직

4>조작 가능의 제공 방법

웹 페이지에서 제공하는 모든 이웃한 컨트롤들은 개별적으로 선택하고 사용할 수 있도록 대각선 길이가 6.0mm이상의 크기와 컨트롤의 안쪽 여색이 1픽셀 이상을 갖도록 제공한 경우 준수한 것으로 인정

5>조작 가능의 오류 유형

  • 컨트롤의 크기가 대각선으로 6.0mm 이상 제공하지 않은 경우
  • 링크, 사용자 입력, 기타 컨트롤의 테두리 안쪽으로 1픽셀 이상의 여백을 제공하지 않은 경우

검사항목 11: 응답시간 조절

1>응답시간 조절의 개념

제한된 시간 안에 요구되는 지시, 읽어야 할 내용이 있는 콘텐츠의 경우 그 시간을 조절할 수 있도록 기능을 제공해야 한다.

2>응답시간 조절의 목적

일반적인 사용자 수준에 맞추어 주어진 제한시간은 감각에 장애가 있는 사용자에게는 접근 방식에 따라 시간이 부족할 수 있으므로 적용된 제한시간을 멈추거나 회피할 수 있도록 하여 동등한 정보의 인식을 위해 보완하기 위함

3>응답시간 조절의 검사항목 해설

  • 원천적으로 정해진 시간이 해당 콘텐츠의 주요 목적이 되거나 수단이 되는 경우 예외 인정
  • 제한된 시간이 일번적인 사용자를 위해 제시된 경우는 정보를 습득하거나 기능을 이용하는데 장애인에게는 차별 요소가 될수 있으므로 시간제한이 있는 콘텐츠에 대해서도 정지, 시간을 연장할 수 있는 기능을 제공해야 함
    • ex> 쇼핑몰의 리디렉션 페이지 --> "3초 뒤에 이동한니다." 문구
    • ex> 은행 보완 목적 --> 일정 시간 이후 세션을 종료하는 경우

4>응답시간 조절의 제공방법

시간제한이 있는 콘텐츠의 응답시간을 조절할 수 있도록 제공한 경우 준수한 것으로 인정
오류 유형
  • 오류 유형 1 : 페이지 재 이동시 회피할 수 있는 수단을 제공하지 않은 경우 : 확인, 취소 버튼 제공 및 충분한 시간 제공하여 개선
  • 오류 유형 2 : 제한 시간을 연장하는 방법에 제한 시간이 있는 경우 : 자동로그인 시간을 연장하기 위해 특정 시간을 제공 --> 로긍니 연장 단축키 제공하여 개선

5>응답시간 조절의 주의사항

  • 원천적으로 콘텐츠의 이용에 따르는 시간 조절을 허용할 수 없는 콘텐츠는 예외로 인정
  • 검사대상은 자동전환 페이지(Redirection page), 제한시간 연장, 제한시간 만료 경고 등이 해당됨

검사항목 12 : 정지 기능 제공

1>정지 기능 제공의 개념

자동 변경되는 콘텐츠는 움직임을 제어할 수 있어야 한다.자동으로 변경되는 콘텐츠 : 스크롤되는 배너, 뉴스, 실시간 검색어 등과 같이 자동으로 흐르거나 움직이는 콘텐츠

2>정지 기능 제공의 목적

자동으로 움직이는 콘텐츠에 대한 인식이 느린 고령자, 어린이, 인지 등에 장애가 있는 사용자의 경우 콘텐츠를 인식하는 시간이 오래 걸리므로 고령자, 얼니이, 인지 등에 장애가 있는 사용자가 자동으로 변경되는 콘텐츠를 놓치지 않도록 하기 위함

3>정지 기능 제공의 검사항목 해설

  • 자동 롤링 배너존, 포털의 한줄 뉴스같은 콘텐츠를 주로 검사
    • ex1> 자동으로 변경되는 플래시 콘텐츠
    • ex2> 의미 없는 장식적인 변화를 위해 이미지가 변경되는 경우
  • 정보 제공하는 콘텐츠가 자동으로 변경되는 경우 반드시 이전, 다음, 정지 기능을 제공해야 함

4>정지 기능 제공의 제공방법

자동으로 ㅂ녀경되는 콘텐츠의 움직임을 제어할 수 있도록 제공한 경우 준수한 것으로 인정
오류 유형
  • 오류 유형 1 : 시간에 따라 변화하는 콘텐츠에 정지, 이전, 다음 기능이 없는 경우 : 정지, 이전, 다음 버튼 소스를 앞 부분으로 수정
  • 오류 유형 2 : 시간에 따라 변화하는 콘텐츠가 마우스와 키보드로 제어 불가능한 경우 : 좌우 화살표 마우스 오버시 정지해있으나 키보드로는 정지하지 않음 : 콘텐츠를 제어할 수 있는 정지 버튼을 제공하여 수정

5>정지 기능 제공의 주의사항

  1. 움직이는 배너, 뉴스 등 시간에 따라 변화하는 콘텐츠를 키보드와 마우스로 평가
  2. 키보드 포커스 및 마우스 오버 시 콘텐츠의 변화가 멈춰지면 정지 기능이 제공된 것으로 인정
  3. 검사 대상은 자동적으로 스크롤되는 배너, 자동 변경되는 실시간 검색순위 등이 해당
반응형
댓글
© 2019 Eun's