ประมาณ 8% ของผู้ชายและ 0.5% ของผู้หญิงมีภาวะบกพร่องในการมองเห็นสีในรูปแบบใดรูปแบบหนึ่ง เครื่องมือนี้จำลองว่าภาพของคุณจะปรากฏต่อผู้ที่มีภาวะแต่ละประเภทที่พบบ่อย — โปรตาโนเปีย (ตาบอดสีแดง), ดิวเทอแรโนเปีย (ตาบอดสีเขียว), ไตรตาโนเปีย (ตาบอดสีน้ำเงิน) และภาวะตาบอดสีสมบูรณ์ (ระดับสีเทา) ใช้กับแผนภูมิ ภาพหน้าจอ UI หรือรูปภาพ เพื่อตรวจจับความล้มเหลวในการเข้าถึงที่มองไม่เห็นก่อนที่ผู้ใช้จะพบ
แต่ละประเภทหมายถึงอะไร
- โปรตาโนเปีย (1% ของผู้ชาย): ไม่สามารถเห็นสีแดง สีแดงปรากฏเป็นสีเทาเข้มอมเหลือง
- ดิวเทอแรโนเปีย (1% ของผู้ชาย): ไม่สามารถเห็นสีเขียว เป็นรูปแบบที่พบบ่อยที่สุด สีแดงและสีเขียวดูคล้ายกัน
- ไตรตาโนเปีย (พบได้ยากมาก): ไม่สามารถเห็นสีน้ำเงิน สีน้ำเงินและสีเหลืองดูคล้ายกัน
- อะโครมาโตปเซีย (พบได้ยากยิ่ง): ไม่มีการมองเห็นสีเลย — เป็นระดับสีเทาล้วน
- อะนอมอลัสไตรโครเมซี่ (5% ของผู้ชาย): ความไวต่อสีลดลง ไม่ใช่ไม่มีเลย เราจำลองกรณีปานกลาง
สิ่งที่ควรสังเกต
- คำอธิบายแผนภูมิที่อาศัยสีเพียงอย่างเดียว เส้นสีแดงและสีเขียวแยกไม่ออกสำหรับผู้ที่มีดิวเทอแรโนเปีย
- ข้อผิดพลาดในฟอร์มที่ทำเครื่องหมายด้วยสีแดงเท่านั้น ควรจับคู่กับไอคอนหรือป้ายข้อความ
- ตัวบ่งชี้สถานะ รูปแบบสัญญาณไฟจราจรสีแดง/เหลือง/เขียวเป็นกรณีที่แย่ที่สุด
- แผนภูมิวงกลมและแท่งซ้อน ชิ้นส่วนที่อยู่ติดกันในเฉดสีใกล้เคียงจะสูญเสียขอบเขต
ใช้ควบคู่กับเครื่องมือตรวจสอบความคมชัด
ภาวะตาบอดสีเป็นแกนหนึ่งของการเข้าถึง ความคมชัดเป็นอีกแกนหนึ่ง เรียกใช้ เครื่องมือตรวจสอบความคมชัด บนภาพหน้าจอเดียวกันเพื่อตรวจสอบการปฏิบัติตาม WCAG AA / AAA สำหรับคู่พื้นหน้า/พื้นหลัง
กรณีการใช้งาน: การแสดงข้อมูล
ชุดสีแผนภูมิเริ่มต้น (tab10 ของ matplotlib, ค่าเริ่มต้นของ Excel) รวมถึงคู่ที่มีปัญหา เรียกใช้แดชบอร์ดของคุณผ่านเครื่องมือนี้และดูว่าชุดข้อมูลใดชนกัน คำแนะนำทดแทน: viridis, cividis, ชุดสีแยกที่เข้าถึงได้ของ ColorBrewer
คำถามที่พบบ่อย
การจำลองนี้แม่นยำแค่ไหน?
เป็นการประมาณตามการรับรู้ที่อิงจากงานวิจัยที่ตีพิมพ์ (Brettel et al.) ผู้ใช้ที่มีความบกพร่องในการมองเห็นสีจริงอาจเห็นความแตกต่างเล็กน้อย แต่การประมาณนี้ดีพอที่จะจับข้อบกพร่องในการออกแบบได้
รองรับรูปแบบไฟล์นำเข้าอะไรบ้าง?
JPG, PNG, WebP, HEIC. สูงสุด 25 MB. ใช้ได้กับภาพถ่าย, ภาพหน้าจอ, ไฟล์ดีไซน์.
ฉันสามารถดาวน์โหลดทั้งสี่การจำลองพร้อมกันได้หรือไม่?
ได้ — ส่งออกเป็น PNG แบบตาราง 2×2 ที่แสดงทั้งสี่ภาพเคียงข้างกัน พร้อมกับภาพต้นฉบับ มีประโยชน์สำหรับการแชร์ในการตรวจสอบการออกแบบ
ใช้กับวิดีโอได้ไหม?
ไม่ ได้เฉพาะรูปภาพเท่านั้น สำหรับวิดีโอ ให้จำลองเฟรมที่เป็นตัวแทนหนึ่งเฟรม
ทำไมสีแดงของฉันถึงดูเป็นสีน้ำตาล?
นั่นคือภาวะตาบอดสีเขียว (deuteranopia) — กรวยสีสำหรับสีเขียวลดลง ทำให้สีแดงเปลี่ยนเป็นสีน้ำตาลและสีเหลืองเข้ม
แล้ว GIF แบบเคลื่อนไหวล่ะ?
เราประมวลผลเฉพาะเฟรมแรกเท่านั้น หากคุณต้องการลำดับทั้งหมด ให้รันเฟรมนิ่งแยกต่างหาก
ใช้สำหรับวินิจฉัยตาบอดสีหรือไม่?
ไม่ — นี่คือเครื่องมือออกแบบ แผ่นทดสอบ Ishihara สำหรับวินิจฉัยต้องใช้ในสถานพยาบาล
แนวทาง WCAG เกี่ยวกับสีคืออะไร?
WCAG 1.4.1 ระบุว่า 'สีไม่ควรถูกใช้เป็นวิธีเดียวในการสื่อสารข้อมูลทางภาพ' ควรจับคู่สีกับรูปร่าง ป้ายกำกับ หรือลวดลายเสมอ
เกี่ยวกับ เครื่องมือจำลองตาบอดสี
เครื่องมือจำลองตาบอดสี เป็นเครื่องมือออนไลน์ฟรีจาก Wallpapers.com ที่ทำงานในเบราว์เซอร์ของคุณเท่านั้น — ไม่ต้องติดตั้ง ไม่มีลายน้ำ ไม่ต้องลงทะเบียนอีเมลสำหรับการลองครั้งแรก
ดูตัวอย่างว่าการออกแบบของคุณจะปรากฏต่อผู้ที่มีความบกพร่องในการมองเห็นสี
วิธีใช้ เครื่องมือจำลองตาบอดสี
- เลือกสีจากตัวอย่างสี หรือวางค่า HEX/RGB
- ปรับผลลัพธ์ — จานสี ความคมชัด สีคู่ตรงข้าม
- คัดลอกค่า หรือส่งออกตัวอย่างสีเป็น JSON
เมื่อใดควรใช้
กรณีการใช้งานทั่วไปได้แก่:
เตรียมรูปภาพสำหรับอัปโหลดเว็บ, รายการสินค้าอีคอมเมิร์ซ, แพลตฟอร์มโซเชียลมีเดียที่มีข้อจำกัดรูปแบบ, และแปลงไฟล์จากอุปกรณ์หรือแอปหนึ่งไปยังอีกอุปกรณ์หนึ่ง
ฟรี vs พรีเมียม
ผู้เยี่ยมชมทุกคนได้รับทดลองใช้ฟรี; ผู้ใช้ที่ลงชื่อเข้าใช้ฟรีได้รับโควต้ารายวันสูงกว่า สมัครสมาชิก
พรีเมียม
เพื่อการใช้งานไม่จำกัด, ประมวลผลเป็นกลุ่มสูงสุด 200 รูปต่องาน, คิวลำดับความสำคัญ, และการเรียกดูไม่มีโฆษณา
เครื่องมือที่เกี่ยวข้อง
กำลังมองหาสิ่งที่แตกต่างเล็กน้อย? ลอง
ตัวเลือกสีจากรูปภาพ
,
ตัวดึงจานสี
หรือ
เครื่องมือสร้างเกรเดียนต์
— หรือเรียกดูทั้งหมด
เครื่องมือสี เครื่องมือ.