지침 1. 인식의 용이성
웹사이트에서 서비스하고 있는 모든 콘텐츠는 누구나 쉽게 인식할 수 있도록 설계되어야 한다.

• 용어 정리
  • 텍스트 아닌 콘텐츠(non-text contents)란 그림,이미지 등으로 제작된 텍스트,애 니메이션, 아스키(ASCII) 그림문자, 목록표시 이미지, 그래픽 버튼, 음성음향자료 또는 비디오 자료 등의 오디오와 영상과 같이 표준 문자(부호) 체계가 아닌, 시 각적 또는 청각적 정보가 포함된 콘텐츠를 의미한다. 한글 부호의 경우에는 유니 코드, 조합형 또는 완성형 부호체계를 사용하여 작성된 텍스트 외의 모든 경 우를 의미한다.
  • 빈 문자(blank text)란 아무런 정보도 가지고 있지 않은 문자열을 의미한다. HTML 등의 문법에서 빈 문자는 “”을 가리킨다. 즉, 빈 문자를 스크린 리더에서 읽으면 아무런 소리도 나지 않는다.
• 요구 조건
  • 텍스트 아닌 콘텐츠 중에서 글로 표현될 수 있는 콘텐츠는 모두 해당 콘텐츠와 정확하게 일치하는 텍스트 콘텐츠(text contents)와 함께 제공해야 한다.
  • 만약, 텍스트 아닌 콘텐츠 중에서 글로 표현될 수 없는 경우는 해당 콘텐츠에 대한 설명을 텍스트로 반드시 제공해야 한다. 이 때, 제공되는 텍스트 콘텐츠는 설명하고자 하는 원래의 콘텐츠의 내용이나 형태 등의 상세한 정보를 제공해야 한다.
  • 텍스트 아닌 콘텐츠를 대체하거나 설명하기 위해 제공되는 텍스트는 콘텐츠 제 작자가 원래의 콘텐츠를 사용해 표현하고자 했던 의미나 기능도 포함하여 설명 해야 한다.
  • 텍스트 아닌 콘텐츠를 대체하거나 설명하기 위해 제공되는 텍스트를 읽어줌으로 인하여 의미의 혼동을 줄 경우에는 빈 문자(blank text)를 대체 텍스트로 사용해 야 한다.
• 적용시 장점
  • 시각장애 또는 인지장애 등으로 인해 시각으로 정보를 습득하는 데에 어려움을 겪는 사용자들이 스크린 리더(screen reader)와 같은 보조기술을 사용하여 텍스 트 콘텐츠를 음성을 통해 읽음으로써 접근권을 보장받을 수 있게 된다.
  • 청각장애나 다른 이유로 음향 정보를 알아들을 수 없는 사용자들을 위해 그 내 용을 텍스트로 표시하거나 수화로 해당 내용을 번역함으로써 접근이 가능하게 된다.
  • 시각장애인은 물론 시각장애와 청각장애를 함께 갖고 있는 사용자 역시 해당 콘 텐츠를 점자로 변환해 읽음으로써 접근권을 보장받을 수 있게 된다.
  • 몇 개의 자료를 순서대로 나열하는 목록 등 해당 이미지가 단순히 홈페이지를 아름답게 꾸미기 위해 사용된 경우에는 이미지에 대한 대체 텍스트(alt-text)로 빈 문자를 사용하면 의미의 불필요한 혼동을 줄일 수 있다.
