메뉴 보이기
Profile
이온디

2013.08.06

웹접근성

웹 접근성 이슈

조회 수 5118 추천 수 0
2013년 상반기 IT업계에서 웹표준과 더불어 웹접근성이 이슈랍니다. 
웹접근성이란 장애인이나 고령자 등 어떤 사용자든 또한 어떤 기술 환경에서든  전문적인 장비나 능력 없이도 
웹사이트에서 제공하는 모든 정보에 일반인과 동일한 접근 및 이용이 가능하도록 보장해주는 것이라 할 수 있습니다. 간단히 말하자면 비단 장애인 뿐만 아니라 모든 사람들이 정보의 제한 없이 웹을 이용할 수 있는 것을 뜻합니다.

웹접근성의 필수 요소

  • 컨텐츠 : 웹페이지 또는 웹애플리케이션에서 제공하는 정보
  • 사용자 도구 : 웹브라우저, 모바일 앱, 미디어 플레이어 등
  • 보조공학 : 스크린리더, 대체 키보드, 스위치, 스캔, 소프트웨어 등
  • 사용자 : 웹을 사용하는 사람들(장애인 등 특별한 기술을 필요로 하는 사람들 포함)

<그림1. 장애유형별 기기 보유율 및 사용률(2008)>
이미지_1.jpg


웹접근성의 법률 제정

이슈가 되는 요인 중 하나는 웹접근성이 법률로도 제정이 되어있다고 합니다.

'국가  및  지방자치단체,  대통령령으로  정한  공공기관의  경우  1년  이내,  즉 2009년  4월  11일까지, 
그 외 대상은  1년에서  5년 내, 즉  2013년  4월  11일까지 단계적으로  웹  접근성을  준수하도록  하고  있으며,  장애인에게  정당한  편의  제공 규정을 위반할 경우 최고  3,000만원의 과태료가 부과되고, 행위가 악의적인 경우 3년 이하 징역이나  3,000만원 이하의 벌금을 부과할 수 있도록 규정하고 있다'

웹접근성의 원칙과 검사항목

이러한 웹접근성을 어떻게 구분하고 판단하느냐는 이미 그러한 원칙과 검사 항목이 제공되어 있습니다.
검사 기준별로 원칙 4개, 지침 13개, 검사 항목 22개 입니다.

원칙1. 인식의 용이성

모든 컨텐츠는 사용자가 쉽게 인식할 수 있어야 한다.

이미지_2.jpg

원칙2. 운용의 용이성

사용자 인터페이스 구성요소는 간편하게 조작 가능하고 편리하게 네비게이션 할 수 있어야 한다.

이미지_3.jpg

원칙3. 이해의 용이성

컨텐츠는 이해하기 쉬워야 한다.
 
이미지_4.jpg  

원칙4. 견고성

컨텐츠는 미래의 기술로도 접근할 수 있도록 기본 구조가 견고하고 유연하게 만들어야 한다.
 
이미지_5.jpg

<출처 : 한국형 웹 콘텐츠 접근성 지침 2.0 - 웹 접근성 연구소>

이를 내용 별로 쉽게 정리한 표가 있어 소개해드립니다.
출처는 Divplus님의 웹접근성 이슈(2)에 포함된 표입니다.
http://box252.blog.me/20188426298

이렇게 크게 4가지로 나누어져 있습니다.

막상 적용사례나 잘못된 사례를 봐도 어렵기만 합니다.

 

