วิธีตรวจสอบความต่างสี
- 1
เลือกสีข้อความ
คลิกเครื่องมือเลือกสีแรกเพื่อเลือกสีข้อความของคุณ หรือป้อนรหัสเลขฐานสิบหกโดยตรง
- 2
เลือกสีพื้นหลัง
ใช้เครื่องมือเลือกสีที่สองเพื่อเลือกสีพื้นหลังสำหรับการทดสอบความต่างสี
- 3
ตรวจสอบผลลัพธ์ความต่างสี
ตรวจสอบอัตราส่วนความต่างสีที่คำนวณได้ และดูการให้คะแนน AA/AAA สำหรับข้อความปกติและข้อความขนาดใหญ่
- 4
ดูตัวอย่างการออกแบบของคุณ
ดูตัวอย่างแบบสดเพื่อดูว่าชุดสีของคุณมีลักษณะอย่างไรเมื่อใช้กับเนื้อหาข้อความจริง
คุณสมบัติหลัก
การทดสอบความต่างสีแบบเรียลไทม์
คำนวณอัตราส่วนความต่างสีได้ทันทีเมื่อคุณเลือกชุดสีข้อความและพื้นหลังที่แตกต่างกัน
การให้คะแนนตามมาตรฐาน WCAG
รับการให้คะแนน AA และ AAA สำหรับทั้งข้อความปกติและข้อความขนาดใหญ่ตามหลักเกณฑ์การเข้าถึงเนื้อหาเว็บ
แผงแสดงตัวอย่างแบบสด
ดูว่าชุดสีของคุณจะมีลักษณะอย่างไรเมื่อใช้กับข้อความตัวอย่างทั้งขนาดปกติและขนาดใหญ่
ตัวบ่งชี้คะแนนภาพ
ดูประสิทธิภาพความต่างสีของคุณด้วยแผนภูมิวงกลมที่เข้าใจง่าย แสดงคะแนนตั้งแต่ 0-100
เครื่องมือเลือกสีแบบโต้ตอบ
เลือกสีได้อย่างง่ายดายด้วยเครื่องมือเลือกสีในตัวสำหรับทั้งสีข้อความและสีพื้นหลัง
เคล็ดลับการเข้าถึง
รับคำแนะนำที่เป็นประโยชน์สำหรับการปรับปรุงความต่างสีและการปฏิบัติตามมาตรฐานการเข้าถึง
เครื่องมือตรวจสอบความต่างสีคืออะไร?
เครื่องมือตรวจสอบความต่างสีคือเครื่องมือที่ใช้วัดความแตกต่างของความสว่างระหว่างสีข้อความและสีพื้นหลัง โดยจะคำนวณอัตราส่วนความต่างสีตามมาตรฐาน WCAG (Web Content Accessibility Guidelines) เพื่อให้แน่ใจว่าเนื้อหาสามารถอ่านได้สำหรับผู้ใช้ที่มีความบกพร่องทางการมองเห็น รวมถึงผู้ตาบอดสีและผู้ที่มีสายตาเลือนราง
ทำไมถึงควรใช้เครื่องมือตรวจสอบความต่างสีของเรา?
- 1
การปฏิบัติตาม WCAG
มั่นใจว่าการออกแบบของคุณเป็นไปตามมาตรฐานการเข้าถึงสากลด้วยการให้คะแนน AA และ AAA ที่แม่นยำ
- 2
ข้อเสนอแนะแบบเรียลไทม์
ดูผลลัพธ์ทันทีเมื่อคุณปรับสี ทำให้ง่ายต่อการค้นหาชุดค่าผสมที่ตรงตามข้อกำหนด
- 3
ระบบคะแนนภาพ
ทำความเข้าใจประสิทธิภาพความต่างสีได้อย่างรวดเร็วด้วยระบบการให้คะแนน 0-100 ที่เข้าใจง่ายของเรา
- 4
ไม่ต้องติดตั้ง
ทดสอบชุดสีได้ทันทีในเบราว์เซอร์ของคุณโดยไม่ต้องดาวน์โหลดซอฟต์แวร์ใดๆ
คำถามที่พบบ่อย
อัตราส่วนความต่างสีที่ดีควรเป็นเท่าไหร่?
สำหรับข้อความปกติ ควรตั้งเป้าหมายที่ 4.5:1 เป็นอย่างน้อยสำหรับการปฏิบัติตามมาตรฐาน AA หรือ 7:1 สำหรับ AAA ส่วนข้อความขนาดใหญ่ (18pt หรือ 14pt ตัวหนา) ต้องการ 3:1 สำหรับ AA หรือ 4.5:1 สำหรับ AAA
การให้คะแนน AA และ AAA หมายถึงอะไร?
AA คือระดับมาตรฐานของการปฏิบัติตามข้อกำหนดการเข้าถึงที่ระเบียบส่วนใหญ่กำหนด AAA คือระดับสูงสุด ซึ่งให้การเข้าถึงที่เพิ่มขึ้นสำหรับผู้ใช้ที่มีความบกพร่องทางการมองเห็นที่รุนแรงกว่า
อัตราส่วนความต่างสีคำนวณอย่างไร?
อัตราส่วนความต่างสีคำนวณโดยใช้ค่าความสว่างสัมพัทธ์ของสีตามที่กำหนดโดยหลักเกณฑ์ WCAG มีค่าตั้งแต่ 1:1 (ไม่มีความต่างสี) ถึง 21:1 (ความต่างสีสูงสุด)
ข้อความขนาดใหญ่หมายถึงอะไร?
ข้อความขนาดใหญ่หมายถึงข้อความขนาด 18 พอยต์ (24px) หรือใหญ่กว่า หรือ 14 พอยต์ (18.66px) หรือใหญ่กว่าหากเป็นตัวหนา ข้อความขนาดใหญ่มีข้อกำหนดความต่างสีที่ยืดหยุ่นกว่า
ทำไมความต่างสีจึงสำคัญ?
ความต่างสีที่ดีช่วยให้เนื้อหาสามารถอ่านได้สำหรับทุกคน รวมถึงผู้ใช้ที่มีความบกพร่องทางการมองเห็น, ตาบอดสี, หรือผู้ที่ดูเนื้อหาในที่แสงแดดจ้าหรือบนจอแสดงผลที่ไม่ดี
ฉันสามารถใช้เครื่องมือนี้กับรูปแบบสีใดก็ได้หรือไม่?
เครื่องมือนี้รองรับรหัสสีฐานสิบหก (hex color codes) คุณสามารถแปลงจากรูปแบบอื่น ๆ (RGB, HSL ฯลฯ) เป็นรหัสเลขฐานสิบหกได้โดยใช้เครื่องมือแปลงออนไลน์หรือเครื่องมือออกแบบ