성공기준 이해 1.1.1:텍스트가 아닌 콘텐츠 (Level A)

성공 기준 (SC)

사용자에게 제시되는 모든 텍스트가 아닌 콘텐츠는 그 목적에 상응하는 대체 텍스트를 제공해야 한다. 예외는 다음과 같다.

컨트롤, 입력(Controls, Input): 텍스트가 아닌 콘텐츠가 컨트롤이거나 사용자 입력을 받는 경우, 해당 목적을 설명하는 이름이 있어야 한다. (컨트롤과 사용자 입력을 받는 콘텐츠에 대한 추가 요구 사항은 성공 기준 4.1.2 참고)
시간 기반 미디어(Time-Based Media): 텍스트 아닌 콘텐츠가 시간 기반 미디어인 경우, 텍스트 아닌 콘텐츠에는 최소한 동등한 설명의 대체 텍스트를 제공해야 한다. (미디어에 대한 추가 요구사항은 지침 1.2를 참고)
시험(Test): 텍스트 아닌 콘텐츠가 텍스트로 제시될 때 무효가 되는 시험이나 연습인 경우, 텍스트 아닌 콘텐츠에는 최소한 동등한 설명의 대체 텍스트를 제공해야 한다.
감각(Sensory): 텍스트 아닌 콘텐츠가 주로 특정 감각에 기반한 경험을 하도록 의도한 경우, 텍스트 아닌 콘텐츠에는 최소한 동등한 설명의 대체 텍스트를 제공해야 한다.
캡챠(CAPTCHA): 텍스트 아닌 콘텐츠의 목적이 컴퓨터가 아닌 사람이 콘텐츠에 접근하고 있는지를 확인하는 것이라면, 텍스트 아닌 콘텐츠의 목적을 식별하고 기술하는 대체 텍스트를 제공해야 하며, 다른 장애들에 대한 편의를 제공하기 위하여 다른 유형의 감각 인식 출력 모드(modes)를 사용하는, 캡챠(CAPTCHA)에 대한 대체 형식을 제공해야 한다.
장식(Decoration), 형식(Formatting), 보이지 않음(Invisible): 텍스트 아닌 콘텐츠가 순수한 장식이거나, 시각적 형식을 위해서만 사용되거나, 또는 사용자에게 보이지 않는 경우, 보조 기술이 인지하지 않고 지나칠 수 있는 방식으로 구현해야 한다.

요약

목표: 텍스트가 아닌 정보를 더 많은 사람들이 이용할 수 있다.
할 일: 시각 및 청각 콘텐츠에 대한 대체 텍스트를 제공한다.
중요성: 완전히 보거나 들을 수 없는 사람들도 콘텐츠를 이해할 수 있다.

의도

이 성공 기준의 의도는 텍스트가 아닌 콘텐츠로 전달하는 정보를 대체 텍스트를 사용하여 접근 가능하게 만드는 것이다. 대체 텍스트는 정보를 접근 가능하게 만드는 주요 방법으로, 사용자의 요구사항에 맞추어 어떤 감각 특성(예: 시각, 청각 또는 촉각)로도 렌더링될 수 있다. 대체 텍스트를 제공하면 다양한 사용자 에이전트를 통해 다양한 방식으로 정보가 렌더링될 수 있다. 예를 들어, 그림을 볼 수 없는 사람은 대체 텍스트를 합성된 음성으로 들을 수 있고, 오디오 파일을 들을 수 없는 사람은 대체 텍스트를 표시하여 읽을 수 있다. 앞으로 대체 텍스트는 정보를 수어나 동일 언어의 더 단순한 형태로 더 쉽게 번역될 것이다.

CAPTCHA(캡챠) 참고

CAPTCHA는 접근성 커뮤니티에서 논란의 여지가 있는 주제이다. CAPTCHA의 비접근성 논문에 설명된 대로 CAPTCHA는 자동화된 프로세스를 무력화하기 위해 본질적으로 인간 능력의 한계를 뛰어넘는다. 특정 장애가 있는 사용자는 모든 유형의 CAPTCHA를 해결할 수 없다. 그러나 CAPTCHA는 널리 사용되고 있으며 웹 콘텐츠 접근성 지침 실무 그룹은 CAPTCHA가 완전히 금지된다면 웹 사이트는 CAPTCHA를 포기하는 대신 WCAG를 따르지 않을 것이라고 믿는다. 이는 훨씬 더 많은 장애가 있는 사용자에게 장벽을 만들 것이다. 이러한 이유로 실무 그룹은 대부분의 장애인 요구 사항을 충족하면서도 사이트에서 채택할 수 있는 방식으로 CAPTCHA에 대한 요구 사항을 구성하기로 결정했다. 특정 사이트에서 두 가지 다른 형태의 CAPTCHA를 요구하면 대부분의 장애인이 사용할 수 있는 양식을 찾을 수 있다.