• 적용 예
  • 버튼으로 사용된 이미지 : 간단한 기능 설명부가 슬라이드 쇼에서 다음 슬라이드로 넘어가는 역할을 하도록 만든 오른쪽 화살표 모 양의 이미지 링크(image link)의 경우에 이 버튼 이미지와 함께 "다음 슬라이드"라 는 대체 텍스트를 함께 제공한다면 스크린 리더는 이 이미지 버튼을 "링크 - 다음 슬라이드"라고 읽어줄 수 있게 된다.
  • 데이터 차트 : 간단한 레이블과 충분한 설명을 함께 제공 예를 들어 어떤 상품의 6월, 7월 및 8월의 판매실적을 비교해 보여주는 차트에 "그 림 1 : 6월, 7월 및 8월의 판매 현황"이라는 간단한 레이블(label)을 붙이고, 차트에 대한 보다 긴 설명문(longdesc)을 붙인다면 해당 차트의 내용과 해당 차트가 표시하고 있는 정보를 사용자에게 전달할 수 있다.
  • 애니메이션 : 간단한 레이블과 충분한 설명을 함께 제공 예를 들어 매듭을 짓는 방법을 보여주는 애니메이션의 경우에 "매듭을 만드는 형태 를 보여주는 애니메이션"이라는 간단한 레이블과 함께 매듭짓기 위하여 손놀림하는 동 작을 자세하게 설명하는 설명문을 붙인다면 매듭을 만드는 전 과정을 이용자가 자세하 게 알 수 있다.
  • 연설 녹음자료 : 간단한 레이블과 긴 설명을 함께 제공 웹 페이지에 음성 데이터가 포함되어 있는 경우에 이 데이터와 함께 간단한 제목을 레이블로 구성하고 음성 데이터의 내용에 대한 텍스트를 함께 제공한다면 청각장애인 의 경우에도 모든 정보를 얻을 수 있다.
  • 음악 자료 : 간단한 레이블 제공 예를 들어 베토벤의 교향곡 제 5번의 연주실황을 제공하는 음악 파일을 웹 페이지 에서 제공하고 있는 경우에 이 음악 파일과 함께"베토벤 교향곡 제5번, 빈 필하모닉 오케스트라의 연주"라는 레이블을 함께 제공한다면 청각장애인의 경우에 음악 파일이 무슨 내용을 담고 있는지를 쉽게 알 수 있다.

• 용어정리
  • 시간에 따라 변화하는 영상매체(time-dependent presentation)란 영화와 같이 소리 와 영상정보가 동시에 제공되는 경우 혹은 콘텐츠 재생 과정의 특정 시점에서 사용자와의 상호작용 또는 대화가 필요한 매체를 말한다.
  • 대체 매체(equivalent media)란 영상매체의 음향정보를 캡션과 같이 시각적으로 보여주거나 영상의 기본적인 내용을 화면해설 형태로 제공하는 매체를 의미한다.
  • 화면해설(audio descriptions)이란 영상의 광경, 동작, 비언어적 표현, 그래픽 등의 상태나 변화를 음향정보로 나타내거나 텍스트로 제공하여 필요한 설명을 제공하 는 것을 의미한다.화면해설은 해당 이벤트와 동기 되어 진행되어야 한다.
  • 캡션(Captions)이란 영상매체에 포함된 말, 음향 및 주변소리 등을 텍스트로 표현 한 매체를 의미한다. 따라서 캡션은 영상매체의 진행에 따라 해당 이벤트와 동기 되어야 한다.
• 요구조건
  • 음향 정보로부터 사용자가 충분한 정보를 얻을 수 없는 모든 영상매체는 캡션을 함께 제공해야 한다.
  • 캡션은 영상매체나 음향매체와 동기 되어야 한다.
  • 모든 생방송은 캡션을 실시간으로 제공해야 한다. 단 음성이 없는 음악 방송의 경우에는 예외로 한다.
  • 콘텐츠는 사용자가 캡션과 영상정보를 동시에 접해야 그 내용을 이해할 수 있도록 구성되어서는 안 된다. 즉, 캡션과 영상정보는 서로 보완관계가 되지 않아야한다.
• 적용시 장점
  • 청각장애인은 음향매체와 함께 제공되는 캡션을 통해 음성이나 음향 정보에 접 근이 가능하게 된다. 또한, 캡션을 활용하면 해당 콘텐츠에 대한 인덱스를 작성 하거나 내용을 검색할 때에도 유용하게 사용될 수 있다.
  • 장애인이 아닌 경우에도 영상매체와 함께 동기 되는 대체 매체가 제공되는 경우 에 보다 편리하게 콘텐츠를 활용할 수 있다. 예를 들어 캡션은 소란한 환경이나 오디오 재생기능이 갖추어져 있지 않은 경우 유용하며, 외국어 습득과 같이 언 어능력이나 읽기 능력을 높이는데 활용될 수 있다.
  • 화면해설의 경우에는 화면을 보지 않더라도 중요한 정보를 음성으로 알 수 있게 해주므로 시각을 통해 사물을 인식하기 어려운 장애인의 경우에는 화면해설을 통해 화상정보를 인지할 수 있다. 그러나 화면해설은 필수사항으로 분류하지 않 는다.
