NARADESIGN:BLOG :WIKI

웹표준, 웹접근성, 유니버설디자인, HTML, CSS, UI, UX, UD


‘WCAG 1.0, Section 508, KWCAG 1.0′ 소개 및 드림위버를 이용한 접근성 검사.

본문 건너 뛰기

WCAG 1.0(웹 콘텐트 접근성 지침 1.0)

WCAG 라는 것은 익히 잘 알고 계시는 대로 W3C 에서 권고하는 ‘웹 콘텐트 접근성 지침(Web Content Accessibility Gidelines)’ 에 관한 국제 표준안(WCAG 1.0, 1999.05) 입니다. 웹 접근성이라는 단어를 처음 접하는 사람들은 이 지침이 단지 ‘장애인’ 을 위한 지침으로 오해되기도 하는데 이는 교정되어야 합니다. 장애인 뿐만 아니라 정상인들의 다양한 접속장치(다기종 브라우저, 모바일 및 PC를 포함한 기타 인터넷 접속장치)와 그 밖의 다양한 접속환경(접속속도, 장애유사환경 등)을 고려한 지침으로서 소수를 위한 웹이 아닌 보편적인 웹문서를 작성하기 위한 지침인 것입니다. 이를 준수하는 것이 모든 인류와 장치를 위한 국제적인 표준임을 다시한번 강조 합니다. 이해를 돕기위해 간단한 예를 하나 들면 이렇습니다.

접근성 지침의 하나로서 텍스트로 되어 있지 않은 비텍스트콘텐츠(이미지, 플래시 등)에는 반드시 대체문자(음성출력을 지원하는 최소한의 수단)를 입력하도록 되어 있습니다. 이 때 고려되는 음성장치는 단지 시각장애인을 위한 것일까요? 차량용 네비게이션 장치에 인터넷이 연결되어 있고 운전자가 이를 읽을 수 있도록 배려 한다면 어떨까요? 깨알만한 글씨를 그냥 눈으로 읽도록 내버려 둘까요? 요리에 전념하고 있는 주부에게 냉장고가 읽어주는 인터넷 요리법은 어떨까요? 노안이 되어버린 부모님이 구청 웹사이트에서 자신에게 돌아올 복지혜택을 알고자 한다면요? 이들이 장애인은 아니잖아요?

‘웹 접근성, 상호운용성, 장치독립성’ 에 대한 좀더 명확한 정의가 있지만 저는 ‘웹 접근성’ 이 장애인을 위한 개념이라는 데에는 동의하기 어렵더군요. 접근성이라는 개념이 장애인에게 크게 도움이 되기는 하지만 장애인만을 위한 개념이 아니라는 의미 입니다.

Section 508(미국 재활법 508조)

‘미국 재활법 508조’ 는 정보기술활용에 대한 장애인의 차별을 금지하기 위해 1998년 제정되어 2001년 6월 부터 미국 연방정부에 적용되기 시작했습니다. 연방정부에 조달되는 전자 및 정보기술제품에 관한 강제적 법률입니다. 따라서 민간기업이나 지방정부에는 강제적용되지 않고 시민권리에 관한 법률이라기보다는 조달법에 가깝습니다. 하지만 미국의 국가적 입지와 무역통상의 관례에서 볼 때 이것은 범세계적인 규정으로 발전할 가능성이 있습니다.(참조, IABF 현준호)

KWCAG 1.0(한국형 웹 콘텐츠 접근성 지침 1.0)