일부 장애가 있는 사용자는 여전히 최소 요구 사항을 충족하는 사이트에 액세스할 수 없기 때문에 실무 그룹에서는 추가 단계에 대한 권장 사항을 제공한다. WCAG를 준수하고자 하는 조직은 이 주제의 중요성을 인식하고 가능한 한 지침의 최소 요구사항 이상으로 노력해야 한다. 추가로 권장되는 조치에는 다음이 포함된다.

두 가지 방식 이상의 CAPTCHA 제공
CAPTCHA를 우회할 수 있는 인간 고객 서비스 담당자에 대한 접근 방식 제공
승인된 사용자에게는 CAPTCHA가 요구 안함

추가 정보

텍스트가 아닌 콘텐츠는 다양한 형태로 나타날 수 있으며 이 성공 기준은 각 콘텐츠의 처리 방법을 명시한다.

차트, 다이어그램, 오디오 녹음, 그림 및 애니메이션과 같이 아래 나열된 다른 상황 중 하나로 다루어지지 않는 텍스트가 아닌 콘텐츠의 경우 대체 텍스트를 통해 렌더링할 수 있는 모든 형식(예: 시각, 청각 또는 촉각)으로 동일한 정보를 이용할 수 있다. 텍스트가 아닌 콘텐츠의 정보를 전달하기 위해 필요에 따라 짧고 긴 대체 텍스트를 사용할 수 있다. 여기서는 사전 녹음된 오디오 전용 파일과 사전 녹화된 비디오 전용 파일을 다룬다. 실시간 오디오 전용 및 실시간 비디오 전용 파일은 아래(이 문단 다음 세 번째 문단)에서 다룬다.

제출 버튼, 이미지 맵 또는 복잡한 애니메이션으로 사용되는 이미지와 같이 컨트롤이거나 사용자 입력을 허용하는 텍스트가 아닌 콘텐츠의 경우, 사람이 최소한 무엇을 알 수 있도록 텍스트가 아닌 콘텐츠의 목적을 설명하는 이름을 제공한다. 이를 통해 사용자는 최소한 해당 텍스트가 아닌 콘텐츠가 무엇이고 왜 있는지 알 수 있다.

텍스트가 아닌 콘텐츠 중 시간 기반 미디어는 1.2: 시간 기반 미디어를 통해 접근 가능하게 만든다. 하지만 사용자가 페이지에서 해당 콘텐츠를 발견했을 때 무엇인지 알고 어떤 조치를 취할지 결정할 수 있도록 하는 것은 중요하다. 따라서 해당 시간 기반 미디어를 설명하거나 제목을 알려주는 대체 텍스트를 제공한다.

실시간 오디오 전용 및 실시간 비디오 전용 콘텐츠의 경우, 동일한 정보를 제공하는 대체 텍스트를 만드는 것이 훨씬 더 어려울 수 있다. 이러한 유형의 텍스트가 아닌 콘텐츠에 대해서는 설명적인 레이블을 제공하는 대체 텍스트를 사용한다.

때로는 테스트나 연습 문제를 부분적 또는 전체적으로 텍스트가 아닌 형식으로 제시해야 한다. 변환할 수 없는 오디오 또는 시각 정보가 제공되는데, 이는 해당 감각을 사용하여 테스트나 연습을 진행해야 하기 때문이다. 예를 들어, 청력 검사의 경우 대체 텍스트를 제공하면 검사가 무효화된다. 시각적 기술 개발 연습 역시 텍스트 형식으로는 무의미할 것이다. 맞춤법 시험에 대체 텍스트를 제공해도 그리 효과적이지 않을 것이다. 이러한 경우 텍스트가 아닌 콘텐츠의 목적을 설명하는 대체 텍스트를 제공해야 한다. 물론 해당 대체 텍스트에는 검사를 통과하는 데 필요한 동일 정보가 포함되지 않는다.