간단하게 정리하겠습니다.

 

 1.1대체 텍스트

 이미지만 제공하는게 아닌 텍스트 제공

 <img alt="설명"> 적극 활용

 alt=" " 불가

 최신 업데이트 필수

 의미 정확해야 함

 1.2멀티미디어 대체 수단

 동영상 제공시 지문이나 수화 필요

 콘텐츠를 색만으로 구분하게 해서는 안됨

 

 1.3명료성

 <,>같은 문자만으로 지시사항 전달은 불가

 명암대비가 4.5:1을 만족해야 함

 자동재생 콘텐츠 불가

 검은 배경, 흑색 글씨 등은 불가

 

 

 

 2.1키보드 접근성

 onfocus나 onblur등을 활용

 초점이 맞춰있는 부분을 나타내는 효과 필요

 

 2.2충분한 시간 제공

 몇 초후 바로 넘어가는 페이지 불가

 

 2.3광과민성 발작 예방

 깜박이거나 번쩍이는 콘텐츠 불가

 

 2.4쉬운 네비게이션

 본문 바로가기 등을 제공

 페이지 구분위해 적절한 제목 제공

 <frame title="제목">

 빈프레임 <frame title="빈프레임">

 

 

 

 3.1가독성

 웹에서 사용하는 언어를 명확히 해야함

 

 

 3.2예측 가능성

 팝업창이 뜨는곳은 미리 알려야 하고,

 키보드로도 접근 가능해야 함

 

 3.3콘텐츠의 논리성

 요약정보를 표시

 summary,caption 속성 사용

 

 3.4입력 도움

 label for속성 활용하여 레이블 제공

 오류시 쉽게 정정이 가능해야 함

 

 

 

 

 4.1문법 준수

 중복 선언 불가 및 중첩 관계를 확실히!

 

 4.2웹 애플리케이션 접근성

 실버라이트,액티브x 불가시 대체 콘텐츠 필요

 

 

어떻게 보면 복잡하고, 쉽기도 하네요.

처음 구축단계부터 웹 접근성 준수가 필요하겠고, 브라우저나 디바이스별 준수도 필요할 듯 싶습니다.

웹표준 뿐만 아니라 웹 접근성 공부도 좀 해야겠습니다.

Profile
7
Lv
이온디

이온디 홈페이지는 간결하며,

 손쉽게 수정할 수 있습니다.

0개의 댓글

에디터
번호 제목 날짜 조회 수
공지 [웹표준] 코딩 배울 수 있는 사이트 모음(HTML/CSS/JS/IMG/PHP) 2018.01.03 99
공지 [jQuery] jQuery를 배울수 있는 동네들입니다. 2013.08.09 19176
공지 [미분류] 관련 링크 2010.05.23 33743
139 [jQuery] 왼쪽에 숨겨진 레이어를 보여주자 2013.08.09 4251
138 [Script] 전체화면 레이어 팝업 소스 2013.08.09 12007
137 [웹폰트] Daum font로 Google Font API 따라잡기 2013.08.09 4050
136 [Script] News Ticker - 한줄 전광판, 한줄씩 올라가는 스크립트, 뉴스티커 2013.08.07 5733
135 [웹폰트] 구글 웹폰트 서비스 이용하기 2013.08.06 4522
[웹접근성] 웹 접근성 이슈 2013.08.06 5118
133 [HTML5] IE보완 - 조건부 주석 2013.08.06 4850
132 [웹접근성] 웹접근성이란 2013.08.06 3842
131 [HTML5] img style 속성 2013.03.12 5894
130 [Meta] Meta Tag(메타태그) 사용법 2013.03.05 6850
129 [부트스트랩] #2 부트스트랩의 특징 1 2013.03.04 5645
128 [부트스트랩] #1 부트스트랩이란? 2013.03.01 4089
127 [HTML5] HTML5 시멘틱 구조 태그 2013.02.28 4667
126 [부트스트랩] 부트스트랩의 아이콘 지원 브라우저 2013.02.25 3695
125 [부트스트랩] 기본 부트스트랩 템플릿 2013.02.24 4026
124 [PHP] 쿠키를 굽자 2013.02.22 3519
123 [Script] 자바스크립트로 CSS 불러오기 2013.02.22 4522
122 [UI] jquery menu slide 2012.12.16 9008
121 [Script] 로그인창 띄우기 2012.12.14 4686