웹 접근성 개요 및 설문조사 보고서

수정일: 2013-07-22 3:56:오후

웹 접근성 이해자료 및 웹 접근성 설문조사 보고서 내용으로 정책입안자와 실무자의 웹 접근성 개요 이해를 목적으로 한다.

웹 접근성 기초이해자료 및 설문조사결과 보고서

본 문서의 내용은 사전 통보없이 변경 될 수 있습니다. 본 문서의 사용으로 인한 직.간접적인 피해에 대하여 책임지지 않습니다. 또한 본 문서는 전문적인 컨설팅 작업으로 사용될수 없습니다.  2004-2010펭귄소프트(주). All rights  reserved. Http://SmartHomepage.co.kr

본 문서는 펭귄소프트(주)의 자산으로 자유롭게 재배포를 하실 수 있습니다. 다만 이를 영리목적으로 무단 사용시에는 법적 제재를 받을 수 있습니다. 본 내용을 사용시에는 꼭 원 저작자 펭귄소프트(주)를 꼭 표기하여야 합니다.

오픈오피스 Writer, Impress, Calc는 Sun Microsystems 사의 등록상표이며, 윈도우, 엑셀, 워드, 파워포인트 는 마이크로소프트 사의 등록상표입니다. 아래한글은 한컴 사의 등록 상표입니다. 기타 모든 등록 상표는 해당 회사의 소유입니다.

목차내용페이지
1웹 접근성 이해4 Page
1.1웹 접근성이란?4 Page
1.2
웹 접근성 4원칙5 Page
1.3웹 접근성 성공요소6 Page
1.4웹 접근성의 상식/오해7 Page
1.5본문바로가기는 시각장애인만을 위한것이다.8 Page
2웹접근성 기본만은 지키자
11 Page
2.1웹표준을 지키자11 Page
2.2페이지별 Meta Tag 작성12 Page
2.3대체문자 제공12 Page
2.4논리적인 내용정렬12 Page
2.5디자인/내용 분리하자12 Page
2.6게시판을 개선하자12 Page
3웹 접근성 설문조사 결과
14 Page
3.1스크린리더 숙련도14 Page
3.2사용하는 스크린 리더 프로그램은15 Page
3.3모바일 스크린 리더 사용여부16 Page
3.4
대체문자는 어떻게 제공하는것이 좋은가?17 Page
3.5가장 어려운 점은 무었인가?18 Page
3.6가장 문제가 되지 않는것은?19 Page
3.7페이지내 내용 찾는 방법은?20 Page
4
홈페이지 방문객 이해21 Page
4.1다양한 방문객21 Page
4.2다양한 컴퓨터 사용23 Page
4.3
컴퓨터/ 웹브라우저 사용 이해
24 Page
5국내 웹 접근성 품질마크 인증심사 기준25 Page
5.1목적
25 Page
5.2기본원칙25 Page

5.3

품질마크 심사종류26 Page
5.4전문가 심사26 Page
5.5사용자 심사26 Page
5.6세부심사 항목27 Page

 

1   웹 접근성 이해

1.1   웹 접근성이란?

시각, 청각, 물리적, 지능적 등 다양한 장애를 가진 홈페이지 방문객도 내용을 인식하고, 이해하며, 홈페이지 내 이동이 가능하며 기능 사용을 할 수 있도록 하는것이다.  또한 남.여.노.소 누구나 리눅스, 윈도우즈, 맥 컴퓨터 그리고 PDA 의 Firefox, IE, Safari, Opera, Chrome등에서 홈페이지 내용접근 및 이해에 문제가 없게 하는것이다. 국내에 약 200만명의 장애인 및 약 720만의 어르신이 계신다고 한다.

웹접근성은 법적으로는 지켜야할 의무이며, 사회적책임을 가지는 정부, 기업, 학교 등의 최소한의 도의이다. 또한 상업적으로 시장확대를 통한 수익을 가져다주는것을 의미한다. 새로운 시장창출 혹 시장으로의 접근을 의미한다. 웹접근성은 옵션이 아닌 필수인 것이다.

1.2   웹 접근성 4원칙

가장 중요한것은 누구나 홈페이지 내용 이해에 문제가 없도록 하는것이다. 크게 4가지 형태로 나누어진다. 영어로는 각 원칙의 첫 알파벳을 사용하여 술을 따르다라는 “POUR” 4원칙이라고 하는데 하나씩 간략하게 쉽게 해석하여 본다. 더 자세한 내용은 http://wah.or.kr혹 http://www.w3.org/WAI/intro/accessibility 를 참조하도록 한다.

1.3   웹 접근성 성공요소

