본문 바로가기

성공기준 이해 1.4.5:텍스트 이미지 (Level AA)

요약

목표
사용자는 텍스트가 표시되는 방식을 조정할 수 있다.
할 일
텍스트 이미지 대신 텍스트를 사용한다.
중요성
사람들은 이미지 내의 텍스트가 어떻게 보이는지 변경할 수 없다.

의도

이 성공 기준의 목적은 원하는 기본 시각적 표현을 달성할 수 있는 기술을 사용하는 저작자가 텍스트의 특정 시각적 표현을 필요로 하는 사람들이 필요에 따라 텍스트 표현을 조정할 수 있도록 장려하는 것이다. 여기에는 사람들이 필요로하는 특정 글꼴 크기, 전경색 및 배경색, 글꼴, 줄 간격 또는 텍스트 정렬이 포함된다.

만약 저작자가 텍스트를 사용해 동일한 시각적 효과를 낼 수 있다면, 이미지 대신 텍스트로 정보를 제공해야 한다. 어떤 이유로든 저작자가 텍스트로 동일한 효과를 내기 어렵거나, 일반적으로 사용 가능한 사용자 에이전트에서 그 효과가 제대로 표현되지 않거나, 이 기준을 충족시키기 위한 기술을 사용하면 1.4.4와 같은 다른 기준을 충족시키지 못하게 되는 경우에는 텍스트 이미지를 사용할 수 있다. 여기에는 전달하려는 정보에 있어 특정 텍스트 표현이 필수적인 경우가 포함된다(예: 서체 샘플, 로고타입, 브랜딩 등). 또한 널리 배포되지 않았거나 배포할 권리가 없는 특정 폰트를 사용하려는 경우, 또는 모든 사용자 에이전트에서 텍스트가 앤티앨리어싱되도록 하기 위해 텍스트 이미지를 사용할 수 있다.

텍스트 이미지는 사용자가 요구 사항에 맞게 텍스트 이미지를 사용자 정의할 수 있는 경우에도 사용할 수 있다.

텍스트 이미지의 정의에는 다음과 같은 참고 사항이 포함된다. 참고: 여기에는 중요한 기타 시각적 콘텐츠가 포함된 그림의 일부인 텍스트는 포함되지 않는다. 이러한 그림의 예로는 단순한 텍스트 이상의 내용을 통해 중요한 정보를 시각적으로 전달하는 그래프, 스크린샷, 다이어그램 등이 있다.

이 성공 기준을 만족시키는 기술은 저작자가 사용하는 기술로 시각적 표현을 달성할 수 있는 경우에만 적용하면 된다는 점을 제외하면 성공 기준 1.4.9의 기술과 동일하다. 성공 기준 1.4.9의 경우 사용자가 출력을 사용자 정의할 수 있는 경우에만 충분한 기술이 적용된다.

참조하라 1.4.9: 텍스트 이미지 (예외 없음).

이점

  • 저시력자(작성된 글꼴, 크기 및/또는 색상으로 텍스트를 읽는 데 어려움을 겪을 수 있는 사람)
  • 시각적 추적 문제(visual tracking problems)가 있는 사람(작성된 줄 간격 및/또는 정렬로 텍스트를 읽는 데 어려움을 겪을 수 있는 사람)
  • 읽기에 영향을 미치는 인지 장애가 있는 사람

예제

스타일이 지정된 제목
저작자는 특정 글꼴과 크기로 제목을 표시하기 위해 비트맵 이미지를 사용하는 대신 CSS를 사용하여 동일한 결과를 낸다.
동적으로 생성된 이미지
웹 페이지는 서버사이드 스크립트를 사용하여 텍스트를 이미지로 표시한다. 이 페이지에는 사용자가 생성된 이미지의 글꼴 크기와 전경색 및 배경색을 조정할 수 있는 컨트롤이 포함되어 있다.
인용
웹 페이지에 인용문이 포함되어 있다. 인용문 자체는 왼쪽 여백에서 들여쓰기된 기울임꼴 텍스트로 표시된다. 인용문에 귀속된 사람의 이름은 인용문 아래 줄 간격의 1.5배로 왼쪽 여백에서 들여쓰기 된다. CSS는 텍스트 위치를 지정하는 데 사용된다. 줄 사이의 간격을 설정한다. 텍스트의 글꼴 모음, 크기, 색상 및 장식을 표시한다.
탐색 항목(Navigation items)
웹 페이지에는 대상을 설명하는 아이콘과 텍스트가 모두 있는 탐색 링크 메뉴가 포함되어 있다. CSS는 텍스트의 글꼴 모음, 크기, 전경색과 배경색을 표시하는 데 사용된다. 탐색 링크 사이의 간격도 마찬가지이다. 을 사용하면 사용자가 텍스트 블록을 입력할 수 있다. 이 양식은 텍스트 스타일 지정 및 맞춤법 검사 기능을 포함하여 다양한 버튼을 제공한다. 일부 버튼은 인간의 언어로 무언가를 표현하는 순서를 형성하지 않는 텍스트 문자를 사용한다. 예를 들어 "B"는 글꼴 두께를 늘리고 "I"는 텍스트를 기울임꼴로 표시하며 "ABC"는 맞춤법을 검사한다. 기호 텍스트 문자는 텍스트 특성을 변경할 수 없는 gif 이미지로 포함된다. 버튼에는 텍스트 대체 항목이 있다.
텍스트 이미지의 사용자 정의 가능한 글꼴 설정
웹 사이트에서는 사용자가 글꼴 설정을 지정할 수 있으며 사이트의 모든 텍스트 이미지는 해당 설정에 따라 제공된다.

관련 자료

자료는 정보 제공 목적으로만 제공되며 보증을 암시하지 않는다.

기법

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

충분 기법

조언 기법

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

CSS Techniques

점검 규칙

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

맨 위로