[접근성연구·색각] 색만으로 말하지 않기

색 비의존 설계 연구

〈디지털 접근성 연구 044〉 — 이 글은 규정이 아니라 하나의 연구 관점입니다. 인용 수치·기준은 출처와 함께, 미확정 영역은 그렇다고 밝혀 작성합니다.

들어가며

화면은 색으로 많은 것을 말한다. 필수 입력칸은 빨간 별표로, 정상 상태는 초록 점으로, 경고는 노란 띠로, 오류는 붉은 글씨로. 색은 글자보다 빠르게 눈에 들어오고 공간을 적게 차지하니, 정보를 색에 담는 일은 자연스러운 선택처럼 보인다. "빨간 건 잘못된 거예요"라는 안내는 보는 사람에게 거의 즉각적이다.

그런데 그 즉각성이 모든 사람에게 같지 않다. 색을 구별하는 방식이 다수와 다른 사람들이 있다. 빨강과 초록이 비슷하게 보이는 사람, 특정 색의 차이를 잘 느끼지 못하는 사람이 적지 않다. 흔히 색각 이상(또는 색약·색맹)으로 불리는 이 특성은 드물지 않은 것으로 알려져 있다. 이들에게 "빨간 점은 오류, 초록 점은 정상"이라는 안내는 두 점이 비슷하게 보여 구분되지 않을 수 있다. 색에만 정보를 담으면, 그 정보는 색을 다르게 보는 사람에게서 사라진다.

이 글은 그 '색에만 담긴 정보'를 하나의 연구 주제로 놓는다. 색각이 다른 사람에게 색이 어떻게 보이는지, 정보를 색에만 의존하지 않는다는 것이 무슨 뜻인지, 그리고 공개된 기준들은 이를 어떻게 다루는지를 따라가 본다. 색을 쓰지 말라는 이야기가 아니라, 색이 유일한 단서가 되지 않게 한다는 관점을 정리하는 데 무게를 둔다.

1. 색은 어떻게 다르게 보이는가

1-1. 색각 이상이라는 특성

색각 이상은 눈이 색을 감지하는 방식이 다수와 다른 특성을 말한다. 가장 흔히 알려진 것은 빨강과 초록 계열을 구별하기 어려운 경우(적록 계열)이며, 그 밖에도 여러 유형이 있는 것으로 알려져 있다. 정도도 사람마다 달라, 색을 전혀 구별하지 못하는 경우는 드물고, 특정 색의 차이를 약하게 느끼는 경우가 더 많은 것으로 전해진다. 정확한 분류와 비율은 의학·통계 자료에 따라 차이가 있을 수 있으므로, 구체적인 수치는 공신력 있는 자료의 원문을 확인하는 편이 안전하다.

여기서 중요한 것은 비율의 정확성보다, 이것이 '드문 예외'가 아니라는 점이다. 색각이 다른 사람은 우리 주변에 늘 있으며, 화면을 쓰는 사용자 중에도 분명히 포함되어 있다. 색에만 담긴 정보는 그들에게 닿지 않는다.

1-2. 빨강과 초록이 같아 보일 때

색에만 의존한 안내의 가장 흔한 사례는 빨강/초록의 대비다. "정상은 초록, 오류는 빨강"이라는 표시는 디자인에서 워낙 익숙하지만, 적록 계열 색각을 가진 사용자에게는 두 색이 비슷한 회갈색으로 보일 수 있다. 그에게 초록 점과 빨강 점은 같은 점이다. 점의 색만으로 정상과 오류를 가르라는 화면은, 그에게 아무 정보도 주지 못한다.

신호등이 위치(위/아래)로도 신호를 구분하게 만들어진 것은 이런 맥락에서 자주 인용되는 사례다. 빨간불과 초록불을 색만으로 구분하면 색각이 다른 사람이 위험해질 수 있으므로, 등의 위치라는 또 하나의 단서를 함께 둔다. 화면에서도 같은 원리가 적용된다 — 색 외에 또 하나의 단서가 있는가.

2. 기준은 색을 어떻게 다루는가

2-1. '색만으로 전달하지 말라'는 취지

