Mulai dari tugas dan arsitektur informasi yang kecil
Arsitektur informasi adalah cara konten dan fungsi dikelompokkan, dinamai, dan dihubungkan. Daftarkan tugas pengunjung, lalu petakan halaman awal masing-masing tugas, halaman berikutnya, dan kondisi akhir yang dianggap sukses. Ini menunjukkan apakah item menu berguna atau sekadar label internal yang harus diuraikan pengunjung. Jaga navigasi utama tetap fokus pada bagian yang memulai tugas tersebut.
Navigasi bukanlah peta situs. GOV.UK menyarankan untuk mencantumkan bagian tingkat atas yang berguna daripada setiap bagian layanan. Ketika sebuah perjalanan mempunyai urutan yang wajib diikuti, tampilkan itu di konten atau daftar tugas daripada memaksa orang menafsirkannya dari menu global.
Satukan halaman saat pengunjung mengharapkan jawaban atau tugas yang sama, bukan karena satu tim memilikinya.
Gunakan halaman pendaratan dan tautan kontekstual untuk detail daripada header yang padat.
Gunakan label yang memprediksi tujuan
Sebuah label adalah janji tentang apa yang akan mengikuti. Utamakan nama yang familier seperti “Harga”, “Dokumentasi”, “Dapatkan dukungan”, atau “Kelola akun” ketika cocok dengan tujuan. Hindari label samar seperti “Sumber daya” atau “Jelajahi” kecuali pengunjung dapat memprediksi isinya. Jaga kata dan urutan konsisten.
Google menganjurkan teks tautan yang singkat dan relevan yang dapat dipahami di luar konteks. “Klik di sini” yang generik dan tautan yang diisi kata kunci sama-sama tidak efektif. Beri kontrol hanya-ikon nama aksesibilitas yang menjelaskan tindakannya.
Gunakan “Lihat paket” daripada “Pelajari lebih lanjut” ketika tujuan adalah halaman paket.
Tandai tujuan aktif secara visual dan programatik; W3C menggambarkan aria-current=page untuk halaman yang sedang ditampilkan.
Buat tujuan dapat di-crawl dan struktur yang jelas
Tujuan navigasi sebaiknya biasanya berupa anchor HTML dengan atribut href yang merujuk ke alamat web nyata. Google mengatakan umumnya dapat merayapi bentuk ini, termasuk anchor yang disisipkan secara dinamis ketika markup yang dirender mempertahankan struktur tersebut. Handler klik atau atribut khusus saja bukan pengganti yang dapat diandalkan. Periksa output yang dirender, bukan hanya kode sumber framework.
Gunakan struktur semantik di sekitar navigasi utama. W3C merekomendasikan elemen nav dan, untuk navigasi situs biasa, sebuah daftar. Jika sebuah halaman memiliki beberapa wilayah navigasi, beri label masing-masing sehingga pengguna pembaca layar dapat membedakan navigasi utama dari footer atau navigasi lokal.
Konfirmasi destinasi penting di desktop dan mobile memiliki anchor dan nilai href setelah client-side rendering.
URL Inspection memberikan informasi perayapan, pengindeksan, dan penyajian Google; itu tidak membuktikan bahwa pengunjung dapat menemukan sebuah halaman.
Rancang menu seluler sebagai interaksi lengkap
Navigasi responsif boleh mengumpul, tetapi destinasi yang tetap harus mempertahankan kata, urutan, dan target yang sama di semua ukuran layar. W3C memperbolehkan penggambungan atau penyembunyian item subnavigasi sambil meminta konsistensi. Jangan membuat jalur kritis hanya untuk desktop karena header terlalu padat; pindahkan materi prioritas rendah atau pertimbangkan ulang hierarki.
Untuk menu yang tampil/sembunyi, gunakan tombol untuk mengontrol grup tautan dan komunikasikan apakah grup tersebut terbuka. Contoh disclosure-navigation W3C menggunakan aria-expanded dan aria-controls serta mendokumentasikan Tab, Shift+Tab, dan Escape. Itu bersifat instruksional, jadi uji komponen Anda dengan kombinasi yang digunakan audiens Anda.
Ketika halaman induk dan tautan anaknya sama-sama diperlukan, bedakan tautan halaman dari kontrol yang memperluasnya.
Apa pun yang ditampilkan oleh pointer hover harus dapat ditemukan dengan fokus keyboard dan sentuhan.
Dukung orientasi dan perjalanan keyboard
Akses keyboard bukanlah sentuhan akhir. WCAG 2.1 Success Criterion 2.1.1 mensyaratkan fungsionalitas dapat dioperasikan melalui antarmuka keyboard kecuali untuk input yang bergantung pada jalur. Dalam header, pengunjung harus bisa Tab melalui kontrol, melihat fokus, mengaktifkan tautan dan tombol, serta bergerak pergi tanpa terjebak.
Tautan header yang diulang dapat membuat halaman lambat untuk dilintasi. Sebuah skip link dekat awal memberi pengguna keyboard jalur ke konten utama. GOV.UK menjelaskan bahwa itu disembunyikan secara visual hingga penggunaan keyboard mengaktifkannya. Uji bahwa tautan tersebut mendarat pada target yang bermakna.
Jangan menghapus indikator fokus browser tanpa alternatif yang jelas yang tetap terlihat saat diperbesar.
Gunakan Tab, Shift+Tab, Enter, Space, dan Escape dari header ke halaman tujuan.
Uji ketertemuan sebelum dan setelah rilis
Minta orang representatif menyelesaikan tugas realistis, seperti menemukan panduan pembatalan atau membandingkan paket. Amati ke mana mereka mengharapkan pergi, label mana yang mereka salah baca, dan apakah mereka beralih ke pencarian karena navigasi mengecewakan. Jangan arahkan mereka ke label yang dimaksud. Catat setiap hambatan dan perubahan terkecil yang kemungkinan menghilangkannya.
Padukan pengujian tugas dengan pemeriksaan teknis. Easy Checks W3C merekomendasikan pengujian tanpa mouse, termasuk visibilitas fokus, urutan tab, perangkap keyboard, dan dropdown. Ulangi tugas inti pada lebar sempit dan ukuran teks besar. Pemeriksaan otomatis dapat menandai masalah markup, tetapi tidak bisa membuktikan bahwa sebuah label masuk akal.
Catat titik akhir yang dimaksud dan perangkat atau metode input yang didukung sebelum pengujian.
Uji rute lama dan baru terhadap tugas yang sama daripada mengandalkan preferensi pemangku kepentingan.
Perlakukan perubahan navigasi sebagai rilis yang sensitif terhadap ketersediaan
Sebuah header dapat memuat sementara jalur kritis efektif tidak tersedia: checkout, login, rute dukungan, atau halaman dokumentasi mungkin berada di balik keadaan rusak, tautan kadaluarsa, atau redirect yang salah. Sebelum rilis, inventarisasikan destinasi kritis, uji rute desktop dan mobile, dan konfirmasi tautan yang dirender mencapai halaman yang dimaksud. Gunakan lingkungan berwenang untuk jalur yang memerlukan autentikasi atau regional.
Peran SIU adalah remediasi proaktif: jalankan preflight, verifikasi jalur esensial setelah deployment, dan buat koreksi dapat dibalik. Simpan konfigurasi menu yang diberi versi, namakan orang yang dapat mengembalikannya, dan validasi jalur yang dipulihkan. Ini membatasi dampak rilis; ini tidak menggantikan riset kegunaan atau pemantauan status langsung.
Blokir publikasi ketika destinasi kritis hilang, salah, atau tidak dapat dijangkau dengan keyboard dan sentuh.
Dokumentasikan konfigurasi sebelumnya, pemilik, pemicu, dan langkah validasi sebelum merestrukturisasi.