웹 접근성 이슈 - 아임웹 전문가찾기

웹팁

글 등록하기 | 내글 관리하기 | 연재글 | 보관함

웹 접근성 이슈

2013.08.06 14:00 조회 수

5210

이온디

첨부파일 https://imweb.eond.com/coding/340702

2013년 상반기 IT업계에서 웹표준과 더불어 웹접근성이 이슈랍니다.

웹접근성이란 장애인이나 고령자 등 어떤 사용자든 또한 어떤 기술 환경에서든 전문적인 장비나 능력 없이도

웹사이트에서 제공하는 모든 정보에 일반인과 동일한 접근 및 이용이 가능하도록 보장해주는 것이라 할 수 있습니다. 간단히 말하자면 비단 장애인 뿐만 아니라 모든 사람들이 정보의 제한 없이 웹을 이용할 수 있는 것을 뜻합니다.

웹접근성의 필수 요소

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

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

웹접근성의 법률 제정

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

'국가 및 지방자치단체, 대통령령으로 정한 공공기관의 경우 1년 이내, 즉 2009년 4월 11일까지,

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

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

이러한 웹접근성을 어떻게 구분하고 판단하느냐는 이미 그러한 원칙과 검사 항목이 제공되어 있습니다.

검사 기준별로 원칙 4개, 지침 13개, 검사 항목 22개 입니다.

원칙1. 인식의 용이성

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

원칙2. 운용의 용이성

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

원칙3. 이해의 용이성

컨텐츠는 이해하기 쉬워야 한다.

원칙4. 견고성

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

<출처 : 한국형 웹 콘텐츠 접근성 지침 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 불가시 대체 콘텐츠 필요

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

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

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

첨부파일

Total 235 articles in 8 / 12 pages

	제목	날짜
	코딩 배울 수 있는 사이트 모음(HTML/CSS/JS/IMG/PHP)	2018/01/03
	jQuery를 배울수 있는 동네들입니다.	2013/08/09
	관련 링크 [1]	2010/05/23
95	[HTML5] dl, dt, dd 용례	2009/01/29
94	[Script] XE Layout Menu Script [1]	2009/01/25
93	팝업형식의 메뉴 네비게이션	2009/01/20
92	Side 메뉴	2009/01/20
91	자바스크립트 TAB 메뉴	2009/01/20
90	드롭다운 가로형 메뉴	2009/01/20
89	탭메뉴형 자바스크립트	2009/01/20
88	[HTML5] dl과 ul의 상하관계(?)에 대해서 질문드립니다. [1]	2009/01/20
87	Dolphin CSS Menu	2009/01/20
86	Cut & Paste CSS Horizontal List Menu	2009/01/20
85	[Script] 스크롤 따라다니는 레이어	2009/01/20
84	[Script] 스크롤 따라다니는 레이어 [2]	2009/01/20
83	[Script] 간단한 점프메뉴(selecter)	2009/01/20
82	[Script] 메뉴 슬라이딩(가로) [1]	2009/01/20
81	[Script] 가로 세로가 호환되는 메뉴	2009/01/20
80	[Script] 위의 메뉴에 마우스를 올리면 밑에 메뉴가 나오는 소스	2009/01/20
79	[Script] 롤오버 메뉴에 하위 부메뉴 레이어..(아웃시 하위메뉴사라짐) [2]	2009/01/20
78	[Script] 마우스를 올리면 레이어 뜨고 내리면 레이어 사라지는 스크립트 [1]	2004/06/08
77	[Script] 웹페이지에서 특정 부분 감췄다보여주기 (by 위쯔)	2004/05/30
76	[Script] div 높이 100% 맞추기	2009/01/18