กฎนี้ตรวจอะไร
ตรวจให้แน่ใจว่าลิงก์มีข้อความที่ระบุได้.
ทำไมจึงสำคัญ
WCAG 2.4.4 และ 4.1.2 กำหนดให้ลิงก์ต้องมีชื่อที่เข้าถึงได้ (accessible name) ซึ่งอธิบายจุดประสงค์ของลิงก์
วิธีแก้ไข
- ค้นหาลิงก์ที่ไม่มีชื่อ ส่วนใหญ่เป็นไอคอนหรือรูปภาพที่อยู่ในแท็ก <a>
- เพิ่มข้อความที่ซ่อนจากการมองเห็น (visually hidden) ภายในลิงก์ หรือเพิ่ม aria-label เช่น aria-label="Instagram" หรือ aria-label="Cart"
- หากลิงก์ครอบรูปภาพไว้ ให้ใส่ข้อความ alt ที่มีความหมายให้รูปภาพแทน
วิธีตรวจสอบการแก้ไข
- สแกนอีกครั้งและยืนยันว่า link-name หายไปแล้ว
- เปิดโปรแกรมอ่านหน้าจอ แล้วกด Tab ไปยังแต่ละลิงก์เพื่อฟังชื่อ
FixReports ตรวจพบอย่างไร
การสแกนของเราเรียกใช้กฎ link-name ของ axe-core ในเบราว์เซอร์ Chrome จริงบนทุกหน้าที่ทดสอบ และรายงานองค์ประกอบที่ไม่ผ่านแต่ละรายการพร้อมหน้าที่พบ markup และภาพหน้าจอในกรณีที่มี
การทดสอบอัตโนมัติยืนยันได้ว่าปัญหานี้มีอยู่จริง แต่บอกไม่ได้ว่าส่วนอื่นของหน้าเข้าถึงได้หรือไม่ อุปสรรคบางอย่างจะปรากฏก็ต่อเมื่อมีคนตรวจหน้านั้นเท่านั้น