PLATON

초록색이 선택됐다는 뜻이라면, 색을 구분하지 않아도 알 수 있게 표시합니다

플라톤마케팅 사내 원고 회의 기록, 2023년 12월

문의 항목을 고르면 배경만 초록색으로 바뀌는 홈페이지가 있습니다. 운영자는 그 색을 선택 완료로 이해하지만 모든 방문자가 같은 방식으로 구분할 수 있는 것은 아닙니다. 색에 의미를 담았다면 문자나 표식처럼 눈에 보이는 다른 단서로도 같은 의미를 전달하는지 확인해야 합니다. 브랜드 색상을 없애는 작업이 아니라 정보를 놓치지 않도록 표현을 보완하는 작업입니다.

색이 장식인지 정보인지 먼저 구분합니다

배경 장식의 색과 선택 상태를 나타내는 색은 역할이 다릅니다. W3C는 정보를 전달하거나 행동과 응답을 안내하고 시각 요소를 구분할 때 색을 유일한 시각적 수단으로 사용하지 않는 기준을 설명합니다. 색 사용 기준 안내

페이지에서 색이 달라지는 곳을 모아 각각 어떤 의미인지 적습니다. 선택된 항목, 현재 단계, 안내 도표의 범주, 본문 링크처럼 방문자가 판단에 사용하는 표시부터 확인합니다. 의미를 설명하려면 '초록색 항목을 보세요'라고만 말해야 하는 구조인지 살펴봅니다.

노트북을 앞에 두고 자료를 설명하는 플라톤마케팅 구성원들
화면의 색상별 의미를 검토하는 업무의 참고 사진입니다. 회의 참고 사진 · 플라톤마케팅 · 자사 촬영.

선택 상태에는 문자나 명확한 표식을 더합니다

항목을 고른 뒤 '선택됨'이라는 문구나 체크 표시가 함께 나타나는 방식을 검토할 수 있습니다. 체크 표시를 쓰더라도 무엇을 뜻하는지 문맥에서 이해할 수 있어야 합니다. 선택을 해제하면 표시도 함께 바뀌는지 확인하고, 여러 항목을 고를 수 있는 화면인지 하나만 고르는 화면인지 안내합니다.

운영 검수의 가정으로 선택 항목 3개를 각각 선택 전과 선택 후라는 2개 상태에서 확인하면 6개 상태 조합을 보게 됩니다. 이 숫자는 검수 범위를 정하는 예시입니다. 색은 바뀌었는데 문자 표시는 이전 상태로 남는 등 서로 충돌하는 경우를 따로 기록합니다. 실제 제출 없이 상태만 확인할 수 있는 시험 환경을 활용합니다.

의미 / 색이 선택·구분·행동 중 무엇을 뜻하는가 · 보완 / 문자·표식으로 같은 의미를 전달하는가 · 상태 / 선택 전후에도 표시가 일치하는가 · 검수 / 시각 표시와 보조기술 정보를 함께 확인
플라톤마케팅 운영 점검 제안 · W3C Use of Color 참고 · 2026-10-26

도표와 본문 링크에도 같은 질문을 적용합니다

안내 도표에서 초록색은 완료, 빨간색은 대기를 뜻한다면 범례의 색상만 보고 분류해야 하는지 확인합니다. 각 항목에 '완료'와 '대기'를 적거나 서로 다른 모양을 쓰면 색을 정확히 구분하지 않아도 의미를 찾기 쉽습니다. 단순히 더 진한 색으로 바꾸는 것과 범주의 뜻을 명시하는 것은 다릅니다.

본문 링크는 밑줄처럼 링크임을 알아볼 수 있는 표시를 검토합니다. 밑줄만이 가능한 해결책이라고 단정하지는 않으며, 색의 명도 차이 등 적용 가능한 조건은 공식 설명에 따라 별도로 평가합니다. 운영자에게는 어디가 눌리는지 발견하기 쉬운 표현인지도 중요합니다. 링크를 누른 뒤 목적지와 안내 문구가 맞는지도 확인합니다.

회의 테이블에서 각자 노트북 자료를 검토하는 플라톤마케팅 구성원들
선택 상태의 문자와 표식을 대조합니다. 회의 참고 사진 · 플라톤마케팅 · 자사 촬영.

화면에 없는 설명으로 시각 문제를 해결했다고 보지 않습니다

보조기술에만 전달되는 이름이나 상태를 추가했더라도 색을 구분하기 어려운 사람이 화면에서 그 정보를 볼 수 없다면 시각적 단서는 부족할 수 있습니다. 반대로 화면에 체크 표시를 붙였다고 보조기술에도 선택 상태가 자동으로 전달되는 것은 아닙니다. 보이는 표현과 프로그램으로 전달되는 상태를 각각 확인합니다.

흑백 화면이나 색각 모의 도구는 의심 지점을 찾는 보조 수단으로 사용할 수 있습니다. 그러나 한 번의 모의 화면에서 구분됐다고 모든 사용자와 모든 상태에서 충분하다고 판단하지 않습니다. 색이 없어도 범주의 뜻을 설명할 수 있는지, 동작 후에도 표시가 유지되는지 실제 흐름을 따라 확인합니다.

수정 요청에는 주소, 해당 요소, 색이 뜻하는 의미와 부족한 단서를 적습니다. 수정 뒤에는 정상·선택·해제 등 필요한 상태를 다시 확인하고, 브랜드 스타일을 바꾸면서 다른 링크나 표시가 불분명해지지 않았는지 함께 봅니다.

출처 확인일: 2026-10-26. 본문은 색에 의존하는 정보 표현의 운영 점검이며 글자 대비와 전체 접근성 준수 여부는 별도로 검토해야 합니다.

긴 테이블에 마주 앉아 논의하는 플라톤마케팅 구성원들
수정할 화면과 상태별 결과를 기록합니다. 회의 참고 사진 · 플라톤마케팅 · 자사 촬영.

이 글과 이어지는 주제

이 글에 공감하셨다면, 상담 전에 다른 글도 한 번 보십시오. 저희와 맞는지 먼저 확인하시는 편이 서로에게 낫습니다.

카톡으로 물어보기
카카오톡 상담지금 바로 답변드립니다