Setiap kali konten baru ditambahkan ke halaman, coba pastikan fokus pengguna diarahkan ke konten tersebut, sehingga mereka dapat mengambil tindakan.
Cara menguji secara manual
Aplikasi satu halaman penting untuk diuji, terutama dalam hal mengelola fokus pengguna pada konten baru.
Biasanya, di aplikasi web satu halaman,
mengklik link tidak akan menyebabkan hard refresh.
Sebagai gantinya,
perubahan rute akan mengambil data baru untuk area konten <main>.
Untuk pengguna berpenglihatan normal,
hal ini berfungsi dengan baik.
Namun, pengguna yang membuka dengan pembaca layar atau teknologi pendukung lainnya
mungkin tidak mengetahui bahwa konten baru
telah ditambahkan ke halaman.
Tidak ada indikasi bahwa pengguna harus menavigasi
kembali ke area <main>.
Saat hal ini terjadi, Anda perlu mengelola fokus pengguna agar konteks yang dirasakan pengguna tetap sinkron dengan konten visual situs.
Cara memperbaiki
Untuk mengelola fokus pengguna ke konten baru di halaman,
temukan judul yang bagus di konten yang baru dimuat dan arahkan fokus ke konten tersebut.
Cara termudah untuk melakukannya adalah dengan memberi judul tabindex dari -1
dan memanggil metode focus():
<main>
<h2 tabindex="-1">Welcome to your shopping cart</h2>
</main>
<script>
// Assuming this gets called every time new content loads...
function onNewPage() {
var heading = document.querySelector('h2');
heading.focus();
// You can also update the page title :)
document.title = heading.textContent;
}
</script>
Teknologi pendukung mengumumkan judul baru dan area terkenal utama tempatnya berada.
Lihat juga Mengelola fokus untuk aksesibilitas.
Referensi
Kode sumber untuk Fokus pengguna diarahkan ke konten baru yang ditambahkan ke audit halaman