“다 된 밥에 코 빠트린다” 라는 말이 있다.  성공적인 웹접근성 프로젝트를 위해서는 위해서는 5가지가  필요하다.  그중에서 특히 3가지는 절대적이다.  즉, 전문가의 웹표준/ 웹접근성 코딩이 첫째이며, 웹 접근성을 지원하는 솔루션이 두번째이며 마지막으로 데이터입력 및 관리 인력의 교육이다. 어느하나라도 부족하면 아니된다. 특히 게시판이 사용 될 경우 웹 접근성 지원 여부를 확인하여야 한다.

1.웹 접근성 인식전환: 웹접근성을 우리모두에게 필요하다는 인식의 전환이 필요하다.
2.전문가의 웹 접근성 코딩: 초기에 제대로 된 코딩이 되어야 한다.
3.웹 접근성 솔루션: 게시판을 포함, 사용되는 많은 솔루션들은 웹 표준을 지원하여야 한다.
4.데이터 입력: 마지막으로 제대로 데이터 입력을 하여야 한다.
5.담당자교육: 최종적으로 담당자등의 웹 표준/ 웹 접근성 교육이 필요하다.
1.4   웹 접근성의 상식/오해
웹 접근성이란 흔하게 접하는 단어가 되었다. 일부는 무의하게 받아들이고 일부는 왜곡되게 해석하고 있다. 한국만의 웹 접근성 그리고 웹 표준 없는 웹 접근성이 되지 않기를 바란다.  예를들어 웹 표준과 웹 접근성의 관계이다. 대다수의 웹 접근성은 웹 표준에 근거한다. 따라서 가장 기본인 웹 표준 준수는 필수이다. 예를들어 적절한 웹 표준사용 (doctype), 적절한 meta tag사용등 모두가 중요하다.

Credit: sxc.hu


1.4.1   페이지 title등은 그렇게 중요하지 않다.

매우 중요하다. 웹 표준, 웹 접근성, 검색엔진 최적화 모든 면에서 매우 중요하다.  모든 페이지에 최소한 고유한 title (제목) 및 요약은 필수적으로 제공한다. 예를 들어 “펭귄 시청 > 미디어 > 공지사항 내용입니다” 가 제목이 아니라 “웹 접근성 강의 신청바랍니다” 처럼 실제 제목이 title이 되어야 한다.  시각장애인 설문조사에서도 적절하지 않는 제목때문에 홈페이지 이용이 불편하다고 지적하고 있다.


1.4.2   웹 접근성 지원 게시판이 별도 필요하다.

물론 그렇다. 현재 대부분의 게시판은 이전 코딩을 삽입시킨다. 따라서 아무리 잘 된 웹 표준 코딩이더라도 무능화 시키고 만다. 솔루션도 잘 선택하여야 한다. 영문 홈페이지에 게시물이 올라올때 코드가 <html>로 시작하고 euc-kr로 인코딩이 올라오면 황당하지 않겠는가? 솔루션도 웹 접근성이 지원되어야 한다. 현재 상당수 국내 홈페이지에서 발견되는 공통된 사항 중 하나이다. 개시판을 개선하도록 한다.


1.4.3   div로 제작하면 무방하다.

아니다. div는 단지 table로 레이아웃을 설정하지 않고 div라는 테그를 사용하여 레이아웃을 정하는 방법일 뿐이다. 또한 과도한 div사용은 적절하지 않다. 큰 원칙은  레이아웃은 div로 도표 (숫자등) 등은 table 로 사용한다는 것이다.


1.4.4   웹 접근성은 시각장애인을 위한것이다.

그 누구가 무엇으로 어떻게 접속하더라도 홈페이지 접근성을 제공하여야 한다. 따라서 우리 모두를 위한 것이다. 다만 그 사용자 중 청각장애, 행동장애, 이동장애 등을 포함한 사용자가 있을 뿐이다. 특히 본문 바로가기 등은 키보드 사용자에게 매우 중요하다는것을 기억하자.


1.4.5   웹 접근성과 모바일기기 지원은 관계가 있다.

관계가 밀접하다. 웹 접근성 4 원칙중 Robust라는 항목이 있는데, 이는 구체적으로 기술의 진보와 상관없이 홈페이지 접근에 문제가 없어야 한다고 규정한다. 모바일기기 에서 보여지게 하는 것 역시 웹 접근성에 포함된다.


1.4.6   모바일기기 지원은 힘들다.

매우 쉽다. 웹표준에 맞추어 코딩되면, 모바일기기 지원 CSS를 별도 제작하면 된다. 대부분의 경우 A4한장 분량도 되지 않는다. 웹 표준을 준수하면, 모바일 홈페이지를 별도 제작하지 않아도 된다.


1.4.7   모바일기기 웹 접근성 지원은 필요 없다.

