Banyak pengguna yang berbeda mengandalkan {i>keyboard <i} untuk menavigasi aplikasi, dari pengguna yang menderita gangguan motorik sementara dan permanen bagi pengguna yang menggunakan pintasan keyboard agar lebih efisien dan produktif. Urutan tab yang logis adalah bagian penting dalam memberikan pengalaman navigasi {i>keyboard<i} yang lancar.
Cara menguji secara manual
Untuk memeriksa apakah urutan tab aplikasi Anda logis, coba telusuri halaman Anda dengan menekan tombol tab. Urutan fokus elemen harus bertujuan untuk mengikuti urutan DOM. Secara umum, fokus harus mengikuti urutan membaca, bergerak dari kiri ke kanan, dari bagian atas ke bagian bawah halaman.
Pelajari lebih lanjut di Dasar-dasar akses keyboard.
Apakah Anda dapat menjangkau semua kontrol interaktif di halaman?
Jika tidak, Anda mungkin perlu menggunakan tabindex
untuk meningkatkan kemampuan fokus kontrol tersebut.
Aturan umumnya adalah kontrol apa pun yang dapat berinteraksi dengan
pengguna atau memberikan input ke
harus dapat difokuskan dan menampilkan indikator fokus.
Jika pengguna keyboard tidak dapat melihat apa yang difokuskan, mereka tidak dapat berinteraksi dengan halaman.
Cara memperbaiki
Jika urutan fokus tampak salah, Anda harus menyusun ulang elemen di DOM untuk membuat urutan tab lebih alami.
Jika Anda tidak dapat menjangkau semua
kontrol interaktif pada halaman,
langkah pertama yang harus diperbaiki adalah mengganti kontrol
khusus dengan alternatif HTML terstandardisasi.
Misalnya,
mengganti <div>
yang bertindak seperti tombol dengan <button>
.
Menggunakan elemen HTML bawaan dapat sangat meningkatkan aksesibilitas situs Anda,
dan mengurangi beban kerja Anda secara signifikan.
Jika Anda mem-build komponen interaktif kustom tanpa HTML standar yang setara,
gunakan atribut tabindex
untuk memastikan komponen tersebut dapat diakses dengan keyboard.
Contoh:
<div tabindex="0">Focus me with the TAB key</div>
Pelajari lebih lanjut di Mengontrol fokus dengan tabindex.
Resource
Kode sumber untuk audit Halaman memiliki urutan tab yang logis