Pembetulan input tanpa kaitan Teras ASP.NET

pengenalan

Apabila membangunkan halaman web untuk mengumpul maklumat daripada pengguna berkali-kali sama ada ketua pasukan atau pembangun tidak mengambil kira pelawat bermasalah penglihatan ke tapak seperti yang ditunjukkan di bawah.

Perhatikan, ini bukan sahaja untuk input sekunder jalan tetapi untuk jenis input lain yang mungkin memerlukan maklumat tambahan.

Mengapa ini penting? Kerana apabila pelawat, bakal pelanggan baharu cuba memasukkan maklumat tanpa label, mereka tidak tahu bahawa input itu adalah untuknya. Mereka mungkin kecewa dan pergi tanpa melengkapkan borang.

Syor kukuh semasa membuat mana-mana halaman web adalah untuk terus menggunakan alat kebolehaksesan untuk melihat sama ada halaman itu mematuhi WCAG AA. Lihat alat kebolehaksesan Wave untuk Chrome, Firefox dan Microsoft Edge.

Gabungkan ini dengan ujian pembaca skrin di mana NVDA ialah alat percuma untuk ini meniru pengalaman pengguna yang cacat penglihatan.

PETUA

Penyelesaian mudah ialah menambah aria-label dan aria-describeby untuk input seperti yang ditunjukkan di bawah.

silih berganti

Bergantung pada pustaka pihak ketiga yang digunakan seperti Bootstrap atau Tailwind, pilihan lain ialah label terapung seperti yang ditunjukkan di bawah.

Kod sumber

Kod sumber

Dalam projek yang menunjukkan petua di atas, terdapat beberapa tambahan.

JavaScript untuk membantu menyahpepijat CSS. Kod yang ditunjukkan di bawah menambah atau mengalih keluar helaian gaya ringkas pada halaman.

Untuk pengeluaran ditunjukkan di bawah, untuk persekitaran lain lulus benar untuk menogol untuk mendayakan penyahpepijatan.

<script src="lib/payne-debugger/debugHelper.js"></script>
<script>
    document.addEventListener('keydown', function (event) {

        if (event.key === '1' && event.altKey && event.ctrlKey) {
            $debugHelper.toggle();
        }

    });
</script>

Gaya H1 tersuai yang ditunjukkan di atas berada dalam wwwrootcssheaders.css

gaya set medan dan legenda berada di wwwrootcsssite.css

Ringkasan

Petua untuk memberikan maklumat tentang tujuan input tanpa mengaitkan input dengan label mungkin kelihatan remeh dan/atau menyusahkan tetapi bagi pelawat yang cacat penglihatan tidaklah remeh sama sekali dan boleh menyebabkan kehilangan pelawat atau pendapatan .

Apabila kebolehcapaian dipertimbangkan semasa membangunkan halaman dari awal adalah lebih murah daripada perlu kembali dan menambah kod untuk kebolehaksesan.

? Dan jika aplikasi web adalah untuk entiti negeri atau kerajaan, mereka mesti disahkan WCAG AA selewat-lewatnya pada April 2026.

Atas ialah kandungan terperinci Pembetulan input tanpa kaitan Teras ASP.NET. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!