필요하다. 미국유타대학 웹접근성 프로젝트에서 실시한 설문조사에서 웹 접근성 조사인원의 60%가까지 모바일 홈페이지를 사용한다고 한다. 따라서 모바일 홈페이지에서도 기본적인 웹 접근성은 지켜져야 한다. 즉, 본문 바로가기, 논리적인 정렬 등 데스크탑과 같은 웹 접근성 지원이 바람직하다 하겠다.


1.4.8   본문바로가기등은 display:none으로 처리한다.

아니다. 보여지게 한다. 이러한 본문 바로 가기 등은 시각장애인 뿐 아니라 키보드 사용자를 포함 이동성 장애를 가지고 있는 방문자를 위한 것이기도 하기 때문에 숨기기를 해서는 아니된다.

1.5   본문바로가기는 시각장애인만을 위한것이다.

절대 아니다. 최근 유타대학에서 웹 접근성 설문조사결과 시각장애인의 경우 예상과 달리 그다지 큰 역할을 하지 않는것으로 조사되었다. 반대로 이동성 장애를 가지고 있는 방문자가 더 많이 사용하는 것으로 분석되었다.  따라서, 현재 대부분의 한국 홈페이지에서 본문 바로가기를 숨기기 하는데, 이는 바람직하지 않다는 점을 다시 한 번 강조한다.

1.5.1   대체문자란 무엇인가?

홈 페이지 내용은 일반 글자, 그림, 동영상, 플래시, 파일 (odt, odp, hwp, doc, xls, ppt등) 등 다양한 형태가 존재한다. 이중에서 글자 (html & text) 를 제외한 모든 형태의 내용은 컴퓨터프로그램 혹 시각장애인이 알아보기 쉽지않다. 따라서 이러한 내용은 누구나 특별한 장비 혹 플러그인 프로그램이 필요없이 읽을 수 있도록 문자형태의 내용을 제공하여야 한다. 이것이 바로 대체문자이다.

1.5.2   대체문자의 형태는?

대체문자는 크게 4가지로 나누어진다. 대체문자가 무슨의미인지 다시 한 번 생각하자. 문자가 아닌 형태의 내용을 전달하는 자료를 문자로 표시하는것이다.


• Alt

alt=”웹접근성 인증마크” 처럼 이미지에 alt라는 코드를 사용하는 경우이다. 너무 길지 않게 제목만을 입력한다. 긴 설명이 필요하면 아래의 longdesc를 사용하도록 한다. 디자인 등 내용을 전달하지 않는 이미지의 경우 alt=”” 처럼 공란으로 놔두면 된다.

Longdesc

longdesc=”웹접근성은 모두에게 필요하며... “ 처럼 길게 설명할 경우 사용된다. 내용이 더 길어지면 해당항목 바로 밑에 본문의 일부처럼 내용을 입력한다.


일반설명

그림, 플래시, 동영상 등 사용 시 바로 다음에 문자형태로 내용을 설명한다. 일반 페이지 내용 입력과 같은 방식이다.

외부파일링크

그 외도 동영상, PDF파일, DOC, HWP 등의 경우 별도의 txt파일 혹 html 파일을 작성하여 대체문자를 제공하는 형태이다.

noscript

<noscript>자바스크립 혹 플래시내용등</noscript> 형태처럼 사용되며 javascript 혹 플래시등 사용시 활용된다. Js 혹 flash 바로 아래에 넣어주도록 한다. Js 혹 플래시가 지원되지 않으면 noscript 안의 내용이 대체문자로 보여지게 된다.

SMILE

주로 동영상 실시간 자막에 사용되면, 사용법이 그다지 복잡하지 않아서 많이 사용된다.

기타형태

기타 내용에 따라서 다른 형태의 대체문자가 존재 할 것이다.

1.5.3   H1 제목테그는 로고에 할당한다.

아니다. 이유는 간단하다. H1은 제목 테그이며, 페이지 내에 한번만 사용한다. 스크린리더가 Heading tag를 전부 불러오는데, 공지사항, 제품소개, 기관장 인사말 등 모든 페이지에 로고가 뜨게 되면 무슨의미가 있는가? 페이지 제목은 그 페이지의 요약으로 제목만 봐도 내용을 알 수 있게 하여야 하며, 이 제목이 바로 H1 tag 인것이다. 이는 구체적으로 웹 접근성 4원칙 (POUR) 에서 규정하고 있으며, 검색엔진최적화 측면에서도 절대적인 중요성을 지니고 있다.

1.5.4   스크린 리더란?

스크린 리더는 일종의 프로그램이다. 문자를 음성으로 읽어주는 기능을 한다. 시각장애인의 경우 글자를 읽을수 없기때문에 글자를 읽어주는 프로그램을 사용한다. 이것이 바로 스크린리더 혹 화면낭독기 라고 한다.  각 프로그램마다 기능이 다르다. 하지만 가장 큰 기능은 비슷하다. 즉, 아래와 같은 2가지 방법으로 홈페이지 이용에 도움을 주고 있다. 물론 그 외도 많은 기능이 존재한다.

