스크린리더-테스팅은(는) 무엇을 하나요?
VoiceOver, NVDA 및 JAWS를 포함한 스크린 리더로 웹 애플리케이션을 테스트합니다. 스크린 리더 호환성 검증, 접근성 문제 디버깅 또는 보조 기술 지원 확인 시 사용하세요.
지원 플랫폼
- macOS: VoiceOver (내장)
- Windows: NVDA (무료 오픈 소스), JAWS (상용)
- Linux: Orca (내장, GNOME 데스크탑)
설치 및 설정
VoiceOver (macOS)
VoiceOver은 macOS에 내장되어 있으므로 별도 설치가 필요하지 않습니다. 활성화하려면:
# VoiceOver 켜기/끄기 단축키
Cmd + F5
# VoiceOver 유틸리티 열기
Cmd + F5를 누른 후, VoiceOver 유틸리티에서 설정
NVDA (Windows)
- NVDA 공식 웹사이트에서 다운로드합니다.
- 설치 프로그램을 실행하고 지침을 따릅니다.
- NVDA를 시작하려면 바탕화면 바로가기를 사용하거나
Ctrl + Alt + N을 누릅니다.
JAWS (Windows)
- JAWS 공식 웹사이트에서 다운로드합니다.
- 설치 프로그램을 실행하고 지침을 따릅니다.
- JAWS를 시작하려면 바탕화면 바로가기를 사용하거나
Insert + J를 누릅니다.
기본 명령어
VoiceOver (macOS)
| 명령어 | 설명 |
|---|---|
VO + 오른쪽 화살표 | 다음 요소로 이동 |
VO + 왼쪽 화살표 | 이전 요소로 이동 |
VO + Shift + 아래쪽 화살표 | 요소와 상호작용 시작 |
VO + Shift + 위쪽 화살표 | 상호작용 종료 |
VO + H | 도움말 메뉴 열기 |
참고: VO는 Control + Option 키를 의미합니다.
NVDA (Windows)
| 명령어 | 설명 |
|---|---|
NVDA + Tab | 다음 요소로 이동 |
NVDA + Shift + Tab | 이전 요소로 이동 |
NVDA + Space | 요소 활성화 |
NVDA + 위쪽 화살표 | 부모 요소로 이동 |
NVDA + 아래쪽 화살표 | 자식 요소로 이동 |
Insert + F7 | 요소 목록 열기 |
참고: NVDA는 기본적으로 Insert 또는 Caps Lock 키입니다.
JAWS (Windows)
| 명령어 | 설명 |
|---|---|
Insert + 아래쪽 화살표 | 다음 요소로 이동 |
Insert + 위쪽 화살표 | 이전 요소로 이동 |
Insert + Enter | 요소 활성화 |
Insert + F5 | 양식 필드 목록 열기 |
Insert + F6 | 헤딩 목록 열기 |
테스트 프로세스
- 스크린 리더 활성화: 위의 지침에 따라 스크린 리더를 켭니다.
- 웹 애플리케이션 열기: 테스트할 웹 애플리케이션을 브라우저에서 엽니다.
- 탐색: 스크린 리더 명령어를 사용하여 페이지를 탐색합니다.
- 검증: 다음 사항을 확인합니다:
- 모든 대화형 요소(링크, 버튼, 양식 필드)에 접근 가능한지 확인
- ARIA 랜드마크 및 레이블이 올바르게 작동하는지 확인
- 이미지에 적절한 대체 텍스트가 있는지 확인
- 동적 콘텐츠 업데이트가 올바르게 발표되는지 확인
- 문제 기록: 발견된 접근성 문제를 기록합니다.
일반적인 접근성 문제
- 누락된 대체 텍스트: 이미지에
alt속성이 없음 - 잘못된 ARIA 사용: ARIA 속성이 잘못 적용됨
- 키보드 트랩: 사용자가 키보드로 요소에 갇힘
- 낮은 대비: 텍스트와 배경 간 대비가 충분하지 않음
- 포커스 표시 부족: 키보드 포커스가 명확하게 표시되지 않음
리소스
기여
버그 리포트나 기능 제안은 GitHub 저장소에 제출해 주세요.