ผู้ใช้หลายคนใช้แป้นพิมพ์เพื่อไปยังส่วนต่างๆ ของแอปพลิเคชัน ตั้งแต่ผู้ใช้ที่มีความบกพร่องทางการเคลื่อนไหวชั่วคราวและถาวร ไปจนถึงผู้ใช้ที่ใช้แป้นพิมพ์ลัดเพื่อให้ทำงานได้อย่างมีประสิทธิภาพมากขึ้น ลำดับแท็บที่สมเหตุสมผลเป็นส่วนสำคัญในการสร้างประสบการณ์การไปยังส่วนต่างๆ ด้วยแป้นพิมพ์ที่ราบรื่น
วิธีทดสอบด้วยตนเอง
หากต้องการตรวจสอบว่าลําดับแท็บของแอปพลิเคชันเป็นไปตามตรรกะหรือไม่ ให้ลองกด Tab ไปยังส่วนต่างๆ ของหน้า ลำดับที่โฟกัสองค์ประกอบควรเป็นไปตามลำดับ DOM โดยทั่วไปแล้ว โฟกัสควรเป็นไปตามลำดับการอ่าน โดยเริ่มจากซ้ายไปขวา จากบนลงล่างของหน้า
ดูข้อมูลเพิ่มเติมในพื้นฐานเกี่ยวกับการเข้าถึงด้วยแป้นพิมพ์
คุณเข้าถึงตัวควบคุมแบบอินเทอร์แอกทีฟทั้งหมดในหน้าเว็บได้ไหม
หากไม่ใช่ คุณอาจต้องใช้ tabindex
เพื่อปรับปรุงความสามารถในการโฟกัสของการควบคุมเหล่านั้น
หลักการทั่วไปคือตัวควบคุมที่ผู้ใช้โต้ตอบหรือป้อนข้อมูลได้ควรโฟกัสได้และแสดงตัวบ่งชี้โฟกัส
หากผู้ใช้แป้นพิมพ์ไม่เห็นสิ่งที่โฟกัสอยู่ ผู้ใช้จะโต้ตอบกับหน้าเว็บไม่ได้
วิธีแก้ไข
หากลําดับโฟกัสดูไม่ถูกต้อง คุณควรจัดเรียงองค์ประกอบใน DOM ใหม่เพื่อให้ลําดับแท็บดูเป็นธรรมชาติมากขึ้น
หากเข้าถึงตัวควบคุมแบบอินเทอร์แอกทีฟทั้งหมดในหน้าไม่ได้ วิธีแก้ปัญหาแรกคือการแทนที่ตัวควบคุมที่กำหนดเองด้วยทางเลือก HTML มาตรฐาน
เช่น แทนที่ <div>
ที่ทํางานเหมือนปุ่มด้วย <button>
การใช้องค์ประกอบ HTML ในตัวจะช่วยปรับปรุงการเข้าถึงเว็บไซต์ได้อย่างมาก และช่วยลดภาระงานของคุณได้เป็นอย่างมาก
หากคุณกำลังสร้างคอมโพเนนต์แบบอินเทอร์แอกทีฟที่กําหนดเองซึ่งไม่มีรายการที่เทียบเท่าใน HTML มาตรฐาน ให้ใช้แอตทริบิวต์ tabindex
เพื่อให้เข้าถึงด้วยแป้นพิมพ์ได้
เช่น
<div tabindex="0">Focus me with the TAB key</div>
ดูข้อมูลเพิ่มเติมในควบคุมโฟกัสด้วย tabindex