องค์ประกอบแบบอินเทอร์แอกทีฟ เช่น ลิงก์และปุ่ม ควรระบุสถานะและแยกความแตกต่างจากองค์ประกอบแบบไม่อินเทอร์แอกทีฟได้ หากต้องการตรวจสอบว่าองค์ประกอบแบบอินเทอร์แอกทีฟระบุวัตถุประสงค์และสถานะแล้ว ให้ใช้ทั้งการทดสอบภาพและโปรแกรมอ่านหน้าจอ
วิธีทดสอบด้วยตนเอง
คุณควรทดสอบองค์ประกอบแบบอินเทอร์แอกทีฟด้วยภาพและด้วยโปรแกรมอ่านหน้าจอ
ทดสอบโฟกัสภาพ
หากต้องการทดสอบการโฟกัสภาพด้วยตนเอง ให้กด TAB ผ่านหน้า
- คุณสามารถกด TAB กับองค์ประกอบแบบอินเทอร์แอกทีฟแต่ละรายการได้ไหม
- เมื่อคุณไปที่องค์ประกอบแบบอินเทอร์แอกทีฟ มีสิ่งบอกใบ้ที่มองเห็นได้ซึ่งบ่งบอกว่าผู้ใช้โต้ตอบกับองค์ประกอบนั้นได้หรือไม่
- องค์ประกอบแบบอินเทอร์แอกทีฟแต่ละรายการมีการเปลี่ยนแปลงลักษณะที่ปรากฏเมื่อคุณเลือกหรือไม่
การจัดรูปแบบตัวบ่งชี้โฟกัสสำหรับองค์ประกอบแบบอินเทอร์แอกทีฟแต่ละรายการทำได้หลายวิธี
วิธีหนึ่งคือการจัดสไตล์คลาสจำลอง :focus
และจะใช้รูปแบบดังกล่าวทุกครั้งที่โฟกัสองค์ประกอบ
โดยไม่คำนึงถึงอุปกรณ์อินพุตหรือวิธีการที่ใช้โฟกัส
ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีจัดรูปแบบโฟกัส
ทดสอบด้วยโปรแกรมอ่านหน้าจอ
ใช้โปรแกรมอ่านหน้าจอเพื่อไปยังส่วนต่างๆ ของหน้าเว็บและตรวจสอบว่าโปรแกรมอ่านหน้าจออ่านชื่อของตัวควบคุมแบบอินเทอร์แอกทีฟแต่ละรายการ บทบาทของตัวควบคุมนั้น และสถานะการโต้ตอบในปัจจุบัน หากบทบาทขององค์ประกอบไม่ชัดเจนและสถานะขององค์ประกอบไม่ชัดเจน คุณอาจต้องเพิ่มบทบาท ARIA ที่เหมาะสม
ดูข้อมูลเพิ่มเติมในการควบคุมที่กำหนดเองมีบทบาท ARIA
นอกจากนี้ คุณควรให้ความสำคัญกับวิธีติดป้ายกำกับองค์ประกอบแบบอินเทอร์แอกทีฟด้วย ผู้ใช้โปรแกรมอ่านหน้าจอและเทคโนโลยีความช่วยเหลือพิเศษอื่นๆ อาศัยป้ายกำกับเพื่อทำความเข้าใจบริบทขององค์ประกอบนั้น ป้ายกำกับที่คลุมเครือนั้นพบได้ทั่วไปและไม่มีประโยชน์ในการไปยังส่วนต่างๆ ของเนื้อหา ดูวิธีปรับปรุงป้ายกำกับและข้อความแสดงแทน
ความสำคัญ
การแสดงคำแนะนำแบบเห็นภาพว่าตัวควบคุมสามารถช่วยให้ผู้ใช้ทำงานและไปยังส่วนต่างๆ ของเว็บไซต์ได้ คำแนะนำเหล่านี้เรียกว่าค่าใช้จ่าย ความสามารถในการใช้งานช่วยให้ผู้ใช้ใช้เว็บไซต์ของคุณในอุปกรณ์ที่หลากหลายได้
แหล่งข้อมูล
ซอร์สโค้ดสำหรับการตรวจสอบองค์ประกอบแบบอินเทอร์แอกทีฟระบุวัตถุประสงค์และสถานะ