ผ่านเกณฑ์ AA: เกณฑ์ข้อความทั่วไปและข้อความขนาดใหญ่

ทีมส่วนใหญ่เลือกทำตาม WCAG ระดับ AAสำหรับคอนทราสต์ ซึ่งเข้มงวดพอที่จะช่วยผู้ใช้จริง และเป็นไปได้จริงพอที่จะนำไปใช้งาน

สำหรับข้อความเนื้อหา AA กำหนดอย่างน้อย 4.5:1 ซึ่งครอบคลุมย่อหน้า ป้ายกำกับ และคำส่วนใหญ่บนหน้าเว็บ

ข้อความขนาดใหญ่หมายถึง 24px แบบปกติ หรือ 18.66px แบบหนา เมื่อมีขนาดดังกล่าว ตัวอักษรจะอ่านง่ายขึ้น กฎจึงผ่อนคลายลง

ข้อความขนาดใหญ่ต้องการเพียง 3:1 รูปทรงที่ใหญ่กว่ามีน้ำหนักทางสายตามากกว่า ความแตกต่างด้านความสว่างที่น้อยลงจึงยังอ่านได้ชัดเจน

น้ำหนักตัวอักษรมีความสำคัญ: ข้อความ ตัวหนานับเป็นข้อความขนาดใหญ่ได้ตั้งแต่ 18.66px เพราะเส้นที่หนากว่าช่วยให้ดวงตาจับได้ง่ายขึ้น

WCAG กำหนดข้อความขนาดใหญ่ว่า 18pt หรือ 14pt แบบหนา ซึ่งตรงกับ 24px และ 18.66px ใน CSS โดยทั่วไปเครื่องมือจะช่วยแปลงค่าให้

ปุ่ม อินพุต และตัวบ่งชี้โฟกัสต้องมีค่า 3:1 เมื่อเทียบกับบริเวณโดยรอบตามเกณฑ์ 1.4.11 เพื่อให้มองเห็นตัวควบคุมได้

ต้องการการรับประกันที่เข้มงวดยิ่งขึ้นหรือไม่ AAAเพิ่มเกณฑ์ข้อความปกติเป็น 7:1 และข้อความขนาดใหญ่เป็น 4.5:1 แต่ผลิตภัณฑ์ส่วนใหญ่ตั้ง AA เป็นพื้นฐาน

บางสิ่งไม่ต้องทำตามกฎนี้ ได้แก่ ตัวควบคุมที่ ปิดใช้งาน การตกแต่งล้วน ๆ และโลโก้แบรนด์ ซึ่งไม่มีข้อกำหนดคอนทราสต์ขั้นต่ำ

ตัวยึดตำแหน่งสีเทาจางนั้นเป็นข้อความจริง จึงต้องมีค่า 4.5:1 เช่นกัน ค่าเริ่มต้นส่วนใหญ่มักไม่ผ่าน ดังนั้นควรทำให้เข้มขึ้นโดยตั้งใจ

หัวข้อนี้มีขนาดตามเกณฑ์ ข้อความขนาดใหญ่ ดังนั้นอัตราส่วน 3:1 ก็เพียงพอให้ผ่าน AA

จำตัวเลขคู่นี้ไว้: 4.5:1สำหรับข้อความปกติ และ 3:1 สำหรับข้อความขนาดใหญ่หรือส่วนประกอบส่วนติดต่อผู้ใช้ ทำให้ผ่านตัวเลขเหล่านี้ แล้วคอนทราสต์ของคุณจะผ่าน AA ต่อไป: อย่าพึ่งพาสีเพียงอย่างเดียว 🎯