잃어버린 접근성을 찾아서
24
AI 요약
이 글은 AI가 원문을 분석하여 핵심 내용을 요약한 것입니다.
이 게시물은 스크린 리더 사용자 중심으로 상품 상세 페이지 접근성 문제와 개선 과정을 정리
문제
- 순차 탐색만 가능해 구매 버튼까지 300회 이상 스와이프 필요
- 텍스트가 분리되어 발화 파편화
- 버튼 역할·상태 불명확
개선
- 랜드마크·머리말로 단위 탐색 도입
- 템플릿 리터럴 및 스크린리더용 컴포넌트로 텍스트 통합
- aria-pressed·aria-haspopup·aria-expanded 등으로 상호작용 명확화
결과
- 구매 버튼 도달 스와이프 300회 이상에서 20회 미만으로 감소, 접근성과 개발 생산성 모두 개선
- Lighthouse 점수만으로는 실제 스크린 리더 사용성 판단 불가