웹 접근성 기준에서 색 의존은 비교적 분명하게 언급되는 주제다. WCAG에는 색이 정보 전달, 행동 유도, 응답 요청, 시각 요소 구분의 '유일한' 수단이 되어서는 안 된다는 취지의 항목(1.4.1 Use of Color로 알려진 항목)이 있는 것으로 정리된다. 핵심 단어는 '유일한'이다. 색을 쓰는 것 자체는 문제가 아니며, 색이 정보를 전하는 단 하나의 단서가 되는 것이 문제라는 관점이다.

다시 말해, 색은 정보를 더 빠르고 보기 좋게 전하는 보조 수단으로는 얼마든지 쓸 수 있다. 다만 색을 빼고도 그 정보가 전해지도록, 색 외의 단서(글자, 기호, 모양, 위치 등)를 함께 두라는 것이다. 색은 더하는 단서이지, 유일한 단서가 아니어야 한다.

2-2. 대비와는 다른 주제

색 의존(1.4.1)은 이 시리즈의 명도 대비 편(029~031)에서 다룬 대비(1.4.3 등)와는 결이 다르다. 대비는 '글자와 배경이 충분히 또렷하게 구분되는가'의 문제이고, 색 의존은 '색의 차이가 정보를 전하는 유일한 수단인가'의 문제다. 둘 다 색과 관련되지만 묻는 질문이 다르다. 대비가 충분해도 색에만 의존한 안내일 수 있고, 색에 의존하지 않아도 대비가 부족할 수 있다. 두 주제를 나누어 보면 점검이 또렷해진다.

2-3. 기준은 출발선이다

WCAG·KWCAG에 색 의존 관련 항목이 있다는 사실은, '색만으로 말하지 않기'가 한두 사람의 취향이 아니라 여러 공개 기준이 공통으로 짚는 지점임을 보여 준다. 항목의 정확한 번호·등급·문구는 기준 판본에 따라 달라질 수 있으므로, 적용 시에는 원문을 직접 확인하는 편이 안전하다. 기준은 무엇을 살펴야 하는지를 알려 주는 출발선이지, 그 자체로 화면을 색 비의존으로 만들어 주지는 않는다.

색 의존과 대비는 둘 다 색을 다루지만 묻는 질문이 다르다. 두 주제를 나란히 두면 점검할 때 무엇을 보는지가 갈린다.

주제	기준 취지(알려진 항목)	묻는 질문
색 의존	색의 사용(1.4.1로 알려진 항목)	색이 정보의 '유일한' 단서인가
명도 대비	텍스트 대비(1.4.3 등으로 알려진 항목)	글자와 배경이 충분히 또렷한가

(인용) 위 항목 번호·취지는 WCAG에서 알려진 것을 옮긴 것이며, 번호·등급·문구는 판본에 따라 다를 수 있어 원문 확인이 안전하다. 이 표는 공식 해석이 아니라 두 주제의 차이를 보이기 위한 정리다.

3. 색에만 기대는 자리들

3-1. 상태 표시

색에 가장 자주 의존하는 것은 상태 표시다. 정상/오류, 가능/불가, 진행/완료를 점이나 띠의 색으로만 구분하는 화면이 흔하다. 여기에 글자(예: '정상'/'오류')나 기호(✓/✗), 모양의 차이를 함께 두면, 색을 다르게 보는 사용자도 상태를 읽을 수 있다. 색은 한눈에 들어오는 보조 단서로 남고, 정보 자체는 색 외의 단서가 전한다.

3-2. 필수 입력 표시

폼에서 필수 입력칸을 빨간색으로만 표시하는 경우도 흔하다. 색만으로 표시하면, 색을 다르게 보는 사용자는 어느 칸이 필수인지 알기 어렵다. '필수'라는 글자나 별표 기호를 색과 함께 두면, 색에 기대지 않고도 필수 여부가 전해진다. 이 시리즈의 폼 관련 편들과도 이어지는 지점이다.

3-3. 그래프와 차트

여러 항목을 색으로만 구분하는 그래프·차트도 색 의존의 흔한 사례다. 선 그래프의 여러 선을 색으로만 구분하면, 색을 다르게 보는 사용자는 어느 선이 어느 항목인지 가늠하기 어렵다. 선의 모양(실선/점선), 직접 붙인 이름표, 표식의 형태를 색과 함께 두면 구분이 가능해진다. 색만으로 여러 항목을 가르는 차트는 점검에서 자주 마주치는 지점이다.

