GN⁺: 접근 가능한 팔레트: 색상 시스템에서 HSL 사용 중지
(wildbit.com)- 포스트마크에서 색상 시스템을 재구성한 경험과 이전 팔레트에서 겪은 문제를 작가가 공유합니다.
- 이전 팔레트의 주요 문제는 색상의 인식된 밝기의 일관성이 없고 색상 변형 간 예측할 수 없는 대비 비율입니다.
- 작가는 이러한 문제들이 HSL 색상 모델의 고유 결함과 디자인 도구에서 더 나은 대안에 대한 지원 부족으로 인해 발생했다고 설명합니다.
- 작가는 HSL 대신 인간의 밝기와 채도 인식을 반영하기 위해 설계된 CIELAB 및 LCh 색 공간을 더 나은 대안으로 소개합니다.
- 작가는 일관된 밝기와 예측 가능한 대비 비율을 갖는 색상 시스템을 구축하기 위한 도구인 Accessible Palette 앱을 소개합니다.
- 이 앱은 사용자가 밝기 수준을 사용자 정의하고 대비 비율을 제어하며 RGB 또는 CIELAB 색 공간을 기반으로 색상 팔레트를 생성할 수 있게 해줍니다.
- 작가는 현재 WCAG 2.1 대비 비율 계산의 결함을 논의하고 앱에서 사용되는 Advanced Perceptual Contrast Algorithm (APCA)를 소개합니다.
- 작가는 독자들에게 최대한 미래 지향적이고 규정 준수를 위해 WCAG 2.1과 APCA 지침을 모두 고려하여 색상 시스템을 구축해보라고 권장합니다.
- 작가는 Accessible Palette 앱 사용의 이점을 강조하며 질문이나 피드백이 있으면 언제든 연락하라고 독자들을 초대합니다.
Hacker News 의견
- 일반 디스플레이 및 인쇄 시스템에서 포화된 빨강과 파랑은 초록보다 어둡습니다.
- 대비 규칙을 적용하면 색상 선택이 접근 가능해지지만, 이 기사의 기술은 접근 가능하면서도 시각적으로 매력적인 선택을 가능하게 합니다.
- 포화된 화면 초록은 가능한 포화되지 않지만, 실제 생활에서의 대부분의 초록보다는 포화되어 있습니다.
- 나무와 풀에서 빨간색과 초록색 채널의 균형은 스테레오그램에서 멋지게 보이게 합니다.
- WCAG 2.1의 색상 대비 권장 사항은 때로는 충분한 대비가 없는 샘플보다 읽기 어려운 결과를 낼 수 있습니다.
- 이 기사는 색상에 대한 포괄적인 자료에 대한 링크를 제공합니다.
- 댓글의 작성자는 ClickHouse에서 로그를 색칠하는 데 이 기사의 생각을 활용합니다.
- APCA는 WCAG 2의 색상 대비 알고리즘의 잠재적인 후계자로 언급됩니다.
- 색상 작업 시 도구와 알고리즘은 단지 수학적 근사치에 불과하므로 눈을 믿는 것이 중요합니다.
- CSS color() 함수는 sRGB뿐만 아니라 다양한 색 공간을 지원합니다.
- 접근성과 색맹과의 상호작용에 대한 지각 공식에 대한 의문을 제기합니다.
- LCh 대신 oklab를 대안으로 제안합니다.
- 기사에서 언급된 APCA Contrast는 WCAG 2.1의 Contrast Ratio보다 일부 색상에 대해 더 공정하다고 여겨집니다.
- 색 이론과 APCA에 대한 추가 자료가 제공됩니다.
- 저자는 웹 폼뿐만 아니라 모든 소프트웨어에서 사용할 수 있는 알고리즘을 원합니다.
- Krita의 고급 색상 선택기에서 사용되는 색상 모델인 HSY에 대해 다른 기사에서 언급됩니다.