Bảng màu dễ tiếp cận: ngừng dùng HSL trong hệ thống màu sắc

 (wildbit.com)
2 điểm bởi GN⁺ 2023-08-30 | 1 bình luận | Chia sẻ qua WhatsApp
  • Tác giả chia sẻ trải nghiệm tái cấu trúc hệ thống màu sắc tại Postmark và những vấn đề gặp phải với bảng màu trước đó.
  • Vấn đề chính của bảng màu cũ là độ sáng cảm nhận của màu không nhất quán và tỷ lệ tương phản khó dự đoán giữa các biến thể màu.
  • Tác giả giải thích rằng các vấn đề này bắt nguồn từ những hạn chế cố hữu của mô hình màu HSL và việc các công cụ thiết kế thiếu hỗ trợ cho những lựa chọn thay thế tốt hơn.
  • Tác giả giới thiệu các không gian màu CIELAB và LCh như những lựa chọn thay thế tốt hơn HSL, vì chúng được thiết kế để phản ánh cách con người cảm nhận độ sáng và độ bão hòa.
  • Tác giả giới thiệu ứng dụng Accessible Palette, một công cụ để xây dựng hệ thống màu sắc có độ sáng nhất quán và tỷ lệ tương phản có thể dự đoán được.
  • Ứng dụng này cho phép người dùng tùy chỉnh các mức độ sáng, kiểm soát tỷ lệ tương phản và tạo bảng màu dựa trên không gian màu RGB hoặc CIELAB.
  • Tác giả thảo luận về những thiếu sót của cách tính tỷ lệ tương phản theo WCAG 2.1 hiện tại và giới thiệu Advanced Perceptual Contrast Algorithm (APCA) được dùng trong ứng dụng.
  • Tác giả khuyến khích độc giả xây dựng hệ thống màu sắc bằng cách cân nhắc cả hướng dẫn của WCAG 2.1 và APCA để đạt tính sẵn sàng cho tương lai và tuân thủ quy định ở mức cao nhất có thể.
  • Tác giả nhấn mạnh lợi ích của việc sử dụng ứng dụng Accessible Palette và mời độc giả liên hệ bất cứ lúc nào nếu có câu hỏi hoặc phản hồi.

Bài viết liên quan

1 bình luận

 
GN⁺ 2023-08-30
Ý kiến Hacker News
  • Trên màn hình thông thường và trong các hệ thống in ấn, màu đỏ và xanh dương bão hòa tối hơn màu xanh lá.
  • Việc áp dụng các quy tắc tương phản giúp lựa chọn màu sắc dễ tiếp cận hơn, nhưng kỹ thuật trong bài này cho phép đưa ra những lựa chọn vừa dễ tiếp cận vừa hấp dẫn về mặt thị giác.
  • Màu xanh lá bão hòa trên màn hình không bão hòa như mức có thể đạt được, nhưng vẫn bão hòa hơn phần lớn các sắc xanh trong đời thực.
  • Sự cân bằng giữa các kênh đỏ và xanh lá trong cây cối và cỏ khiến chúng trông rất đẹp trong ảnh lập thể.
  • Các khuyến nghị về độ tương phản màu của WCAG 2.1 đôi khi có thể tạo ra kết quả khó đọc hơn so với các mẫu có độ tương phản không đủ.
  • Bài viết này cung cấp liên kết đến các tài liệu toàn diện về màu sắc.
  • Tác giả của bình luận sử dụng các ý tưởng trong bài này để tô màu log tại ClickHouse.
  • APCA được nhắc đến như một ứng viên kế nhiệm tiềm năng cho thuật toán tương phản màu của WCAG 2.
  • Khi làm việc với màu sắc, công cụ và thuật toán chỉ là các phép xấp xỉ toán học, vì vậy điều quan trọng là phải tin vào mắt mình.
  • Hàm CSS color() hỗ trợ nhiều không gian màu chứ không chỉ sRGB.
  • Bài viết đặt câu hỏi về các công thức tri giác liên quan đến khả năng tiếp cận và sự tương tác với chứng mù màu.
  • Đề xuất oklab như một phương án thay thế cho LCh.
  • APCA Contrast được nhắc đến trong bài được xem là công bằng hơn Contrast Ratio của WCAG 2.1 đối với một số màu.
  • Có thêm các tài liệu về lý thuyết màu sắc và APCA.
  • Tác giả muốn có một thuật toán có thể dùng cho mọi phần mềm, không chỉ các biểu mẫu web.
  • Trong một bài khác có nhắc đến HSY, mô hình màu được dùng trong bộ chọn màu nâng cao của Krita.