Color Accessibility
สีที่ทุกคนเห็นชัดต้องผ่านเกณฑ์ contrast และไม่สื่อสารด้วยสีอย่างเดียว เผื่อคนตาบอดสี
เริ่มอ่านตรงนี้ก่อน
อธิบายแบบง่าย
Color Accessibility คือเรื่องที่ช่วยให้เราใช้ทำหน้าจอให้อ่านง่าย ใช้ง่าย และไม่สับสนได้ถูกทางขึ้น
ระดับ
เหมาะกับคนที่ต้องตรวจงานหรือวางมาตรฐาน
ใช้เมื่อไหร่
ตอนคุณตรวจ dashboard หรือฟอร์มก่อนส่งให้ทีมใช้จริง
อ่านแล้วทำอะไรต่อ
ในตารางสถานะ ให้ใส่ไอคอนถูก/ผิดหรือข้อความกำกับคู่กับสี เพื่อให้คนตาบอดสียังแยกออกได้
เห็นภาพ: ทริคนี้เป็นยังไง
- 1ไม่ใช้สีอย่างเดียวเพิ่มไอคอน / ข้อความกำกับ
- 2ตรวจ contrastตัวอักษรผ่าน 4.5:1
- 3ทดสอบตาบอดสีเขียว-แดงแยกออกไหม
- 4สถานะมีป้ายข้อความไม่ใช่แค่จุดสี
▶ เล่นอัตโนมัติ · ชี้เมาส์เพื่อหยุด · กดแถบด้านบนเพื่อข้ามขั้น
ใช้ตอนไหน?
- ตอนคุณตรวจ dashboard หรือฟอร์มก่อนส่งให้ทีมใช้จริง
- ตอนคุณสื่อสถานะหรือ error ด้วยสี
- ตอนคุณเลือกคู่สีของกราฟและป้ายกำกับ
ความหมาย
color accessibility (การเข้าถึงง่ายด้านสี) คือการออกแบบสีให้คนทุกกลุ่มใช้งานได้ รวมถึงผู้มีภาวะ color blindness (ตาบอดสี) หลักสำคัญสองข้อคือ ผ่านเกณฑ์ contrast (ความต่างของสี) ตามมาตรฐาน WCAG และไม่ใช้สีเป็นสัญญาณเดียวในการสื่อความหมาย
เช็กลิสต์สีที่เข้าถึงง่าย
ตรวจ contrast ก่อน แล้วเพิ่มสัญญาณอื่นนอกจากสี
1. ตัวอักษร contrast >= 4.5:1 (ปกติ), >= 3:1 (ใหญ่)
2. สถานะใช้ไอคอน/ข้อความควบคู่สี
3. เลี่ยงคู่แดง-เขียวเป็นตัวแยกหลักตัวอย่างการใช้
ไม่ใช้สีอย่างเดียว
ในตารางสถานะ ให้ใส่ไอคอนถูก/ผิดหรือข้อความกำกับคู่กับสี เพื่อให้คนตาบอดสียังแยกออกได้