CSS pixel[CSS 픽셀]

WCAG2

---

약 0.0213도의 시야각

CSS 픽셀은 CSS의 모든 길이와 측정을 위한 표준 측정 단위이다. 이 단위는 밀도와 무관하며, 디스플레이에서 제시되는 실제 하드웨어 픽셀과는 구별된다. 사용자 에이전트와 운영체제는 CSS 픽셀이 디스플레이의 물리적 치수 및 예상 시청거리(콘텐츠 개발자가 결정할 수 없는 요소)를 고려한 CSS 값 및 단위 모듈 레벨 3 준거 픽셀 [css3 값(css3-values)]에 최대한 가깝게 설정되었는지 확인해야 한다.

WCAG2ICT 웹이 아닌 문서 및 소프트웨어에 적용할 경우

참고 1(추가됨)

웹이 아닌 소프트웨어와 해당 플랫폼 소프트웨어는 CSS 픽셀 단위를 사용하지 않는다. 따라서 CSS 기준 픽셀에 근접한 플랫폼 정의 밀도 독립 픽셀 단위(플랫폼별 기준 픽셀, density-independent pixel)를 사용해야 한다. 플랫폼별 기준 픽셀의 예로는 iOS 및 macOS의 포인트(pt), Android의 밀도 독립 픽셀(dp, density-independent pixel), Windows의 유효 픽셀(epx, effective pixels)이 있다.

참고 2(추가됨)

다음과 같은 경우에는 플랫폼별 기준 픽셀 단위가 정의되지 않을 수 있다.

• 키오스크나 사무기기와 같이 특정 하드웨어를 대상으로 설계된 소프트웨어로, 작성자가 실제 화면 크기와 픽셀 밀도를 알고 있는 경우
• 스마트 TV 플랫폼의 스트리밍 앱처럼, 작성자가 실제 화면 크기는 알 수 없지만 적절한 시청 거리 또는 시청 각도를 알고 있는 경우

플랫폼 정의 밀도 독립 픽셀이 없는 경우, 기준 픽셀 크기를 다음과 같은 방법으로 추정할 수 있다.

• 사용 사례와 디스플레이 유형에 적합한 시청 거리를 설정한다. 예를 들어 터치스크린의 경우 일반적으로 팔 길이보다 짧은 약 28인치(71cm)의 시청 거리를 기준으로 한다.

• 기준 픽셀 크기를 계산한다: 시청 거리를 2688로 나눈다. 여기서 2688이라는 수치는 28인치(팔 길이)를 기준 픽셀 크기인 1/96인치로 나눈 값이다.

  역자주 28인치(약 71cm)거리의 96dpi인 화면에서 보이는 총합을 2688픽셀로 계산함.
  2688 = 28 ÷ (1/96) = 28 × 96

참고 3(추가됨)

대부분의 소프트웨어와 장치는 둘 이상의 시청 거리에서 사용될 수 있다. 그러나 해당 제품에 대해 현실적인 시청 거리만을 기준 픽셀의 근사값 산정에 활용할 수 있다. 예를 들어 터치스크린에서 사용하는 소프트웨어의 경우, 시야각 기준 픽셀이 0.11인치(0.28mm)보다 크다면 이는 팔 길이보다 먼 시청 거리를 전제로 한 것이므로 현실적이지 않다.

역자주 예제는 DPI가 매우 낮은 경우를 상정한 것이며, 터치스크린 기기에는 현실적이지 않은 설정임을 설명하는 내용이다.

참고 4(추가됨)

저시력 사용자는 표준 시청 거리보다 가까이에서 장치를 사용하는 경우가 많다. 하지만 밀도 독립 픽셀은 일반적인 시청 거리를 기준으로 설정해야 다양한 사용자의 요구를 균형 있게 반영할 수 있다.

시청 거리가 길어지면 뷰포트는 더 적은 수의 큰 픽셀로 측정되어 성공 기준 1.4.10(재정렬)의 요구 수준이 낮아지고, 시청 거리가 짧아지면 UI 구성 요소는 더 많은 작은 픽셀로 측정되어 성공 기준 2.5.8(타겟 크기) 등의 기준이 덜 엄격해질 수 있다.

역자주 시청 거리가 달라져도 화면의 실제 해상도는 바뀌지 않는다. 하지만 기준 픽셀은 시청 거리와 시야각(visual angle)에 따라 크기가 달라지므로, 시청 거리가 멀어지면 같은 화면이라도 더 큰 픽셀로 계산되며 가상의 해상도가 달라진 것처럼 해석된다.