Meningkatkan kebolehgunaan dengan kunci navigasi tambahan

3

Takeaways Key

kekunci navigasi tambahan, seperti halaman, halaman-bawah, rumah, dan akhir, meningkatkan kebolehgunaan dengan memberikan lebih banyak kawalan dan membolehkan navigasi cepat ke atas kumpulan data yang besar. Kekunci ini boleh menjadi sangat berkesan dalam kawalan slider, di mana ia boleh digunakan untuk kenaikan atau nilai penurunan dengan perkadaran yang lebih besar atau menetapkan gelangsar ke minimum dan maksimum.

Tafsiran ketukan kekunci adalah bergantung kepada konteks dan harus dipertimbangkan dengan teliti apabila skrip. Secara umum, rumah bermakna minimum, mula atau pertama; Akhir bermaksud maksimum, akhir atau terakhir; Page-up bermakna kenaikan oleh bahagian atau pindah ke bahagian atau kumpulan seterusnya; Page-Down bermaksud pengurangan oleh bahagian atau pindah ke bahagian atau kumpulan sebelumnya.

Kekunci navigasi tambahan meningkatkan pengalaman pengguna dan kebolehcapaian, yang berpotensi membawa kepada peningkatan penglibatan pengguna, mengurangkan kadar lantunan, dan kadar penukaran yang lebih baik. Walau bagaimanapun, mereka perlu dilaksanakan secara intuitif dan tanpa menggembirakan pengguna untuk mengelakkan daripada mengurangkan pengalaman pengguna.

Semasa mengendalikan peristiwa papan kekunci di JavaScript, kebanyakan skrip dan aplikasi cenderung berpegang pada julat asas kunci yang memberikan akses teras-kunci tab untuk navigasi bersiri, kekunci anak panah untuk penggerudian atau untuk navigasi dua dimensi, dan dan Kekunci Enter dan Space untuk mengklik dan memilih perkara.
Ini semua baik, tetapi terdapat beberapa kunci umum lain yang mungkin anda pertimbangkan juga, yang dapat meningkatkan kebolehgunaan dengan memberikan lebih banyak kawalan-kunci halaman dan halaman-ke-bawah boleh digunakan untuk navigasi cepat ke atas kumpulan besar Data, sementara kunci rumah dan akhir boleh digunakan sebagai pintasan kepada nilai pertama dan terakhir.
Kebanyakan papan kekunci Windows mempunyai kunci khusus untuk ini, tetapi mereka juga bekerja di MAC melalui kombinasi pengubah. Sebagai contoh, pada MacBook saya terdapat kunci FN (fungsi) tambahan, dan ini digunakan dalam kombinasi dengan empat kekunci anak panah (mis. FN untuk halaman, dan FN ditinggalkan untuk rumah).

Kawalan slider

Kawalan slider adalah contoh yang sempurna di mana kunci ini boleh digunakan untuk memberi kesan yang baik. Kekunci anak panah biasanya digunakan untuk meningkatkan dan menurunkan slider dengan satu nilai, tetapi kita juga boleh menggunakan kunci halaman dan halaman ke bawah untuk menukar nilai dengan perkadaran yang lebih besar, serta kunci rumah dan akhir untuk ditetapkan gelangsar ke minimum dan maksimumnya.

Kod berikut adalah petikan dari Slider Seek milik pemain video:

