본문 바로가기
css

내게 필요한 옵션 기본 사항: 페이지의 색맹 테스트

by code-box 2021. 9. 28.

일부 추정에 따르면, 세계 남성 인구의 최대 10%가 어떤 형태의 색맹으로 고통 받고 있다. 가장 흔한 것은 적녹색맹인 프로타노피아입니다. 적색과 녹색을 구분하지 못합니다. 블루 옐로우 색맹과 토탈 컬러 블라인드도 있습니다.

훌륭한 웹 디자이너들은 엄청나게 다양한 웹 브라우저와 심지어 스크린 리더를 사용하는 사용자들을 수용하기 위해 웹사이트를 손보고 수정하는 데 엄청나게 많은 시간을 보낸다. 이런 종류의 작업은 여기저기서 시청자의 소수를 수용하기 위해 수 많은 시험, 머리를 쥐어뜯는 해킹, 그리고 잠을 못 이루는 밤을 포함한다. 물론 접근성도 중요하기 때문에 그만한 가치가 있습니다. 몇 단계 더 나아가 시각 장애가 있는 사람들이 여러분의 완벽한 레이아웃을 실제로 읽을 수 있도록 하는 것은 어떨까요?

다음과 같은 툴, 링크 및 아이디어를 통해 목표를 달성할 수 있습니다.

Jeffrey Zeldman은 그가 심 달튼주의를 만났던 색맹을 위한 디자인을 테스트하는 주제에 대한 좋은 기사를 가지고 있다. Sim Dalonism은 사용자가 선택할 수 있는 색맹에 시달리는 다른 사람에게 마우스가 어떻게 보이는지 보여주는 작은 "포털" 창을 여는 가벼운 OS X 앱입니다. 다운받아서 가지고 놀았는데 꽤 괜찮은 앱이에요.

그는 또한 색맹 웹 페이지 필터도 언급했습니다. 이 필터는 URL을 입력하고 색맹의 유형을 선택할 수 있게 해줍니다. 그리고 색맹의 유형을 찾는 페이지를 생성합니다. 한 번에 전체 페이지를 보는 데 매우 유용합니다.

색맹을 위한 디자인의 많은 부분은 대조입니다. Go MediaZine은 몇몇 예들과 대조되는 좋은 글과 나쁜 글에 대해 좋은 기사를 가지고 있다.

OS X를 사용하는 경우 범용 액세스 제어판을 체크아웃할 수 있습니다. 컬러 블라인드가 전체 운영 체제 전반에 걸쳐 대비를 높이는 데 잠재적으로 유용할 뿐만 아니라 테스트에도 유용합니다. 전체 색맹으로 페이지를 쉽게 볼 수 있는 "그레이스케일 사용" 옵션이 있습니다.

설정을 방해하고 싶지 않으면 언제든지 페이지의 스크린샷을 캡처할 수 있습니다(OS X 관련 내용은 유감스럽지만 Command-Shift-4와 스페이스 바에서 창을 스크린샷할 수 있습니다). 그런 다음 미리보기에서 스크린샷을 열고 색상 조정으로 이동한 다음 포화도 슬라이더를 왼쪽으로 끝까지 끕니다.

아마도 내가 가장 좋아하는 색상 대비 테스트 도구는 조나단 스눅의 간단한 색상 대비 검사일 것이다. 전경색과 배경색을 설정하기 위한 두 개의 간단한 슬라이더와 해당 대비가 허용 가능한 대비 수준에서 호환되는지 여부를 보여주는 결과 패널이 있습니다.

이것이 당신에게 유용한 검거가 되었기를 바랍니다. 이 문제에 대해 다른 의견이 있으면 말씀해 주세요. 그 의견을 듣고 싶어요.

댓글