1.5.5   제목 글 보여주기

해당 페이지에서 사용되는 모든 제목을 먼저 보여주는것이다. 마치 책 내용을 전체보기 전에 목차를 보면 내용을 짐작하고 특정 제목에 관심이 있으면 해당 페이지를 읽는것과 동일한 것이다. 따라서 홈페이지에서 사용되는 제목은 매우 중요하다. 항상 가장 중요한 h1 제목은 페이지 제목에 할당하도록 한다.  또한 한 페이지에 h1는 한번만 사용한다. 다만 h2~h6은 수차례 사용하여도 된다.

1.5.6   링크 글 보여주기

다른 중요한 기능중 하나는 해당 페이지에 있는 모든 링크를 보여주는것이다. 이 링크 제목을 듣고서 해당 페이지로 이동하는것이다. 따라서 링크이름은 매우 중요하며 실제 페이지의 제목이 되어야 한다. “자세히보기” 가 10개가 보여지면 매우 혼란스러울 것이다.

 

2   웹접근성 기본만은 지키자

2.1   웹표준을 지키자

웹 표준은 웹 접근성의 기본중의 기본이다. 웹 표준이 없는 웹 접근성은 존재하지 않는다.  국내의 경우 대다수의 웹 접근성 홈페이지가 기본적인 웹 표준을 무시되어 제작. 관리 되고 있다.  이는 아이러니한 현상이다. 웹 표준 없는 웹 접근성 홈페이지가 어떻게 존재 할 수 있겠는가?  한국만의 한국화된 웹 접근성은 의미가 없다. 묻지마 식 웹 접근성은 머지 않아서 또 다시 홈페이지를 개편하면서 표준을 준수하여야 하는 상황이 발생할 것이다. Credit: sxc.hu

2.2   페이지별 Meta Tag 작성

Meta tag는 각 페이지별로 고유하게 작성하여 이것만 읽어봐도 페이지가 어떠한 웹 표준을 지키고, 어떠한 내용인지를 바로 파악할 수 있어야 한다. 수 많은 항목 중 아래는 꼭 필요한 사항이다. 다시 한 번 강조한다. 각 페이지별 고유한 내용을 작성하여야 한다.

  • DOCTYPE 은 매우 중요하다. 적절한 것을 사용하도록 하자.
  • XML Lang 은 특히 Screen Reader에 매우 중요하다.
  • Title은 각 페이지별 고유한 의미있는 제목을 제공하자.
  • Description 역시 페이지별 고유한 것으로 입력하자.
  • Keywords 는 가능한 페이지별 고유한 키워드를 입력한다.

2.3   대체문자 제공

특히 의미를 전달하는 그림 (이미지), 동영상 (비디오), 플래시, 파일 (odt, odp, hwp, doc, xls, ppt등) 에는 대체문자를 제공한다. 자세한 내용은 대체문자 항목을 참고한다. 이 대체문자 제공은 웹 표준, 웹 접근성 그리고 검색엔진최적화 모든면에서 매우 중요하다.

2.4   논리적인 내용정렬


목차가 없는 책을 생각해보자. 전체 내용을 읽기전까지 내용파악이 어려울것이다. 웹 페이지도 제목에는 목차1, 다음 목차에는 목차2 등 목차를 사용하여야 한다.  스크린 리더라는 프로그램은 목차만을 추출하여 읽어주며 시각장애인의 경우 페이지 내 이동 방식 중 목차를 활용하는경우가 많다는 것을 이해하도록 한다.


2.5   디자인/내용 분리하자


일반페이지에서는 상대적으로 양호한 상태로 파악된다. 다만 상당한 부분에서 html 기초문법을 비롯하여 웹표준 및 웹접근성등 을 모두 무시한 경우가 매우 자주 발견된다. 특히 게시판과 관련된 부분에서 이러한 현상이 확실히 나타난다.


2.6   게시판을 개선하자


현재 사용중인 게시판 및 html 편집기는 가장 먼저 개선하여야 한다. 이 편집기는 기본적으로 내용과 디자인 분리를 불가하게 만들며 작성된 소스코드는 최악의 코드를 생성한다. 이는 웹표준 등 모든부분을 무능하게 만든다.


2.6.1   웹표준을 준수하자


웹 접근성 이전에 먼저 웹표준을 준수하자. 현재 KISTI 홈페이지는 웹표준을 준수하지 못하는곳이 많이 발견된다. 웹표준없이 웹접근성도 없다는것을 기억하자. 웹표준 구현은 기술적으로 난이도가 낮다. 즉, 누구나 할 수 있다는 의미이다.


