본문 바로가기

성공기준 이해 2.5.5:타겟 크기 (향상된) (Level AAA)

요약

목표
특히 터치 스크린에서는 컨트롤을 더 쉽게 조작할 수 있다.
할 일
사용자 정의 타겟을 최소 44 × 44 픽셀로 만들어야 한다.
중요성
어떤 사람들은 작은 물체를 탭할 수 없다.

의도

이 성공 기준의 목적은 손 떨림, 제한된 민첩성 또는 기타 이유로 인해 작은 타겟을 활성화하는 데 어려움을 겪을 수 있는 사용자를 돕는 것이다. 타겟이 너무 작으면 표적을 겨냥하기 어려울 수 있다. 이런 사용자는 마우스 및 유사한 포인팅 장치를 사용하기 어려울 수 있으며, 더 큰 타겟은 웹 페이지에서 긍정적인 결과를 얻는 데 큰 도움이 될 것이다.

터치는 정밀도가 낮은 입력 매커니즘이므로 특히 문제가 된다. 사용자에게는 마우스나 스타일러스와 같은 입력 장치와 동일한 수준의 미세한 제어 기능이 부족하다. 손가락은 마우스 포인터보다 크기 때문에 일반적으로 터치/활성화되는 화면의 정확한 위치를 사용자가 보는 데 방해가 된다.

다양한 유형의 정밀하고 거친 입력을 수용해야 하는 반응형/모바일 사이트(예: 마우스를 사용하여 기존 데스크톱/노트북은 물론 터치스크린이 있는 태블릿이나 휴대폰에서 모두 접속할 수 있는 사이트)의 경우 문제가 더욱 복잡해질 수 있다.

이 기준은 최소 타겟 크기를 정의하지만 의도하지 않은 작업의 가능성을 줄이기 위해 더 큰 크기를 사용하는 것이 좋다. 이는 다음 중 하나라도 해당되는 경우 특히 관계가 있다.

  • 자주 사용되는 컨트롤인 경우
  • 쉽게 되돌릴 수 없는 상호 작용의 결과를 내는 경우
  • 컨트롤이 접근하기 어려운 위치에 있거나 화면 가장자리에 가까운 경우
  • 컨트롤은 순차적 작업의 일부인 경우

이점

  • 터치 스크린이 주요 상호 작용 모드인 모바일 장치를 사용하는 사용자
  • 손떨림 등 운동 장애가 있는 사용자
  • 미세한 움직임이 어려운 사용자
  • 한 손으로 기기에 접근하는 사용자
  • 손가락이 크거나, 손가락이나 관절의 일부만을 사용하여 기기를 조작하는 사용자
  • 저시력 사용자는 대상을 더 잘 볼 수 있다

예제

  • 예 1: 버튼
    세 개의 버튼이 화면에 표시되며 각 버튼의 대상 영역은 44 × 44 CSS 픽셀이다.

관련 자료

자료는 정보 제공 목적으로만 제공되며 보증을 암시하지 않는다.

기법

이 섹션에서 번호가 매겨진 각 항목은 WCAG 실무 그룹이 이 성공 기준을 충족하기에 충분하다고 간주하는 기법 또는 기법의 조합을 나타낸다. 그러나 이러한 특정 기법을 사용할 필요는 없다. 다른 기법 사용에 대한 자세한 내용은 WCAG 성공 기준에 대한 기법 이해, 특히 "기타 기법" 섹션을 참고하라.

충분 기법

아래에서 귀하의 콘텐츠와 일치하는 상황을 선택하라. 각 상황에는 해당 상황에 충분하다고 알려져 있고 문서화된 기법 또는 기법의 조합이 포함된다.

  • Ensuring that targets are at least 44 by 44 CSS pixels.
  • Ensuring inline links provide sufficiently large activation target.

조언 기법

준수를 위해 필수는 아니지만 콘텐츠에 더 쉽게 접근할 수 있도록 다음과 같은 추가 기법을 고려해야 한다. 모든 기법을 사용할 수 없거나 모든 상황에서 효과적인 것은 아니다.

  • none documented

오류

다음은 WCAG 실무 그룹에서 이 성공 기준의 실패로 간주하는 일반적인 실수이다.

  • Failure of success criterion 2.5.5 due to target being less than 44 by 44 CSS pixels.
맨 위로