KWCAG 1.0 (Korean Web Contents Accessibility Guidelines 1.0)은 한국정보통신기술협회(TTA) 민간단체표준으로 확정(2004.12)되었으며 ‘WCAG 1.0′ 과 ‘미국 재활법 508조’ 를 근간으로 하여 국내 실정에 맞게 제정되었습니다. 하지만 그 내용을 자세히 들여다 보면 국제 표준안과 거의 흡사하여 마치 ‘WCAG 1.0′ 지침을 준수하기만 하더라도 ‘KWCAG 1.0′ 에 대한 고려를 별도로 하지 않아도 될 정도 입니다. ‘WCAG 1.0′ 문서는 행정자치부에서 발표한 ‘행정기관 홈페이지 구축운영 표준지침(2005.04)’에 수록되어 있으며 최근의 공공행정기관 웹사이트 구축 RFP(Request For Proporsal, 제안요청서) 문서에는 이를 반드시 지킬것을 명시하고 있습니다. 물론 강제규정(법)이 아니기 때문에 이를 모르거나 아예묵살하는 ‘지방자치단체’ 도 있을 수 있습니다. 하루속히 법률화(강제화) 되어 공공행정기관의 사회적 책임을 다하도록 촉구되어야 합니다. 공공행정기관이 이러한 사회적 책임을 다하지 않는 경우 국민으로부터 소송 당하는 것은 시간문제 입니다.

접근성 지침 준수 프로젝트에 투입된 실무자의 임무

퍼블리셔만 알아서는 안됩니다. 기획자, 디자이너, 퍼블리셔, 프로그래머 모두 상기 지침을 읽어보는 것이 권장됩니다. 접근성 지침에 대한 이해가 없는 기획자나 디자이너가 접근성이 확보된 플래시 메뉴 네비게이션을 만들어 주겠노라고 클라이언트에게 뻥을 치는 난감한 사례가 발생할 수 있다는 것은 충분히 짐작하고도 남습니다. 또한, 접근성 높게 코딩 되어있는 XHTML 문서를 프로그래머가 엉망으로 만들어 놓을 수도 있기 때문입니다. 퍼블리셔는 이 분야에 대하여 가장 높은 이해도를 지니고 있어야 하고 다행히도 드림위버가 이것을 돕습니다. 참, 클라이언트에게 올바른 접근성을 이해시키는 것도 숙제군요. 접근성에 대한 오해(사례1, 사례2)가 생각보다 참 많습니다.

드림위버를 이용하여 ‘WCAG 1.0′ 및 ‘Section 508′ 접근성 검사하기

  1. ‘File > Check Page > Check Accessibility’ 항목을 클릭합니다.

    현재 열려있는 페이지의 웹 접근성을 검사합니다. 드림위버의 웹 접근성 검사메뉴

  2. ‘Result > Site Report’ 패널에 ‘Section 508′ 및 ‘WCAG 1.0′ 지침 위반 항목과 수동검사 요구항목이 리스팅 됩니다.

    • ‘?’ 표시는 확인요함. 기계가 검사할 수 없으므로 직접 사람이 수동으로 검사하여야 할 항목 입니다.
    • ‘X’ 표시는 지침위반. 이 항목을 더블클릭 하면 해당 파일이 열리면서 지침에 어긋나는 코드가 반전 됩니다.
    • ’1.1~14.3′ 표시는 ‘WCAG’ 지침의 항목별 번호 입니다.
    • ‘P1~P3′ 는 ‘WCAG’ 지침의 중요도 입니다. P1은 반드시 지켜야 할, P2는 가급적 지켜야할, P3는 지킬수록 좋은 항목으로서 숫자가 낮을수록 중요도가 높습니다.
    • 더 자세한 내용을 보려면 해당 항목의 ‘콘텍스트메뉴(마우스 우측버튼 활성메뉴)’를 펼친 다음 ‘More Info…’ 항목을 클릭합니다. 드림위버의 웹 접근성 검사결과
  3. 지침 위반항목 위에서 콘텍스트메뉴를 활성화 하고 ‘More Info…’를 클릭하면 다음과 같은 설명이 제공 됩니다.

    아래 예제는 CSS 속성의 값으로서 절대단위 ‘in, px, mm’ 대신 ‘%, em’ 과 같은 상대단위의 값을 사용할 것을 지시하고 있습니다. 잘못된 점이 무엇인지, 어떻게 고치는지, 그래서 얻을 수 있는 장점이 무엇인지 친절하게 설명해 주고 있네요. 영어로 설명되어 있지만 비교적 이해하기는 쉬운 편입니다. 접근성 검사결과 상세보기

  4. 사이트 전체에 대한 접근성 검사를 진행 하려면 ‘Result’ 패널 좌측 상단의 ‘Reports’ 로컬사이트 전체 검사를 위한 옵션 활성화 버튼 버튼을 누릅니다.

    1. ‘Reports’ 라는 대화상자가 열립니다.
    2. ‘Entire Current Local Site’ 를 선택합니다.
    3. ‘HTML Reports’ 항목에 전부 체크하고 ‘Run’ 버튼을 누릅니다.
      • ‘Combinable Nested Font Tags’ : 중첩되어 병합 가능한 Font 태그.
      • ‘Accessibility’ : 접근성 관련 항목
      • ‘Missing Alt Text’ : 비어있는 대체문자
      • ‘Redundant Nested Tags’ : 중복된 중첩 태그
      • ‘Removable Empty Tags’ : 제거해도 관계없는 빈 태그
      • ‘Untitled Document’ : 제목없는 문서 로컬사이트 전체 검사 옵션
    4. 이렇게 사이트 전체에 대한 접근성 검사를 진행하는 데에는 다소간의 시간이 소요됩니다.
    5. 검사결과는 ‘Result’ 패널의 좌측에 위치한 ‘Save Reports’ 검사결과 저장버튼 버튼을 이용하여 *.xml 형태로 저장할 수 있습니다.