2.6.2   한글과 영문을 구분하자


영문홈페이지 소스에 에 한글이 그대로 나오고 있다. 이 점을 개선하자. 특히 영문 홈페이지의 경우 웹표준, 웹접근성, 그리고 검색엔진최적화 모든면에서 매우 개선점이 많다. 국내 대표 연구기관으로서의 위상에 맞는 영문홈페이지가 필요하다.

 

3   웹 접근성 설문조사 결과

웹 접근성 제공시 단순히 규정상의 내용을 숙지하여 따르는 것 보다 실제로 다양한 홈페이지 방문객이 어떻게 홈페이지를 이용하는지 이해하는 것은 매우 중요하다고 하겠다.  특히 시각장애인 등의 경우를 미국의 예를 들어 살펴본다. 기본적인 스크린 리더라는 프로그램의 동작원리가 같기 때문에 한국의 경우도 비슷하다. 아래는 미국 유타대학의 WebAIM이 실시한 Screen Reader 리서치 자료이다. 자세한 내용은 해당 홈페이지를 참조한다. Http://webaim.org

주의할 점은 아래의 조사결과가 모두를 대변하지는 않는다는 사실이며 각 국가별로 환경이 다르다는 점도 기억하여야 한다.


3.1   스크린리더 숙련도


대부분이 스크린리더 사용에 익숙한것으로 조사되었다. 약 95.3%의 응답자가 중급 혹 고급 사용자라고 응답하였다. 이러한 수치는 상당한 의미가 있다고 해석된다. 즉, 대다수의 시각장애인이 스크린 리더를 잘 활용하고 있기때문에 웹사이트 제작시 가장 기본적인 일부 웹 표준 및 스크린 리더가 잘 이해 할 수 있도록 코딩 및 내용을 정렬하는 것이 중요하다고 하겠다. Source: www.webaim.org

 

3.2   사용하는 스크린 리더 프로그램은?


미국의 경우 JAWS 및  Window Eyes라는 제품이 가장 많이 사용되고 있다. 특히 JAWS의 경우 약 66.4%로 결과가 나왔는데 대체적으로 시장에서 수용하고 있는 수치이다. 대다수 프로그램 (JAWS포함) 은 유료이며 비용이 수천불에 이르기도 하기 때문이다.

대부분의 스크린 리더가 제공하는 아래에서 주목 할 만한것은 NVDA 이다. 이 프로그램은 시각장애인이 프로그래머와 함께 시각장애인을 위하여 제작하여 무료료 공개한다는 점이다. 불행한 것은 약 20개의 언어가 지원되나, 한글은  아직 지원되지 않고 있는데 이는 국제적인 open source community의 기여도가 낮기 때문으로 분석된다. Source: www.webaim.org


3.3   모바일 스크린 리더 사용여부


가장 놀라는 결과중 하나가 바로 이 모바일 기기의 사용이다. 일반인의 생각과 달리 약 50% 가까이가 모바일 스크린 리더를 사용한다고 응답하였다. 따라서 웹 접근성이란 단순이 데스크탑을 떠나서 모바일 기기까지를 포함하는것이 바람직 하다고 할 것이다. 또한 스크린 리더 프로그램을 잘 사용하는 사용자는 모바일 기기 스크린 리더 사용빈도도 역시 높았다.

물론 일반인의 경우에도 스마트폰을 비롯하여 모바일 기기의 사용이 증가하고 있기때문에 홈페이지 제작시 모바일 기기 지원이 필수하고 하겠다.

Source: www.webaim.org

3.4   대체문자는 어떻게 제공하는것이 좋은가?


내용을 전달하는 이미지의 경우 이미지 대신 글로 표현하는 대체문자가 사용된다. 대다수의 경우 대체문자는 간략하게 제공하는 것을 원하고 있었다. 예를 들어 “웃는 아가씨” 라는 이미지의 경우, “웃고 있는 아가씨 사진” 이라고 표현하는 것이 가장 선호되는 것으로 나타났다. 또한 가장 선호도가 낮은 것은 대체문자를 불필요하게 길게 나열하는 것으로 나타났다. 따라서 대체문자를 제공시에는 가장 적절한 문자를 간결하게 전달하는 것이 중요하다고 하겠다.  

추가로 이미지는 사진, 도표, 등 좀 더 복잡한 내용을 전달하는 이미지가 존재한다. 이 경우 그림 바로 다음에 해당 이미지의 설명을 제공하는 것을 가장 선호하는 것으로 나타났으며 다음으로는 다음에는 별도의 페이지에 설명을 제공하되 링크를 눌렀을 때에 해당 내용을 보여주는 것을 선호 하였다.  따라서 복잡한 이미지는 대체문자를 간략히 제공하고 그림 바로 밑에 내용을 자세히 설명하는 것이 가장 현실적이며 적절한 것으로 조사되었다.