때로는 특정 감각적 경험을 제공하기 위한 목적의 콘텐츠가 있는데, 이를 단어로 온전히 표현하기 어려울 수 있다. 예를 들어 교향곡 공연, 시각 예술 작품 등이 있다. 이러한 콘텐츠에 대해서는 최소한 텍스트가 아닌 콘텐츠를 설명적인 레이블로 명시하고 가능한 경우 추가 설명 텍스트를 제공한다. 페이지에 해당 콘텐츠를 포함한 이유가 알려져 있다면 그 정보를 포함하는 것이 도움이 된다.

때로는 사용자가 실제 사람임을 확인하기 위한 텍스트가 아닌 연습 문제가 있다. 스팸 로봇이나 다른 소프트웨어가 사이트에 접근하지 못하도록 CAPTCHA라는 장치가 사용된다. 이는 일반적으로 웹 로봇의 현재 능력을 벗어나는 시각적 또는 청각적 작업으로 구성된다. 그러나 이에 대한 대체 텍스트를 제공하면 로봇도 작동할 수 있게 되어 본래 목적에 어긋난다. 이 경우 CAPTCHA의 목적을 설명하는 대체 텍스트를 제공하고, 다양한 장애를 가진 사람들의 요구사항을 충족시키기 위해 다른 감각 경로를 사용한 대체 형식을 제공한다.

때로는 텍스트가 아닌 콘텐츠를 사용자가 보거나 이해할 필요가 없는 경우가 있다. 페이지에서 텍스트를 이동시키기 위해 사용되는 투명 이미지, 사용 통계를 추적하기 위한 보이지 않는 이미지, 그리고 정보를 전달하지 않고 빈 공간을 채워 미적 효과를 내기 위한 소용돌이 모양 등이 이에 해당한다. 이러한 항목에 대체 텍스트를 제공하면 페이지 콘텐츠에서 화면 낭독기 사용자의 주의가 산만해질 수 있다. 하지만 어떤 표시도 하지 않으면 사용자가 (실제로는 아무것도 놓치지 않았지만) 텍스트가 아닌 콘텐츠가 무엇이고 어떤 정보를 놓쳤는지 추측하게 된다. 따라서 이러한 유형의 텍스트가 아닌 콘텐츠는 사용자에게 아무것도 제시하지 않도록 특정한 방식으로 표시하거나 구현해 보조 기술이 무시하도록 한다.

이점

이 성공 기준은 시각적 콘텐츠를 인식하는 데 어려움을 겪는 사람들에게 도움이 된다. 보조 기술은 텍스트를 소리내어 읽거나, 시각적으로 표시하거나, 점자로 변환할 수 있다.
대체 텍스트는 사진, 그림, 기타 이미지(예: 선 그림, 그래픽 디자인, 그림, 3차원 표현), 그래프, 차트, 애니메이션 등의 의미를 이해하는 데 어려움을 겪는 일부 사람들에게 도움이 될 수 있다.
청각 장애가 있거나 난청이 있는 사람 또는 어떤 이유로든 오디오 정보를 이해하는 데 어려움이 있는 사람이 텍스트 표시를 읽을 수 있다. 텍스트를 수어로 자동 번역하는 방법에 대한 연구가 진행 중이다.
시청각 장애가 있는 사람은 점자로 텍스트를 읽을 수 있다.
또한 대체 텍스트는 텍스트가 아닌 콘텐츠를 검색할 수 있게 하고 다양한 방식으로 콘텐츠를 재활용할 수 있게 지원한다.

예제

