Intinya...
Heading harus mendeskripsikan isi kontennya.
Label dan tombol harus mengomunikasikan informasi apa yang dibutuhkan atau aksi apa yang akan terjadi.
Apa itu WCAG 2.4.6?
Heading dan label deskriptif mengorganisir konten, membantu pengguna untuk menavigasi dan memahami halaman web dengan mudah. Heading deskriptif merangkum bagian-bagian konten, sementara label memperjelas tujuan elemen interaktif seperti formulir dan tombol.
Heading dan label tidak harus panjang, kadang-kadang bahkan satu kata atau karakter saja sudah cukup, asalkan itu membantu pengguna untuk menemukan arah mereka.
Mengapa ini penting?
Heading dan label yang tidak jelas membuat pengguna kesulitan untuk menemukan informasi dan memahami halaman, yang mengarah pada rasa frustrasi.
Heading yang samar/rancu/ambigu dapat membuat sulit untuk menemukan dan memutuskan apakah perlu membaca atau berinteraksi dengan konten, terutama bagi pengguna screen reader yang mengandalkan heading untuk menavigasi halaman. Demikian pula, pengguna dengan disabilitas kognitif mungkin salah mengartikan label yang ambigu, yang membuatnya lebih sulit untuk mengisi formulir atau berinteraksi dengan tombol.
Siapa yang terpengaruh?
Pengguna low vision, pengguna dengan disabilitas membaca dan belajar, dan pengguna dengan disabilitas fisik.
Pengguna low vision sering menggunakan screen reader, yang mengandalkan judul yang jelas untuk navigasi yang mudah. Screen reader biasanya menawarkan fitur yang membacakan judul kepada pengguna dan memungkinkan mereka untuk melompat ke sana. Tanpa judul yang deskriptif, menavigasi halaman akan sangat membuat frustrasi bagi pengguna yang harus mendengarkan semua judul.
Pengguna dengan disabilitas membaca dan belajar mendapatkan manfaat dari judul deskriptif yang membuat bagian-bagian menjadi lebih dapat diprediksi dan lebih mudah diikuti. Label yang samar juga dapat menimbulkan kebingungan, yang membuat tugas seperti mengisi formulir menjadi lebih menantang.
Pengguna dengan disabilitas fisik sering mengandalkan teknologi bantu seperti navigasi dengan keyboard atau suara, dan alat ini menggunakan judul dan label untuk membantu pengguna berpindah melalui halaman atau memilih bagian dan tindakan tertentu.
Cara menerapkan WCAG 2.4.6
Gunakan heading deskriptif
Heading harus menggambarkan dengan jelas konten di setiap bagian. Heading memberikan gambaran cepat, membantu pengguna menemukan informasi spesifik, dan menjaga orientasi mereka di halaman. Anggap heading sebagai peta halaman untuk pengguna kamu. Mereka membantu pengguna mencapai tujuan mereka dengan mudah.
Dan, meletakkan informasi penting di awal setiap heading memudahkan pengguna untuk membaca cepat dan menemukan apa yang mereka butuhkan, terutama dengan alat yang memungkinkan mereka melompat di antara heading.
Sebagai contoh, daripada menggunakan "Bab 1," yang samar dan tidak memberikan banyak informasi tentang konten, gunakan "Pengenalan Aksesibilitas Web" untuk memberi tahu pengguna apa yang ada di bagian pertama halaman kursus aksesibilitas.
Gunakan label deskriptif
Buat label untuk input formulir atau elemen interaktif secara singkat dan jelas untuk menggambarkan tujuan mereka dan memberi petunjuk kepada pengguna tentang cara menggunakannya.
Sebagai contoh, daripada menggunakan "Masukkan di sini," gunakan "Alamat Email" untuk kolom yang mengumpulkan alamat email.
Gabungkan dengan kriteria lain
Meskipun WCAG 2.4.6 memastikan judul dan label deskriptif, mereka juga harus memenuhi kriteria keberhasilan lain yang relevan, termasuk:
- WCAG 1.3.1 Informasi dan Relasi untuk memastikan heading dan label ditandai dengan benar dan dapat diidentifikasi oleh teknologi bantu.
- WCAG 4.1.2 Nama, Role, dan Value untuk memastikan input menggunakan nama, peran, status, dan nilai yang benar.
- WCAG 3.3.2 Label atau Instruksi agar satu atau keduanya disediakan untuk input.
Kesimpulan
Heading dan label deskriptif membuat situs web kamu lebih mudah digunakan oleh semua orang. Mereka dapat membantu pengguna menemukan cara mereka, memahami konten, dan berinteraksi dengan formulir atau tombol tanpa frustrasi.