Source: www.webaim.org

3.5   가장 어려운 점은 무엇인가?


홈 페이지를 이용하면서 가장 어려운 점으로는 아래와 같이 응답하였다. 응답 중 가장 어려워하는 것은 자동글 방지를 위하여 사용하는 Captcha, Flash, 모호한 링크,  부적절한 대체문자 등으로 나타났다. 따라서 단순히 대체문자를 제공하는 차원이 아닌 실제 적절한 대체문자를 제공하는 것이 중요하다고 하겠다. 또한 링크 역시 “자세히보기” 가 아닌 “웹 접근성 자세히보기” 등으로 표시하여야 한다. 또한 Flash는 제작시 웹 접근성을 제공할 수 있는 형태로 제작을 하거나 가능한 텍스트로 표현하는것이 바람직 하다.

단순하면서 중요한 제목 (heading) 도 문제가 되는 것으로 조사되었다. 이는 heading을 이용하여 내용을 보거나 이동하는데 적절하게 사용되지 않는 heading 때문에 사용하는데 문제가 있는 것으로 판단된다. 예상과는 달리 “본문 바로가기” 등은 그다지 문제가 되는 않는것으로 조사되었다. 이는 스크린리더가 제목보기, 링크보기 등 다양한 기능으로 페이지를 사용하기 때문인 것으로 판단된다.

Source: www.webaim.org

3.6   가장 문제가 되지 않는것은?


아마도 조사 결과 중 가장 흥미로운 사실 중의 하나인 것은 “본문바로가기” 이다. 약 31% 의 응답자가 문제가 되지 않는다고 답하였다.  즉, 다른 어떠한 것보다 가장 문제가 되지 않는다고 응답한것이다. 이러한 결과는 스크린 리더를 사용하는 시각장애인 보다는 정상적인 시력을 가지고 있으나 키보도를 사용하는 사용자가 본문바로가기를 더 많이 이용하고 있다는 분석과 일치한다.  

상당수 홈페이지가 본문바로가기 등의 링크를 display:none혹 1px등의 형태로 시각적으로 보이지 않게 표시하고 있다. 이는 매우 바람직하지 않다. 본문바로가기등은 꼭 시각적으로 표시되게 한다.

본문 바로가기가 없어도 문제가 별로 없다는 의미이다. 하지만, 이 기능이 불필요하다는 의미는 아니다. 단지, 사용에 있어 가장 문제가 되지 않는다는 점이다. 또한 웹 접근성은 우리 모두를 위한것이라는 점을 기억한다. 즉, 시각장애인 뿐아니라 일반 사용자 모두를 포함한다는 것이다.

Source: www.webaim.org

3.7   페이지내 내용 찾는 방법은?


약 50.8%가 제목를 이용하여 페이지내 내용을 찾는것으로 나타났다. 즉, 제목의 사용은 매우 중요하다는 것을 다시한 번 입증하는 결과이다.  여기에서 제목은 heading 으로 h1~h6까지 존재한다. 이 제목을 적절히 활용하는 것은 여러 측면에서 매우 중요하다고 하겠다.

다음으로 많이 사용되는 것이 바로 검색 기능이다. 이 검색 기능은 전체적인 홈페이지 검색을 의미한다. 따라서 검색기능 제공은 웹 접근성 제공에 있어서 필수적인 항목인 것으로 다시 한 번 확인 되었다.

약 16%가 응답한 링크 이용은 3번째로 많이 사용되는 항목이다. 링크이름을 적절히 제공하는 것은 매우 중요하다. 예를 들어 “자세히 보기” 가 아니라 “ 스마트홈페이지 자세히 보기” 등으로 링크이름을 제공하여야 한다.

Source: www.webaim.org

 

4   홈페이지 방문객 이해


홈페이지를 누가 어떻게 이용하는가 라는 질문의 이해는 매우 중요하다. 아래의 경우을 간략히 살펴보도록 한다. 물론 아래는 대표적인 경우에 해당된다. 각 사용자 별로 다양한 방식으로 홈페이지를 이용한다.

4.1   다양한 방문객


일반인, 시각장애, 청각장애 등을 포함한 다양한 형태의 사용자자 존재한다는 것을 기억하여, 각 사용자가 불편 없이 홈페이지를 이용할 수 있도록 한다. Credit: sxc.hu


4.1.1   시각장애인


시각장애 (일부 장애 혹 완전 장애)를 가진 방문자가 존재한다. 이 경우 2가지의 방법이 있다. 하나는 고대비 디자인을 제공한다. 문자가 아닌 내용을 전달하는 컨텐츠에는 대체문자를 제공하도록 한다.

