[명도대비] 배경과 컨텐츠가 명확히 구분되도록 명도 대비 검토 및 변환

[hyh1016]

설명

저시력자, 고령자 등도 컨텐츠를 명확하게 인식할 수 있도록 콘텐츠와 배경 간의 명도 대비는 4.5:1 이상이어야 한다.

구현 방향

해당 요소에 적용된 배경 색깔과 글자 색깔을 16진수 색상값으로 추출하고 두 색상 간 대비(Contrast ratio)를 산출하여 접근성을 준수하고 있는지 검토한다. 접근성 기준을 만족하지 못한다면 다음의 조건을 만족하는 색상으로 변환한다.

1. 저시력 색맹 시각 장애인이 쉽게 구분할 수 있는 색상
2. 1번을 만족하는 색상 중 기존의 색상에서 크게 벗어나지 않는 색상
   (서비스의 개발자가 의도한 UI를 크게 침해하지 않는 수준에서의 색상 변화를 목적으로 함)

논의 사항

1. 배경색과 글자색 중 어떤 색을 변화시킬 것인가?
2. 변화 기준으로 기존의 색약 모드에서 사용하는 색상 테이블을 사용할 것인가?

참고자료

네이버 접근성 페이지 : 명도 대비

[Yeonji-Lim]

별도의 명도 대비 모드가 필요할 것으로 판단

색맹 모드 : 원본 -> 색약 인식 색상으로 변환 -> 명도 대비 모드 -> 결과
명도 대비 모드 : 원본 -> 명도 대비 적용 -> 결과

본 이슈 해결시, Issue #3 도 자동 해결될 것으로 보임