WCAG 2.4.7에 따른 보이는 포커스
키보드로 탐색하는 사람은 어느 요소에 포커스가 있는지 항상 볼 수 있어야 합니다. 대체가 없는 outline: none은 기준 2.4.7을 위반합니다.
흔한 오류
대체 없이 리셋 CSS의 *:focus { outline: none }, 대비가 너무 낮은 포커스 스타일, 또는 인접 요소에 가려지는 포커스 링.
올바른 방법
:focus-visible를 사용하세요(키보드 사용 시에만 링 표시), 최소 2 px, 뚜렷한 대비, 약간의 간격(outline-offset). 링은 거슬리더라도 계속 보여도 됩니다 — 없어서는 안 될 뿐입니다.
a11yglass가 돕는 방법
무료 스캔은 제공된 HTML과 CSS를 자동으로 인식 가능한 WCAG 위반에 대해 점검하고, 각 발견 사항마다 성공 기준과 구체적인 조치를 제시합니다. 문제의 약 20~35 %를 발견하며 완전한 평가를 대체하지 않습니다.
계속 읽기
최선의 지식에 따른 일반 정보이며 법률 자문이 아닙니다. 개별 사안은 IT 법을 전문으로 하는 법무법인에 문의하세요.