4.1.2   청각장애인


일부 혹 완전 청각장애를 가진 방문객이다. 이 경우 오디오, 비디오 등 청각으로 전달하는 내용은 자막을 제공하거나 원고를 제공하여야 한다.


4.1.3   지체장애


마우스 혹 키보드 등 을 원활하게 사용을 하지 못하는 방문객이다. 특정 기능으로 바로가는 키보드 값을 제공하거나 페이지 내 이동을 하는데 키보드 (tab 등)만으로도 가능하도록 하여야 한다.

4.2   다양한 컴퓨터 사용


다양한 컴퓨터를 이용하여 홈페이지를 이용한다. 아래는 대표적인 컴퓨터이다. 각 컴퓨터별 특성을 어느정도 파악하는것은 의미가 크다. 특히 한국에서는 활용이 적은 리눅스 및 맥 컴퓨터는 일부 국가에서는 매우 높다는것을 기억하여야 한다. 특히 수출용 홈페이지는 다양한 컴퓨터에서 홈페이지가 문제 없이 잘 보여지게 하여야 한다.

Credit: sxc.hu


4.3   컴퓨터/ 웹브라우저 사용 이해


다양한 사용자는 다양한 컴퓨터 및 웹 브라우저를 이용하여 홈페이지를 이용한다. 2010년 1월 기준 브라우저별 시장 점유율이다.. 모든 컴퓨터 기종에서 사용되는 Firefox 브라우저의 시장 점유율이 꾸준히 증가하고 있다. 국가별로 시장 점유율은 다르다는 점에 주의하도록 한다. Source: wikipedia

 

5   국내 웹 접근성 품질마크 인증심사 기준

국내는 크게 4가지 분류에 의하여 18가지 항목을 심사한다. 아래는 행안부 산한  NIA 의 자료를 인용한 것이다.

 

5.1   목적

국내 실정에 맞는 웹 접근성 표준모델 및 인증기준 제시를 통한 우수한 웹 접근성 준수 사이트 발굴 및 웹 접근성 향상 도모.

※ 웹 접근성이란(Web Accessibility)이란?
장애인, 고령자 등이 웹 사이트에서 제공하는 정보에 일반인과 동등하게 접근하고 이용할 수 있도록 웹 사이트 접근 환경 및 수준


5.2   기본원칙


웹 접근성 국가표준인 ‘인터넷 웹 콘텐츠 접근성 지침’의 각 항목에 대한 기술 가이드라인으로 “장애인 웹 접근성 국가표준 기술 가이드라인”의 18개 지표를 준용하여 객관적인 심사 기준 마련.