3-4. 링크와 강조

본문 속 링크를 색만으로 구분하는 경우도 있다. 주변 글자와 색만 다르고 밑줄 같은 다른 단서가 없으면, 색을 다르게 보는 사용자는 그것이 링크인지 알기 어렵다. 밑줄이나 다른 시각 단서를 색과 함께 두면 링크임이 분명해진다. 색은 링크를 더 눈에 띄게 하는 보조 단서로 두는 관점이 가능하다.

색에 기대는 네 자리를, 색을 빼도 남는 단서와 나란히 두면, 어디에 무엇을 더해야 하는지가 보인다.

색에 기대는 자리	색만 쓰면	함께 둘 수 있는 단서
상태 표시	정상/오류 점이 같아 보임	글자(정상/오류)·기호(✓/✗)
필수 입력	어느 칸이 필수인지 모름	'필수' 글자·별표 기호
그래프·차트	어느 선이 어느 항목인지 모름	선 모양(실선/점선)·이름표
링크·강조	링크인지 분간 안 됨	밑줄·다른 시각 단서

(관찰) 위 네 자리는 색 의존이 되풀이 관찰되는 패턴을 정리한 것이며, 특정 사이트를 가리키지 않는다. 함께 둘 단서는 예시이며, 화면의 맥락에 따라 더 알맞은 단서가 있을 수 있다.

4. 만드는 사람의 시선에서

4-1. 색을 빼고 본다

색 의존을 점검하는 가장 단순한 방법은 화면에서 색을 잠시 빼 보는 것이다. 화면을 회색조(흑백)로 바꿔 보면, 색으로만 구분되던 정보가 한순간에 사라지는 자리가 드러난다. 정상 점과 오류 점이 같은 회색이 되고, 여러 색의 선이 구분되지 않는 회색 선이 된다. 그 자리가 바로 색을 다르게 보는 사용자가 정보를 잃는 자리다.

이 점검은 색각 시뮬레이션 도구나 회색조 보기 기능으로 누구나 할 수 있다. 색을 다르게 보는 경험을 직접 해 보지 않아도, 색을 빼 보는 것만으로 색에만 담긴 정보의 빈자리를 확인할 수 있다.

4-2. 색은 더하는 단서로

'색만으로 말하지 않기'는 색을 포기하라는 요구가 아니다. 색은 정보를 빠르고 보기 좋게 전하는 훌륭한 단서다. 다만 그 옆에 색을 빼도 남는 단서(글자, 기호, 모양, 위치)를 함께 두면, 색은 더하는 단서가 되어 모두에게 닿는다. 색을 빼는 것이 아니라, 색만 남기지 않는 것 — 이것이 색 비의존 설계의 출발점이다.

4-3. 기준은 '유일한가'를 묻는다

WCAG의 색 관련 항목이 묻는 것은 '색이 유일한 단서인가'다. 항목의 정확한 번호·등급은 기준 원문에서 확인하되, 화면의 어떤 정보를 두고 "이걸 색을 빼고도 알 수 있는가"를 물어보는 일은 색을 쓸 때마다 되짚어 볼 만하다. 색이 더하는 단서일 때 화면은 더 많은 사람에게 닿고, 색이 유일한 단서일 때 화면은 색을 다르게 보는 사람을 놓친다.

색 의존을 점검하는 동선을 한자리에 모으면, 어떤 순서로 색을 빼 보고 무엇을 채워 넣는지가 잡힌다.

점검 순서	하는 일	보는 것
색 빼 보기	화면을 회색조로 전환	구분이 사라지는 자리가 어디인가
단서 찾기	사라진 자리에 색 외 단서 확인	글자·기호·모양·위치가 있는가
단서 더하기	색 옆에 빠진 단서를 보탬	색을 빼도 정보가 남는가

(관점) 위 순서는 색 비의존을 점검할 때 따라가 볼 만한 동선을 정리한 것이며, 표준 절차가 아니다. 회색조 전환은 색각 경험을 그대로 재현하지는 않으나, 색에만 담긴 정보의 빈자리를 드러내는 데 도움이 된다.

5. 반론·한계와 ViewCheck 관점

5-1. 가능한 반론과 우리의 한계

색 비의존 설계는 명료해 보이지만, 다른 시각이 있을 수 있다. 몇 가지 반론을 미리 적고, 우리의 한계도 함께 밝혀 둔다.