• 적용 예
  • 동영상 : 화면해설과 캡션 활용

    예를 들어, 한 아이가 강아지를 자신의 침대로 오도록 과자를 늘어놓고는 강아지에 게 웅얼거리며 무언가를 말하고 있는 장면을 가정한다면, 화면을 볼 수 없는 사람은 이 장면을 이해할 수 없다.따라서 이 경우에"이 아이가 계단으로부터 자기 침실에 이르는 계단마다 과자를 하나씩 늘어놓았다"라는 화면해설과"아이가 웅얼거린다"라는 캡션을 제공한다면 청각장애인이나 시각장애인 모두 그 내용을 정확히 이해할 수 있 다.

  • 뉴스 동영상 : 영상과 동기되는 캡션 제공

    예를 들어, 홍수가 난 대도시의 광경을 기자가 설명하고 있다고 가정할 경우에 기자가 하는 말을 캡션으로 표시하면 청각장애인이 기자의 이야기를 인식할 수 있게 된다.

  • 무언극 : 장면별로 장면소개 텍스트 제공

    예를 들어, 사다리를 올라가는 무언극(팬터마임 : pantomime)의 한 장면을 애니메 이션으로 구성하였을 경우에“사다리를 올라가는 장면”이라는 대체 텍스트를 애니메 이션에 포함시키면 이로써 충분한 정보를 사용자에게 제공할 수 있다.

• 용어정리
  • 고 대비(high contrast) 모드란 흑백과 같이 대비차가 매우 크도록 조정하여 화면 에 표시하는 방식을 의미한다.
• 요구사항
  • 콘텐츠가 제공하는 텍스트나 그래픽 정보는 색상을 제거하더라도 그 내용을 인 지할 수 있어야 한다.
  • 웹 페이지에서 보여주는 정보와 배경색 간에는 충분히 대비가 되어야 한다. 특 히 웹 페이지의 내용을 고 대비(high contrast) 모드로 표시했을 때에도 충분히 명암대비가 되도록 콘텐츠를 설계하여야 한다.
• 적용시 장점
  • 색상의 차이가 정보의 다름을 나타내지 않으므로 색각(색맹 또는 색약) 이상자의 경우에도 혼동을 일으킬 염려가 없게 된다.
  • 도표 등의 경우에 사용하는 색상의 명암 대비가 충분하므로 약시자의 경우에도 도표를 정확히 인지할 수 있다.
  • 고대비 모드를 사용할 수밖에 없는 사용자들도 콘텐츠의 내용이나 구조를 손쉽 게 이해할 수 있다.
• 적용 예
  • 그래프 및 차트 : 색깔보다는 무늬를 이용한 표현 권장 파이 차트, 막대그래프나 꺾은 선 그래프 등을 이용하여 정보를 표시하는 경우에 각각의 영역을 색깔로 구분하기보다는 여러 가지 무늬를 이용하여 표시하면 색상을 인 식할 수 없는 사용자들,예를 들면 약시자나 색각이상자가 쉽게 이해할 수 있다.
  • 중요한 항목 표시 : 색깔보다는 특수기호 사용 권장 예를 들어,가입자의 신상 정보를 입력하는 웹 페이지에서 필수항목을 색깔(예를 들어 빨간색)을 사용하여 표시하는 경우에 이 색깔을 인지하지 못하는 색각 이상자의 경우에는 이 항목의 중요도를 인지할 수 없다.따라서 색깔 대신 특수 기호(예를 들어 별표)를 이 항목에 추가하면 대부분의 사용자가 이 항목이 중요한 항목인지를 쉽게 인 지할 수 있다.