※ 웹 접근성 국가표준이란?
인터넷 웹 콘텐츠 접근성 지침’(KICS.OT-10.0003, '05.12)은 장애를 가진 사람들이 접근할 수 있도록 웹 콘텐츠를 제작하는 방법을 기술한 표준 문서로 미국의 재활법 508조 및 W3C의 WCAG 1.0 등의 내용을 국내현실에 맞게 적용

※ 장애인 웹 접근성 국가표준 기술 가이드라인이란?
장차법 웹 접근성 준수 의무화에 따른 명확한 기준을 제시하기 위해 행정안전부에서 마련한 지침으로 웹 접근성 국가표준을 기반으로 ‘08년 7월~12월까지 관련 전문가, 장애인단체, 보조기기업체, 포털업체, 웹 개발자 등의 다수의 의견을 종합적으로 수렴하여 제정

웹 접근성 보장, 기술구현 가능성 등을 종합적으로 고려한 현실적인 심사 기준 설정
접근성 보장에 요구되는 필수, 권고, 권장 지표 제시

5.2.1   심사지표


인터넷 웹 콘텐츠 접근성 지침 1.0’에서 제시하고 있는 요구조건을 웹 접근성 여건 및 평가환경에 맞게 재조정
13개 항목 → 13개 항목 18개 지표

5.3   품질마크 심사종류


사전심사 : 자동평가도구(K-WAH)와 수동평가를 병행- 사전심사 지표

  • 1. 대체 텍스트 제공,
  • 2. 데이터 테이블 의미태그 제공,
  • 3. 온라인서식 레이블 제공,
  • 4. 적절한 페이지 타이틀 제공,
  • 5. 스킵네비게이션 제공,
  • 6. 새창(팝업창) 사용,
  • 7. 자바스크립트 의존,
  • 8. 동영상 자막 제공 등 총 8개- 8개 지표 모두 95% 이상을 준수해야함


5.4   전문가 심사


18개 지표 모두 95% 이상으로 준수해야 함
※ 지표에 따라 미준수 건당 10% 감점 될 수 있음


5.5  사용자 심사


주요 이용자 과업모형에 의한 사용성 심사로 95% 이상 준수해야 함
※ 사이트별 특성에 맞게 별도 설정


5.6   세부심사 항목


아래역시 행안부 산한 NIA 자료를 그대로 인용한것이다. 자세한 내용은 http://nia.or.kr 를참조하기 바란다.

구분 항목(13개) 지표(18개)

1.  인식의 용이성 (3개)


1-1. 텍스트 아닌 콘텐츠의 인식

(1) 이미지의 의미나 목적을 이해할 수 있도록 적절한 대체 텍스트를 제공해야 한다.

※ 의미가 있는 이미지의 경우 대체 텍스트를 의미나 기능이 동일하게 제공
※ 의미가 없는 이미지(글머리기호, 테두리, 장식용 이미지, 공백 이미지 등)의 경우 대체 텍스트를 blank(alt="")로 제공

(2) 배경 이미지가 의미를 갖는 경우, 배경 이미지의 의미를 이해할 수 있도록 대체 콘텐츠를 제공해야 한다.

※ 의미가 있는 이미지는 배경 이미지로 사용하지 않는 것이 바람직함

1-2. 멀티미디어 매체의 인식

(3) 동영상, 음성 등 멀티미디어 콘텐츠를 이해할 수 있도록 대체 수단(자막, 원고 또는 수화)를 제공해야 한다.

※ 실시간 방송이라도 대체 수단을 제공하여야 하나, 예외로 인정할 수 있음

1-3. 콘텐츠의 시각적 명료성


(4) 색상을 배제하여도 원하는 내용을 전달할 수 있도록, 색상 이외에도 명암이나 패턴 등으로 콘텐츠 구분이 가능해야 한다.

 

2. 운용의 용이성 (6개)

2-1. 이미지 맵 기법 사용 제한

(5)서버측 이미지 맵을 제공할 경우, 해당 내용 및 기능을 사용할 수 있는 대체 콘텐츠를 제공해야 한다.

※ 지리정보의 경우에는 예외로 인정할 수 있음

2-2. 프레임의 사용 제한

(6)프레임을 제공할 경우, 해당 내용을 이해할 수 있도록 적절한 제목(title 속성)을 제공해야 한다.

2-3. 깜빡거리는 객체 사용 제한

(7)깜빡이는 콘텐츠를 제공할 경우, 사전에 경고하고 깜빡임을 회피할 수 있는 수단을 제공해야 한다.
※ 깜박임 기준: 초당 3~49번을 깜박이는 콘텐츠

2-4. 키보드로만 운용 가능

(8)모든 기능을 키보드로 이용할 수 있어야 한다.

2-5. 반복 내비게이션 링크

(9)반복되는 링크를 건너뛸 수 있도록 건너뛰기 링크(skip navigation)를 제공해야 한다.

2-6. 반응시간의 조절기능

(10)시간 제한이 있는 콘텐츠를 제공할 경우, 시간 제어 기능을 제공해야 한다.
※ 예외사항 : 경매, 실시간 게임 등과 같이 시간제한이 필수적인 콘텐츠

(11) 새 창(팝업창 포함)을 제공할 경우, 사용자에게 사전에 알려야 한다.

 

3. 이해의 용이성 (3개)

3-1. 데이터 테이블 구성

(12) 데이터 테이블을 제공할 경우, 테이블의 내용을 이해할 수 있는 정보(제목, 요약정보 등)를 제공해야 한다.

(13) 데이터 테이블을 제공할 경우, 제목 셀과 내용 셀을 구분할 수 있어야 한다.

3-2. 페이지의 논리적 구성

(14) 해당 페이지를 잘 이해할 수 있도록 페이지 제목(<title>)을 제공해야 한다.

(15) 콘텐츠는 논리적인 순서로 구성되어야 한다.

3-3. 온라인 서식 구성

(16) 온라인 서식을 제공할 경우, 레이블(</title><label>)을 제공해야 한다.

 

4. 기술적 진보성(1개)

4-1. 신기술의 사용(17) 애플릿, 플러그인(ActiveX, 플래시) 등 부가 애플리케이션을 제공하는 경우, 해당 애플리케이션이 자체적인 접근성을 준수하거나 사용자가 대체 콘텐츠를 선택하여 이용할 수 있어야 한다.

(18) 마크업 언어로 구현할 수 있는 기능(링크, 서식, 버튼, 페이지 제목)을 자바스크립트로만 구현하지 말아야 한다.

Back to List

사용자댓글

  • 아직 댓글이 없습니다. 처음으로 댓글을 주시기 바랍니다
댓글작성





Please limit to 300 characters

계산된 숫자를 입력하세요

9-6=

Copyrights(c). All rights reserved. 2024

스마트홈페이지
SmartHomepage Member Site