가능한 반론	우리의 한계 인정	보완하는 태도
단서를 다 더하면 화면이 복잡해진다	단서가 늘면 시각적 부담이 생길 수 있다	빠진 자리에만 최소한의 단서를 더함
회색조 점검은 실제 색각과 다르다	시뮬레이션은 경험을 그대로 재현하지 못한다	빈자리 발견 도구로 쓰되 단정하지 않음
색각 유형·비율 수치는 자료마다 다르다	정확한 통계를 우리가 확정할 수 없다	비율의 정확성보다 '드물지 않음'에 무게

5-2. ViewCheck의 관점 — 사람과 도구의 분담

색 의존은 '색 외 단서가 코드에 있는가'와 '그 단서가 실제로 구분에 도움이 되는가'가 다르다. 자동 점검이 짚는 자리와 사람이 봐야 하는 자리를 나누어 둔다.

점검 항목	자동 점검이 보는 것	사람이 봐야 하는 것
상태 표시	색 외 텍스트·기호의 존재	회색조에서 상태가 실제 구분되는가
그래프·차트	이름표·패턴 속성의 유무	색을 빼도 선이 분간되는가
링크·강조	밑줄 등 비색상 단서의 존재	본문 속에서 링크로 읽히는가

(관점) 위 분담은 점검을 돕기 위한 정리이며, 자동/사람의 경계는 도구와 화면에 따라 달라질 수 있다. ViewCheck는 색 외 단서의 유무를 거르는 데 쓰일 수 있으나, 그 단서가 실제로 구분에 닿는지에 대한 판단은 사람의 몫으로 남는다.

한 장 요약

구분	핵심 내용
문제	색에만 담긴 정보는 색을 다르게 보는 사용자에게 사라짐
색각 이상	빨강/초록 등을 구별하기 어려운 특성 — 드물지 않음
관련 기준	색이 정보 전달의 '유일한' 수단이 되면 안 된다는 취지(1.4.1로 알려짐)
대비와의 차이	대비(또렷함)와 색 의존(유일성)은 다른 질문
기대는 자리	상태 표시, 필수 입력, 그래프·차트, 링크 강조
점검 방법	화면을 회색조로 바꿔 색으로만 구분되던 정보가 사라지는지 보기

맺으며

색은 빠르고 보기 좋은 단서다. 그러나 색을 보는 방식은 사람마다 다르고, 색에만 담긴 정보는 색을 다르게 보는 사람에게서 조용히 사라진다. '색만으로 말하지 않기'는 색을 포기하라는 요구가 아니라, 색 옆에 색을 빼도 남는 단서를 함께 두라는 권유다. 색이 더하는 단서일 때, 화면은 더 많은 사람에게 같은 말을 한다.

이 글은 색이 다르게 보이는 사용자와 색 비의존 설계의 개념을 기준의 배경과 함께 따라가 보았다. 다음 편에서는 시선을 그 사용자에게로 옮긴다. 빨강도 초록도 비슷하게 보이는 사람이 화면에서 무엇을 마주하는지를 관찰의 관점에서 이어 본다.

다음 편 예고 (045): 〈빨강도 초록도 같아 보인다면 / 색각이상 사용자 관찰〉 — 적록 계열 색각을 가진 사용자가 색으로만 구분된 화면에서 마주하는 막막함을 따라가며, 색 의존이 어디서 사용자를 놓치는지를 관찰한다.

참고한 공개 자료(출처):

WCAG(Web Content Accessibility Guidelines) — 색의 사용(1.4.1로 알려진 항목) 및 색 비의존 설계 해설
W3C WAI(Web Accessibility Initiative) — 색에 의존하지 않는 정보 전달 해설 자료
KWCAG(한국형 웹 콘텐츠 접근성 지침) — 색에 무관한 콘텐츠 인식 관련 항목
색각 이상의 유형·비율에 관한 공신력 있는 의학·통계 자료

※ 위 자료의 항목 번호·등급·세부 문구 및 색각 관련 수치는 판본·출처에 따라 달라질 수 있으므로, 실제 적용 시에는 각 자료의 원문을 직접 확인하는 것이 안전합니다. 이 글은 특정 기준의 공식 해석이 아니라 하나의 연구 관점입니다.