데이터 차트: 막대 그래프는 6월, 7월, 8월에 판매된 위젯 수를 비교한다. 짧은 라벨에는 "그림 1 - 6월, 7월, 8월 매출"이라고 적혀 있다. 긴 설명은 차트 유형을 식별하고, 차트에서 사용할 수 있는 것과 비교할 수 있는 데이터, 추세 및 의미에 대한 높은 수준의 요약을 제공한다. 가능하고 실용적인 경우 실제 데이터가 표로 제공된다.
연설 녹음본: 오디오 클립에 대한 링크는 "의회의 의장 연설"이라고 나와 있다. 오디오 클립 링크 바로 뒤에 텍스트 대본에 대한 링크를 제공한다.
자동차 엔진의 작동 방식을 보여주는 애니메이션: 애니메이션은 자동차 엔진이 어떻게 작동하는지 보여준다. 오디오가 없으며 애니메이션은 엔진 작동 방식을 설명하는 튜토리얼의 일부이다. 튜토리얼의 텍스트는 이미 완전한 설명을 제공하므로 이미지는 텍스트를 대체하고 대체 텍스트는 애니메이션에 대한 간략한 설명만 포함하며 자세한 내용은 튜토리얼 텍스트를 참조하게 한다.
교통 웹 카메라: 웹 사이트를 통해 사용자는 주요 도시 전역에 설치된 다양한 웹 카메라 중에서 선택할 수 있다. 카메라를 선택한 후 이미지는 2분마다 갱신된다. 짧은 대체 텍스트는 웹 카메라를 "교통 웹 카메라"로 식별한다. 이 사이트는 또한 웹 카메라가 적용되는 각 경로의 이동 시간 표를 제공한다. 표는 2분마다 갱신된다.
뉴스 기사에 나온 역사적 사건의 사진: 두 세계 지도자가 악수하는 사진은 국제 정상회담에 대한 뉴스 기사와 함께 제공된다. 대체 텍스트에는 "X 국가의 X 대통령이 Y 국가의 Y 총리와 악수를 하고 있다."라고 나와 있다.
외교 관계를 논의하는 콘텐츠의 역사적 사건 사진: 동일한 이미지가 외교적 만남의 미묘한 차이를 설명하기 위해 다른 맥락에서 사용되었다. 복잡한 외교 관계를 논의하는 한 웹사이트에는 대통령이 총리와 악수하는 모습이 등장한다. 첫 번째 대체 텍스트에는 "2009년 1월 2일 X 국가의 X 대통령이 Y 국가의 Y 총리와 악수를 하고 있다."라고 적혀 있다. 추가 대체 텍스트는 리더가 서 있는 방과 리더의 얼굴 표정을 설명하고 방에 있는 다른 사람들을 식별한다. 추가 설명은 사진과 동일한 페이지에 포함될 수도 있고 링크나 기타 표준 프로그래밍 매커니즘을 통해 이미지와 연결된 별도의 파일에 포함될 수도 있다.
기자 회견 음성 녹음: 웹 페이지에 기자 회견의 오디오 녹음에 대한 링크가 포함되어 있다. 링크 텍스트는 오디오 녹음을 식별한다. 이 페이지는 또한 기자회견의 텍스트 사본으로 연결된다. 녹취록에는 화자가 말하는 모든 내용이 축어적으로 기록되어 있다. 이는 누가 말하고 있는지 식별할 뿐만 아니라 박수, 웃음, 청중의 질문 등과 같이 녹음의 일부인 기타 중요한 소리에 주목한다.
e-러닝 애플리케이션: e-러닝 애플리케이션은 음향 효과를 사용하여 답변이 올바른지 여부를 나타낸다. 차임 소리는 답이 맞았음을 나타내고, 삐 소리는 답이 틀렸음을 나타낸다. 소리를 듣지 못하거나 이해하지 못하는 사람들도 정답인지 오답인지 이해할 수 있도록 텍스트 설명도 포함되어 있다.
링크된 썸네일 이미지: "Smallville Times" 신문의 첫 페이지 썸네일 이미지가 "Smallville Times" 홈페이지로 링크되어 있다. 이 이미지의 대체 텍스트는 "Smallville Times"이다.
다른 사이트에서 사용된 동일한 이미지: 지구 이미지에 대한 다양한 대안: 여행 사이트에서 국제 여행 섹션에 대한 링크로 사용되는 지구 이미지에는 "국제 여행"이라는 대체 텍스트가 있다. 동일한 이미지가 "국제 캠퍼스"라는 대체 텍스트가 포함된 대학 웹사이트의 링크로 사용된다.
이미지 맵: 건물 평면도의 이미지는 대화형이므로 사용자는 특정 방을 선택하고 해당 방에 대한 정보가 포함된 페이지로 이동할 수 있다. 짧은 대체 텍스트는 이미지와 대화형 목적을 설명한다. "건물 평면도. 자세한 내용을 보려면 방을 선택하세요."

기법