드림위버가 비록 국내 지침인 ‘KWCAG 1.0‘에 대한 검사까지 지원하지는 않습니다. 하지만 본 기능을 참조하여 ‘WCAG 1.0‘ 을 준수한다면 대부분의 경우 별도로 국내 지침을 의식하지 않고 작업을 진행해도 됩니다. 만약 ‘KWCAG 1.0′ 에 대한 리포트를 제출해야 한다면 그때는 ‘KADO-WAH‘ 를 이용하세요. 웹 접근성 지침을 준수해야 하는 국내 프로젝트에서는 KADO-WAH 가 제공하는 사이트 리포트 기능이 꽤 쓸만 합니다.

분류: 드림위버,웹 접근성 | 2006년 10월 31일, 15:29 | 정찬명 | 댓글: 6개 |
트랙백URI - http://naradesign.net/wp/2006/10/31/88/trackback/

6개의 댓글이 있습니다.

  1. 김기창말하길

    와! 많이 달라졌네요. 좋은 정보 감사합니다.

  2. 정찬명말하길

    수선좀 했습니다 ^^;
    많이 바쁘실텐데 여기까지 행차해주셔서 영광이구요.
    오픈웹쪽 소개페이지를 링크만 했는데 제 글이 핑백되어 그쪽에 걸리게 되었네요.
    이렇게 자동으로 핑백 되는걸 처음 보았습니다.
    유용하고 재미난 기능이네요.

  3. 유인동말하길

    좋은 글 이네요.
    많은 참고 하고 갑니다^^;;
    드림위버를 잘 사용안했는데 좋은 기능들이 많군요~

    CDK 에서 강의도 잘 들었었습니다^^;;
    제 블로그에도 가끔 들려주세요^^

  4. 정찬명말하길

    방금 다녀왔습니다! 블로그 개설 하루만에 인기 싹쓸이 하시깁니까 정말? ㅡ-; ㅎㅎㅎ.

  5. 박영식말하길

    첫 줄에 WCAG 1.0의 연도가 잘 못 되었습니다. 1999.05 입니다. 수정 부탁드려요.

  6. 정찬명말하길

    박영식님, 감사합니다 ^^

댓글 쓰기

전송된 글이 나타나지 않는다면 필터링 된 것입니다. dece24앳gmail.com 으로 메일 주세요.
(X)HTML 코드 사용이 가능하지만 소스 코드 출력을 원하시면 <꺽쇠>는 [괄호]로 변환하여 작성해 주세요.

필수 아님

필수 아님