영향 색맹 색각 이상(CVD)은 전 세계적으로 남성 12명 중 약 1명, 여성 200명 중 1명에게 영향을 미칩니다. 즉, 웹사이트나 앱을 방문하는 사용자 100명 중 최대 8명은 예상과 크게 다른 콘텐츠를 경험할 수 있습니다. 하지만 어떻게 확신할 수 있을까요? 사용자 경험 이 유형의 방문객에게 매력적이고 동등한 대우를 받을 수 있는 어떤 서비스를 제공하시나요?
색맹이 아니라면 색맹을 극복하는 것이 어려울 수 있습니다. 다행히 디자이너들은 다양한 온라인 도구를 활용하여 모든 연령대에 적합한 디자인을 완성할 수 있습니다.
색맹인 대부분의 사람들은 다른 사람들과 마찬가지로 사물을 선명하게 볼 수 있지만, 차이점은 빨간색, 초록색, 파란색 빛을 구분하지 못한다는 것입니다. 이 결핍은 X 염색체의 돌연변이로 인해 발생하는데, 즉 여성은 영향을 받기보다는 유전될 가능성이 더 높다는 것을 의미합니다. 색맹은 세 가지 주요 형태로 나타날 수 있습니다.
가장 흔한 색맹은 적록색맹으로, 색 스펙트럼에 빨간색이나 녹색이 포함된 모든 색을 혼동하는 증상입니다. 적색맹은 빨간색 빛에 덜 민감하고, 녹색맹은 녹색 빛에 대해서도 같은 문제를 보입니다. 예를 들어, 적색맹은 보라색의 빨간색 성분을 인식하지 못하기 때문에 파란색과 보라색을 혼동합니다. 세 번째 유형의 색맹인 청록색맹은 덜 흔하며, 파란색과 노란색 빛을 구분하는 데 어려움을 겪는 환자를 말합니다. 아래 이미지는 이러한 각 유형의 색맹 환자에게 무지개가 어떻게 보이는지 보여줍니다.
1. 웹 개발을 위한 최고의 색맹 시뮬레이터: 내장 브라우저 도구
당신은 어떤 것을 알고 계셨나요? 최신 브라우저 색맹 시뮬레이션 기능이 내장되어 있나요? 이 도구는 웹 디자이너가 색맹인 사용자도 쉽게 접근할 수 있는 웹페이지를 만드는 데 도움을 줍니다. 디자이너가 아니더라도 다른 웹사이트를 방문하거나 추가 애플리케이션을 설치하지 않고도 웹페이지를 볼 수 있습니다.
현재는 Firefox와 Chrome 브라우저에서만 이 기능을 사용할 수 있습니다. 시뮬레이션Firefox에서 색맹 시뮬레이션에 대한 자세한 내용은 다음에서 확인할 수 있습니다. 접근성 검사기 지침 페이지.
Chrome은 현재 주요 버전에 에뮬레이션 옵션이 없지만 현재 개발자 친화적인 브라우저에서 사용할 수 있습니다. 카나리아이 트윗에서 새로운 도구가 어떻게 작동하는지 확인할 수 있습니다.
새로운 접근성 기능 @크롬 개발자 도구: 흐릿한 시야와 다양한 유형의 색맹을 포함한 시력 결함을 시뮬레이션합니다. 🔥
2. 웹 페이지를 위한 최고의 색맹 시뮬레이터: Toptal Color-Blind Filter
색맹 친화적인지 확인하기 위해 웹사이트를 테스트하려면 다음을 시도하세요. Toptal 색맹 웹 페이지 필터이 웹사이트는 속도가 느릴 때도 있지만, 다른 사람의 관점에서 웹페이지가 어떻게 보이는지 보여주는 효과적인 방법입니다. URL을 입력하고, 커버리지 필터를 선택한 후 "가져오기 및 필터링!"을 클릭하세요.
색맹 필터를 적용하면 색맹 사용자가 페이지와 어떻게 상호 작용하는지 확인할 수 있습니다. 조건을 클릭하면 각 색맹 유형에 대한 새 미리보기를 만들 수 있습니다.
웹사이트 디자인을 공유하려면 왼쪽 하단의 '필터링된 페이지 URL 복사'를 클릭하세요. 이렇게 하면 다른 사람들과 결과를 공유할 수 있는 링크가 생성됩니다. 특히 다른 사람과 함께 웹사이트 디자인을 작업하면서 색맹인 사람들에게도 디자인이 잘 어울리는지 보여주고 싶을 때 유용합니다.
귀하의 웹사이트가 색맹 테스트를 통과하면 페이지 하단의 이미지를 사용하여 방문자에게 귀하의 페이지가 색맹임을 보여줄 수 있습니다. 그들의 필요에 맞는 시력에 문제가 있더라도 상관없습니다.
3. 사진용 최고의 색맹 시뮬레이터: Coblis (색맹 시뮬레이터)
하면 이미지 디자인으로 하지만 색맹인이 어떻게 볼지 궁금하다면 Coblis를 시도해 보세요.C색상-B껍질 벗기다 S에뮬레이터). 코블리스 이미지를 쉽게 업로드하고 다양한 색맹 유형을 테스트할 수 있는 웹 도구입니다.
도구를 사용하려면 페이지 중앙까지 스크롤하세요. 앱 스크린샷처럼 보이는 화면이 나타납니다. 속지 마세요. 이건 스크린샷이 아닙니다! 웹 페이지에 내장된 실제 앱입니다.
버튼을 사용하여 가상 이미지를 조작하고 도구의 기능을 직접 체험해 보세요. 이미지를 테스트할 준비가 되면 버튼을 클릭하세요. 파일 선택 업로드할 파일을 선택하세요. 이제 도구를 사용하여 다양한 보기 모드를 실험하고 이미지가 어떻게 보이는지 확인할 수 있습니다.
4. 최고의 색맹 시뮬레이터 애드온: Let's Get Color-Blind
다소 위험해 보이는 이름에도 불구하고, Let's Get Color-Blind는 웹사이트를 빠르게 확인할 수 있는 유용한 도구입니다. 확인하려는 페이지로 이동한 다음 브라우저 오른쪽 상단에 있는 확장 프로그램 아이콘을 클릭하여 활성화하세요.
활성화되면 다양한 색맹 유형을 선택할 수 있으며, 웹사이트에 설정 내용이 자동으로 업데이트됩니다. 또한, 선호도에 따라 시뮬레이션 강도를 너무 강하거나 약하게 조절할 수 있습니다.
색각 시뮬레이터(Chromatic Vision Simulator)는 이 목록에서 가장 인상적인 색맹 시뮬레이터입니다. 색맹인 사람이 보는 것과 똑같이 웹사이트나 이미지를 보는 데 가장 적합할 뿐만 아니라, 다른 모든 것을 색맹인의 눈으로 보는 데도 놀랍도록 효과적입니다.
색각 시뮬레이터는 휴대폰 카메라를 사용하여 실시간으로 색맹을 사실적으로 표현합니다. 네 가지 뷰포트 옵션이 있습니다. 하나는 정상 시력용이고 세 가지는 다양한 유형의 색맹용입니다. 하단 버튼을 사용하여 뷰포트를 전환하며 세상을 다른 눈으로 볼 수 있습니다.
이 앱의 강력한 기능은 이러한 보기를 혼합하고 일치시킬 수 있다는 것입니다. 예를 들어, 일반 보기와 적록색맹 보기를 동시에 활성화하여 두 가지를 비교할 수 있습니다. 또한 각 보기를 활성화하여 색맹인 사람처럼 주변 세상을 볼 수도 있습니다.
이 기능을 사용하면 색맹인이 선택할 수 있습니다. 기인하다 사용자의 필요에 맞춰 색상을 선택할 수 있으므로 고민할 필요가 없습니다. 무엇보다도 이 필터는 웹 페이지나 이미지 등 화면에 표시되는 모든 것에도 영향을 미칩니다.
시각 장애인의 삶을 더 편리하게 만들기
시각 미디어 디자인을 직업으로 삼는다면, 색맹이라는 개념과 색맹을 가진 사람이 당신의 작품을 어떻게 인식할지 생각해 보는 것이 좋습니다. 다행히 특별한 도구가 필요하지 않습니다. 웹사이트를 이용하거나 앱을 다운로드하기만 하면 다른 사람의 눈으로 당신의 창의적인 디자인을 볼 수 있습니다.
