📌 openwax란?
- 크롬, 파이어폭스의 확장 프로그램 중 하나로 접근성 관련된 문제를 자동으로 검사해준다.
- 웹 접근성 표준(WCAG, 한국형 웹접근성 지침 2.0 등)을 기준으로 검사한다.

- 크롬 기준으로 확장프로그램 설치하면 openWax를 바로 사용 할 수 있다.
[접근성] 명도대비 확인하기 (feat. 크롬 확장 프로그램) WCAG Color contrast checker
☑️ 접근성 필수 요소인 명도대비.명도대비란?누구든지 텍스트와 시각 정보를 쉽게 구분할 수 있게 텍스트(혹은 아이콘 등)의 요소가 배경색과의 대비를 충분하게 확보하는 것을 의미한다.일
s-notee.tistory.com
⬆️ 설치 방법은 저번에 쓴 WCAG Color contrast checker 설치하는 거랑 똑같다!

- openWAX 프로그램을 돌려보면 웹사이트 좌측에 접근성에 준수하지 않은 부분이 빨간색으로 뜬다.
위의 문제는 테이블에 관한 마크업 규칙이 접근성에 맞지 않는 구조라는 의미다.
➡️ table 태그의 필수인 caption, thead등이 없다는 의미.
나도 작업하면서 까먹고 누락시켰다.
(tfoot 태그는 권장되는 요소이기는 하나 필수는 아니라고 알고있음.)

➡️ 오류 떴던 부분을 수정하면 빨간색으로 체크 됐던 부분이 사라진다!
- 하지만 이것도 한계점이 은근 많아서 키보드처리, 애니메이션, Aria속성 등등 별도로 체크 해야한다고 한다.
솔직히 마크업만 잘해도...
반응형
'퍼블리싱 > 웹접근성' 카테고리의 다른 글
| [접근성] 명도대비 확인하기 (feat. 크롬 확장 프로그램) WCAG Color contrast checker (0) | 2025.11.09 |
|---|---|
| aria 속성 예시, 아코디언에 aria 속성 적용 (0) | 2024.11.21 |
| AOS Android talkback 하단 자막패널 나오게 하기 (1) | 2024.11.17 |
| AOS Talkback 토크백 단축키 또는 아이콘 버튼 설정하기 (0) | 2024.11.16 |
| iOS VoiceOver 보이스오버 하단에 텍스트 나오게 하기 / 자막 패널 (0) | 2024.11.15 |