กฎนี้ตรวจอะไร
ตรวจให้แน่ใจว่าองค์ประกอบในฟอร์มทุกรายการมีป้ายกำกับ.
ทำไมจึงสำคัญ
WCAG 1.3.1, 3.3.2 และ 4.1.2 กำหนดให้ช่องกรอกข้อมูลต้องมีป้ายกำกับ ช่องสมัครรับจดหมายข่าวและช่องค้นหามักเป็นต้นเหตุ
วิธีแก้ไข
- ใส่องค์ประกอบ <label for="field-id"> ให้ทุกช่อง หรืออย่างน้อยต้องมี aria-label
- ข้อความ placeholder เพียงอย่างเดียวไม่นับเป็นป้ายกำกับ
วิธีตรวจสอบการแก้ไข
- สแกนอีกครั้งและยืนยันว่ากฎ label ไม่พบข้อผิดพลาดอีก
- คลิกป้ายกำกับแต่ละรายการ และตรวจว่าโฟกัสย้ายไปที่ช่องของป้ายนั้น
FixReports ตรวจพบอย่างไร
การสแกนของเราเรียกใช้กฎ label ของ axe-core ในเบราว์เซอร์ Chrome จริงบนทุกหน้าที่ทดสอบ และรายงานองค์ประกอบที่ไม่ผ่านแต่ละรายการพร้อมหน้าที่พบ markup และภาพหน้าจอในกรณีที่มี
การทดสอบอัตโนมัติยืนยันได้ว่าปัญหานี้มีอยู่จริง แต่บอกไม่ได้ว่าส่วนอื่นของหน้าเข้าถึงได้หรือไม่ อุปสรรคบางอย่างจะปรากฏก็ต่อเมื่อมีคนตรวจหน้านั้นเท่านั้น