소기업을 위한 웹사이트 접근성 점검표(WCAG 기반)

WCAG 2.2를 기반으로 키보드와 포커스, 텍스트, 대비, 양식 레이블과 오류, 이미지 대체 텍스트를 확인합니다. 자동 검사와 사람의 점검 차이, 법률 준수를 주장하지 않고 결과를 기록하는 방법도 안내합니다.

이 점검표는 소기업 운영자가 별도 소프트웨어 없이 약 1시간 동안 확인할 수 있는 항목을 다룹니다. 키보드만으로 사이트를 이용하고, 글자 크기와 대비를 확인하고, 모든 양식 입력란에 레이블과 명확한 오류 안내가 있는지, 이미지에 적절한 텍스트 대체가 있는지 점검하세요. 대부분의 법률과 정책에서 참고하는 표준인 WCAG 2.2와 W3C의 간편 점검 항목을 바탕으로 했습니다. 이 항목을 통과해도 법률 준수가 보장되지는 않으며 가장 흔한 이용 장벽을 찾는 데 도움이 됩니다.

1. 키보드와 포커스 순서 점검

마우스를 치워 두세요. 페이지 상단부터 아래까지 Tab을 누른 다음 Shift+Tab으로 돌아오세요.

[ ] 첫 Tab에서 “본문으로 건너뛰기” 링크가 나타남(긴 메뉴를 건너뛸 때 유용)
[ ] 모든 링크, 버튼, 양식 입력란에 Tab으로 접근할 수 있음
[ ] 현재 포커스 위치를 항상 확인할 수 있음(윤곽선 또는 강조 표시)
[ ] 포커스가 위에서 아래로, 왼쪽에서 오른쪽으로 자연스럽게 이동함
[ ] Enter 또는 Space로 메뉴를 열고 Escape로 닫을 수 있음
[ ] 팝업을 키보드로 닫을 수 있고 포커스가 페이지로 돌아옴
[ ] 포커스가 갇히지 않음(Tab으로 다음 항목으로 이동 가능)
[ ] 고정 헤더가 포커스된 항목을 가리지 않음

2. 텍스트, 대비, 양식 레이블과 오류

[ ] 일반 확대에서 본문 글자를 읽기 쉬움(약 16px 이상)
[ ] 200% 확대해도 겹치거나 잘리는 내용이 없고 가로 스크롤이 없음
[ ] 텍스트 대비가 최소 4.5:1(큰 글자는 3:1)이며 도구로 확인함
[ ] 색상 외의 방법으로도 링크와 본문을 구분할 수 있음
[ ] 모든 양식 입력란에 보이는 레이블이 있음(자리 표시자 문구는 레이블이 아님)
[ ] 필수 입력란을 색상만이 아닌 텍스트로 표시함
[ ] 오류가 발생한 입력란 옆에 무엇이 잘못됐고 어떻게 수정할지 안내함
[ ] 버튼이 동작을 설명함(“제출” 또는 아이콘만 대신 “문의 보내기”)
[ ] 페이지 언어가 설정되어 있고 헤딩 순서가 올바름(H1, H2, H3)

색상 대비 검사 도구로 색상 조합을 확인하세요. 대비 기준은 WCAG의 최소 대비 기준에 따른 것입니다.

3. 이미지의 목적과 텍스트 대체

예외 사례는 W3C의 대체 텍스트 결정 트리에서 확인할 수 있습니다.

4. 자동 검사와 사람의 점검 비교

자동 검사로 찾을 수 있는 항목사람이 직접 판단해야 하는 항목
누락된 alt 속성대체 텍스트가 실제로 유용한지
단색 배경에서 낮은 대비사진이나 동영상 위 텍스트의 대비
레이블이 없는 양식 입력란레이블과 오류 안내가 이해되는지
페이지 언어 누락, 빈 링크키보드 순서, 포커스 표시, 포커스 갇힘 여부
건너뛴 헤딩 단계헤딩이 콘텐츠를 잘 설명하는지

먼저 자동 검사를 실행하세요(웹사이트 평가 도구에는 기본 접근성 점검이 포함되며 W3C는 평가 도구 목록을 관리합니다). 그런 다음 위의 수동 점검을 진행하세요. 고객 중 장애가 있는 사람이 많다면 장애인 사용자 테스트를 의뢰하세요.

작성 예시: 점검 결과 기록(가상 시연)

가상의 사업체 “Harbour Line Plumbing” 예시입니다. 실제 회사나 점검 결과가 아니라 기록 양식을 보여 주기 위한 사례입니다.

확인 날짜: [날짜]   확인자: 사업주   페이지: 홈, 서비스, 연락처
브라우저/기기: 노트북 키보드만 사용; 스크린 리더를 켠 휴대전화
번호  페이지   문제                                  WCAG 기준   수정 여부
1     홈       전화 아이콘에 레이블 없음(“버튼”)      4.1.2       예
2     홈       히어로 사진 위 흰색 글자가 잘 안 보임  1.4.3       예, 어두운 오버레이
3     연락처   우편번호 입력란 레이블이 자리 표시자뿐 3.3.2       예
4     연락처   오류 안내가 “잘못됨”뿐                  3.3.1       예, “전화번호를 입력하세요”
5     서비스   갤러리 사진 대체 텍스트가 파일명뿐      1.1.1       예
6     전체     메뉴 링크의 포커스가 보이지 않음         2.4.7       미해결 - 빌더에 개선 요청
미검사 항목: 사이트에 동영상이 없어 동영상 자막은 검사하지 않음
빈 양식
확인 날짜 / 확인자 / 페이지 / 브라우저 및 기기:
번호  페이지  문제  WCAG 기준  수정 여부(예 / 미해결 + 메모)
미검사 항목:

5. 법률 준수를 주장하지 않고 점검 결과 기록하기

We.Inc 빌더에서 페이지의 레이블과 문구를 클릭해 편집하는 화면
We.Inc 빌더에서 레이블과 문구를 직접 수정합니다.

다음 단계

비즈니스 템플릿을 We.Inc 웹사이트 빌더에서 선택한 다음 이 점검표와 웹사이트 평가 도구를 실행하고 게시하세요. Free 요금제는 AI 크레딧과 맞춤 도메인 없이 we.inc 주소의 템플릿 사이트를 최대 3개까지 제공합니다. 월 $20 Starter는 AI 제작과 맞춤 도메인을 추가합니다(요금제). 수정이나 재제작 예산을 세우려면 웹사이트 비용 계산기를 이용하세요.

비즈니스 웹사이트 만들기 시작

자주 묻는 질문

웹사이트 접근성 점검표는 어떤 표준을 따라야 하나요?

대부분의 법률과 정책에서 참고하는 표준은 WCAG 2.2 AA입니다. 이 점검표는 소기업에서 흔한 문제를 다루며 모든 기준을 포함하지는 않습니다.

자동 검사 도구가 웹사이트를 접근성 있게 만들 수 있나요?

아니요. 자동 도구는 누락된 속성과 일부 대비 문제를 찾지만 키보드 사용, 포커스, 레이블과 대체 텍스트의 적절성은 사람이 확인해야 합니다.

이 점검표를 통과하면 ADA를 준수하는 웹사이트가 되나요?

어떤 점검표도 법률 준수를 보장할 수 없습니다. 날짜가 포함된 기록을 보관하고 솔직한 접근성 안내문을 게시하며 의무 사항은 변호사에게 문의하세요.

무료로 시작하기 · 신용카드 필요 없음

Product

Who It's For

Features

Resources

Company

View Sitemap