이 섹션에서 번호가 매겨진 각 항목은 WCAG 실무 그룹이 이 성공 기준을 충족하기에 충분하다고 간주하는 기법 또는 기법의 조합을 나타낸다. 그러나 이러한 특정 기법을 사용할 필요는 없다. 다른 기법 사용에 대한 자세한 내용은 WCAG 성공 기준에 대한 기법 이해, 특히 "기타 기법" 섹션을 참고하라.

충분 기법

아래에서 귀하의 콘텐츠와 일치하는 상황을 선택하라. 각 상황에는 해당 상황에 충분하다고 알려져 있고 문서화된 기법 또는 기법의 조합이 포함된다.

상황 A: 짧은 설명이 텍스트가 아닌 콘텐츠와 동일한 목적을 달성하고 동일한 정보를 제공할 수 있는 경우

G94: 텍스트가 아닌 콘텐츠와 동일한 목적을 제공하고 동일한 정보를 제공하는 텍스트가 아닌 콘텐츠에 대한 짧은 대체 텍스트를 제공하기 위해 다음의 상황 A에 대한 짧은 대체 텍스트 기법 중 하나를 사용

상황 A에 대한 짧은 대체 텍스트 기법:

상황 B: 짧은 설명이 동일한 목적을 달성할 수 없고 텍스트가 아닌 콘텐츠(예: 차트 또는 다이어그램)와 동일한 정보를 제공할 수 없는 경우

G95: 텍스트가 아닌 콘텐츠에 대한 간략한 설명을 제공하는 짧은 대체 텍스트 제공을 위해 다음의 상황 B에 대한 짧은 텍스트 대체 기술 중 하나와 상황 B에 대한 긴 텍스트 대체 기술 중 하나를 사용

상황 B에 대한 짧은 대체 텍스트 기법:

상황 B에 대한 긴 대체 텍스트 기법:

상황 C: 텍스트가 아닌 콘텐츠가 컨트롤이거나 사용자 입력을 허용하는 경우

G82: Providing a text alternative that identifies the purpose of the non-text content using one of the following Text alternative techniques for controls and input for Situation C:

Text alternative techniques for controls and input for Situation C:

상황 D: 텍스트가 아닌 콘텐츠가 시간 기반 미디어인 경우(실시간 비디오 전용 및 실시간 오디오 전용 포함), 텍스트로 제시하면 유효하지 않은 테스트 또는 연습인 경우, 또는 주로 특정 감각 경험을 창출하기 위한 의도인 경우

Providing a descriptive label using one of the following Short text alternative techniques for Situation D:
G68: Providing a short text alternative that describes the purpose of live audio-only and live video-only content using one of the following Short text alternative techniques for Situation D:
G100: Providing a short text alternative which is the accepted name or a descriptive name of the non-text content using one of the following Short text alternative techniques for Situation D:

Short text alternative techniques for Situation D:

상황 E: 텍스트가 아닌 콘텐츠가 CAPTCHA인 경우

G143: Providing a text alternative that describes the purpose of the CAPTCHAANDG144: Ensuring that the Web Page contains another CAPTCHA serving the same purpose using a different modality

상황 F: 보조 기술이 텍스트가 아닌 콘텐츠를 무시해야 하는 경우

Implementing or marking the non-text content so that it will be ignored by assistive technology using one of the following Techniques to indicate that text alternatives are not required for Situation F:

Techniques to indicate that text alternatives are not required for Situation F:

조언 기법

준수를 위해 필수는 아니지만 콘텐츠에 더 쉽게 접근할 수 있도록 다음과 같은 추가 기법을 고려해야 한다. 모든 기법을 사용할 수 없거나 모든 상황에서 효과적인 것은 아니다.

CSS 기법 (권고)

C18: Using CSS margin and padding rules instead of spacer images for layout design

오류

다음은 WCAG 실무 그룹에서 이 성공 기준의 실패로 간주하는 일반적인 실수이다.

점검 규칙

다음은 이 성공 기준의 특정 측면에 대한 점검 규칙이다. WCAG 준수 여부를 확인하기 위해 이러한 특정 점검 규칙을 사용할 필요는 없지만 이것은 정의되고 승인된 검사 방법이다. 점검 규칙 사용에 대한 자세한 내용은 WCAG 성공 기준에 대한 점검 규칙 이해를 참고하라.

맨 위로