웹 개발을 진행하다보면 웹 접근성이라는 말이 나옵니다.
장애인분들이나 고령자분들도 웹 사이트를 사용하는데 불편함이 없도록 차별없게 기능을 제공하는 것을 말하는데, 탭키를 통한 모든 메뉴를 이동하는 기능이라던지 색맹, 색약분들을 위한 디자인 개선이라던지 다양한 방법으로 제공이 되도록 보장하는것을 말합니다.
그럼 개발자분들은 이런분들의 입장이 되어 개발을 진행해야하는데, 사실 내가 개발중인 사이트가 색맹, 색약인 분들이 봤을때, 어떤식으로 보일지 가늠이 안되는 경우가 있는데, 이럴때 크롬의 자체 지원 기능으로 간접적으로 경험을 하고 개발을 진행할 수 있습니다.
색맹모드 설정방법
1. F12 키등을 통해 관리자 도구를 실행합니다.
2. 상단 더보기(점 3개) - More tools - Rendering을 차례대로 누릅니다.
3. 추가된 Rendering 탭을 위로 올립니다.
4. 다양한 옵션들 중 Emulate vision deficiencies 찾습니다.(색맹 에뮬레이션)
* 관리자도구 옵션을 한글로 변경하여 보시면 설정이 더 편하게 처리 가능합니다.
변경하는방법은 최하단에 추가로 기재하였습니다.
5. 변경하고 싶은 옵션을 선택합니다.
- Blurred vision : 흐릿하게 변경해줍니다. 근시효과
- Protanopia : 적색맹
- Deuteranopia : 녹색맹
- Tritanopia : 청황색맹
- Achromatopsia : 색맹
적용 테스트
| 기존 화면 | 색맹 모드(Achromatopsia) |
 |
 |
파란계열 주황계열로 차트 구분을 해두었지만 색맹인분들에게는 거의 구분이 되지 않는다.
이를 해결하기 위해 차트에 질감처리를 추가하였다.
-색 구분을 위한 질감처리 추가
| 기존 화면(질감처리 추가) | 색맹 모드(Achromatopsia) |
 |
 |
질감 처리 추가로 2개의 비교 차트가 좀 더 구분되는 모습을 볼 수 있습니다.
크롬 브라우저 한글로 언어 변경하기
1. F12 관리자도구 열기
2. 톱니바퀴(환경설정)
3. 환경설정 - 언어 - 한국어 선택