<span>switch(true)
</span><span>{
</span>  <span>case (e.keyCode == 38 || e.keyCode == 39) : 
</span>    
    <span>if(++value > max) 
</span>    <span>{ 
</span>      value <span>= max; 
</span>    <span>}
</span>    <span>break;
</span>    
  <span>case (e.keyCode == 37 || e.keyCode == 40) : 
</span>    
    <span>if(--value     <span>{ 
</span>      value <span>= 0; 
</span>    <span>}
</span>    <span>break;
</span>    
  <span>case (e.keyCode == 33) : 
</span>    
    <span>if((value = value + Math.round(max / 10)) > max)
</span>    <span>{
</span>      value <span>= max;
</span>    <span>}
</span>    <span>break;
</span>    
  <span>case (e.keyCode == 34) : 
</span>    
    <span>if((value = value - Math.round(max / 10))     <span>{
</span>      value <span>= 0;
</span>    <span>}
</span>    <span>break;
</span>    
  <span>case (e.keyCode == 36) : 
</span>    
    value <span>= 0;
</span>    <span>break;
</span>    
  <span>case (e.keyCode == 35) : 
</span>    
    value <span>= (max - 1);
</span>    <span>break;
</span><span>}</span></span></span>

pernyataan suis menyesuaikan nilai slider (dan akibatnya, kedudukan mencari video) mengikut kunci acara-dengan satu langkah untuk kekunci anak panah, sebanyak 10% untuk kunci halaman dan halaman, atau ke Permulaan atau akhir video untuk kunci rumah dan akhir, masing -masing. Jika berkenaan, perubahan nilai dikekang supaya mereka tidak melebihi had mereka (mis. Jadi anda tidak boleh mencari akhir akhir).

Dalam kes ini, gelangsar ditulis dari awal untuk memasukkan kunci tambahan ini, tetapi ini adalah peningkatan jenis skrip yang mudah untuk diubahsuai, kerana semua yang diperlukan adalah syarat tambahan untuk kod pengendalian kunci yang mesti dimiliki oleh skrip.

mengendalikan peristiwa utama

untuk rujukan, berikut adalah semua nilai kunci peristiwa yang digunakan dalam contoh sebelumnya:

• 33 = Page-Up
• 34 = Page-Down
• 35 = akhir
• 36 = Home
• 37 = left-arrow
• 38 = up-arrow
• 39 = Right-Arrow
• 40 = Down-Arrow

Mengendalikan kunci ini tidak berbeza daripada mengendalikan sebarang kekunci navigasi lain; Jika anda ingin maklumat lanjut mengenai perkara itu, lihat artikel saya yang terdahulu: Kebolehcapaian JavaScript Praktikal.

satu -satunya perkara yang saya akan berhenti sebentar di sini, adalah bahawa kunci navigasi hanya boleh dikendalikan dengan peristiwa keydown dan keyup, dan tidak dengan peristiwa keypress (yang hanya digunakan untuk kekunci yang sebenarnya memasukkan a watak, seperti huruf dan nombor). Peristiwa Keydown juga boleh digunakan untuk menyekat tindakan lalai, yang sering diperlukan apabila skrip dengan kunci navigasi, tetapi pastikan anda hanya melakukan ini apabila tumpuan berada di dalam widget anda, jadi anda tidak akan menghalang mereka sepanjang masa.

Menafsirkan tingkah laku utama

Apabila menggunakan kekunci tambahan ini - atau apa -apa kunci untuk perkara itu - penting untuk berhenti dan mempertimbangkan apa yang akan diketuai oleh kekunci dalam konteks skrip anda. Walaupun kita mempunyai idea yang jelas tentang apa yang, sebagai contoh, kunci utama dalam konteks editor teks atau pemproses kata, ia mungkin tidak begitu jelas dalam konteks tingkah laku yang berbeza.

Slider adalah contoh yang baik kerana jelas apa yang harus mereka gunakan, dan saya fikir kita boleh mengambil contoh khusus untuk memperoleh prinsip yang lebih umum:

rumah bermaksud minimum, mula atau pertama
end bermaksud maksimum, akhir atau terakhir
Page-up bermakna kenaikan dengan bahagian, atau pindah ke bahagian seterusnya atau kumpulan
Page-Down bermaksud pengurangan oleh bahagian, atau pindah ke bahagian sebelumnya atau kumpulan

Jadi, sebagai contoh, dalam konteks pandangan mesej aplikasi mel, kunci rumah mungkin melompat ke bahagian atas senarai, dan kunci akhir hingga akhir. Atau dalam konteks kawalan kelantangan pemain muzik, halaman mungkin meningkatkan jumlah sebanyak satu perempat atau setengah, manakala Page-Down tidak sebaliknya.

Anda akan mempunyai idea terbaik tentang bagaimana kunci tersebut berkaitan dengan permohonan anda sendiri. Tidak ada peraturan yang sukar dan cepat untuk ini, dan tidak ada konvensyen mutlak, itu hanya satu kes pemikiran tentang apa yang dicapai oleh tindakan keyboard yang ada, dan bagaimana ketukan kekunci tambahan ini boleh digunakan untuk menjadikannya lebih mudah atau lebih cepat.

soalan yang sering ditanya mengenai peningkatan kebolehgunaan dengan kekunci navigasi tambahan

Apakah faedah menggunakan kekunci navigasi tambahan di laman web? Mereka menyediakan pengguna dengan lebih banyak kawalan ke atas pengalaman melayari mereka, membolehkan mereka menavigasi melalui laman web ini dengan lebih cekap. Ini boleh menyebabkan peningkatan penglibatan pengguna, mengurangkan kadar lantunan, dan kadar penukaran yang lebih baik. Di samping itu, kekunci navigasi tambahan boleh membuat laman web lebih mudah diakses oleh pengguna yang kurang upaya, terus memperluaskan jangkauan dan kebolehgunaannya. Di laman web anda melibatkan gabungan reka bentuk dan pengekodan web. Anda boleh menggunakan HTML, CSS, dan JavaScript untuk membuat dan gaya kekunci navigasi. Ia juga penting untuk memastikan bahawa kunci ini intuitif dan mudah digunakan, dan mereka meningkatkan pengalaman pengguna keseluruhan daripada merumitkannya.

Apakah beberapa contoh kunci navigasi tambahan? Kekunci navigasi boleh merangkumi ciri -ciri seperti butang 'Back to Top', 'Langkau ke Kandungan' Pautan, dan Pintasan Papan Kekunci. Ciri -ciri ini dapat membantu pengguna menavigasi laman web anda dengan lebih cekap, terutamanya pada halaman yang panjang atau kompleks. Cara alternatif untuk menavigasi tapak. Sebagai contoh, pintasan papan kekunci boleh menjadi sangat berguna untuk pengguna dengan gangguan mobiliti yang mungkin berjuang menggunakan tetikus. Begitu juga, pautan 'Skip to Content' dapat membantu pengguna dengan pembaca skrin memintas menu navigasi dan kandungan berulang yang lain. SEO, mereka secara tidak langsung boleh menyumbang kepada kedudukan enjin carian yang lebih baik dengan meningkatkan pengalaman pengguna. Enjin carian seperti Google mempertimbangkan metrik penglibatan pengguna, seperti kadar lantunan dan masa yang dibelanjakan di tapak, ketika laman web ranking. Dengan meningkatkan pengalaman pengguna, kekunci navigasi tambahan dapat membantu meningkatkan metrik ini, yang berpotensi membawa kepada kedudukan enjin carian yang lebih tinggi. Sangat meningkatkan pengalaman pengguna, mereka perlu dilaksanakan dengan teliti untuk mengelakkan pengguna yang mengelirukan atau menggembirakan. Terlalu banyak pilihan navigasi dapat membuat laman web merasa berantakan dan sukar untuk menavigasi, berpotensi merendahkan pengalaman pengguna.

Bagaimana saya boleh menguji keberkesanan kekunci navigasi tambahan saya?

Anda boleh menggunakan pelbagai kaedah ujian pengguna untuk menilai keberkesanan kekunci navigasi tambahan anda. Ini termasuk ujian kebolehgunaan, di mana anda melihat pengguna berinteraksi dengan laman web anda, atau ujian A/B, di mana anda membandingkan versi yang berbeza dari laman web anda untuk melihat yang lebih baik. Kegunaan mudah alih?

Kekunci navigasi tambahan boleh memberi manfaat terutamanya untuk kebolehgunaan mudah alih. Pada skrin yang lebih kecil, navigasi boleh menjadi lebih mencabar, dan kekunci navigasi tambahan dapat membantu pengguna menavigasi tapak anda dengan lebih mudah. Walau bagaimanapun, penting untuk memastikan kunci ini direka dan dilaksanakan dengan cara yang berfungsi dengan baik pada peranti mudah alih. Kekunci navigasi lebih intuitif, pertimbangkan jangkaan dan tabiat pengguna anda. Gunakan simbol dan penempatan yang biasa untuk kunci anda, dan pastikan ia dilabelkan dengan jelas. Ujian Pengguna juga boleh menjadi alat yang berharga untuk memahami bagaimana pengguna berinteraksi dengan kekunci navigasi anda dan membuat pelarasan yang diperlukan. Dan menjadikan laman web anda lebih mudah untuk menavigasi, kunci navigasi tambahan berpotensi membawa kepada kadar penukaran yang lebih tinggi. Apabila pengguna dapat mencari apa yang mereka cari dengan lebih mudah, mereka lebih cenderung untuk menyelesaikan tindakan yang dikehendaki, seperti membuat pembelian atau mendaftar untuk surat berita.

Atas ialah kandungan terperinci Meningkatkan kebolehgunaan dengan kunci navigasi tambahan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!