WCAG 2.1 자동 진단 도구
어디가 문제인지가 아니라, 어떻게 고치는지까지.
웹사이트 주소를 입력하면 장애인·고령자가 사용하기 어려운 부분을 WCAG 2.1 기준으로 찾아냅니다. 기존 검사 도구가 문제 목록에서 멈추는 것과 달리, 이 도구는 바로 붙여넣을 수 있는 수정 코드와 담당자에게 그대로 넘길 수 있는 작업 지시서, 인쇄용 PDF 보고서까지 만들어 줍니다.
결과는 이 브라우저에만 저장
바로 붙여넣는 수정 코드
담당자용 작업 지시서 · PDF
개선 예시 (가상의 사이트)
example-shop.kr
42점 89점으로 개선
수정 전
<img src="/banner.jpg">
수정 후
<img src="/banner.jpg" alt="이번 시즌 할인 안내">
검사할 주소
예시로 검사해 보기:
이 도구가 확인하는 것
자동 검사는 접근성 문제의 약 30~40%만 잡아냅니다(업계에서 널리 알려진 한계입니다). 나머지는 실제 화면낭독기 사용, 키보드만으로 조작해 보기, 대체 텍스트가 정말 내용을 설명하는지 읽어 보기 등 사람의 확인이 필요합니다. 접근성 실무 가이드에서 확인 방법을 정리했고, 주제별 상세 설명은 접근성 아티클에 코드 예시와 함께 모아 두었습니다.
검사는 이렇게 진행됩니다
- 가져오기 — 입력한 주소의 HTML과 CSS를 서버가 받아 옵니다. 공개된 인터넷 주소만 검사하며, 로그인이 필요한 페이지나 내부망 주소는 검사할 수 없습니다.
- 규칙 검사 — 35개 규칙(대체 텍스트, 버튼·링크 이름, 색상 대비, 키보드 조작, 입력창, 구조, ARIA, 기타)을 적용해 문제 위치를 코드 줄 번호와 함께 찾습니다. 같은 페이지는 언제 검사해도 같은 결과가 나옵니다.
- 점수와 우선순위 — 심각도(치명적·높음·보통·낮음)에 따라 100점에서 감점하고, 고친 뒤 다시 검사하면 이전 점수와의 차이를 보여 줍니다.
- 수정안(선택) — 버튼을 눌렀을 때만 AI가 문제마다 수정 코드와 담당자용 작업 지시서를 만듭니다. AI가 만든 코드는 초안이므로 적용 전 검토가 필요합니다.
각 규칙이 무엇을 근거로 잡는지는 검사 규칙 사전에, 서비스의 한계와 운영 방식은 소개에, 주제별 해설은 접근성 아티클에 공개해 두었습니다. 처음이라면 실습: 17점짜리 페이지를 100점으로 고쳐 보기가 전체 흐름을 이해하기에 좋습니다.