Dokumen ini disiapkan untuk membantu pengguna domestik FramerFramer yang kesulitan dengan kurangnya materi dalam Bahasa Indonesia, dengan menerjemahkan isi dari blog resmi ke bahasa Indonesia serta menambahkan informasi berguna untuk praktik nyata. Semoga ini dapat membantu Anda yang menggunakan FramerFramer.

Kapan Harus Menggunakan ARIA Label?

Beberapa elemen di situs web mungkin secara default tidak memiliki Nama yang Dapat Diakses (Accessible Name), atau mungkin tidak cukup mendeskripsikan konten sebenarnya. Dalam situasi seperti ini, atribut aria-label bisa sangat berguna. Singkatnya, ini memberikan label yang ringkas pada setiap konten untuk meningkatkan aksesibilitas.

Setiap konten memiliki elemen berbeda yang berfungsi sebagai Nama yang Dapat Diakses. Anda dapat memahaminya melalui contoh berikut.

• Tombol (button): Misi dari tombol dikenali melalui teks di dalam tag tersebut.

• Gambar (img): Dapat dikenali apa yang dideskripsikan oleh gambar melalui atribut alt text.

• Input Formulir (input): Dapat dikenali informasi apa yang diinginkan dari formulir melalui teks tag label yang terhubung.

aria-label sangat berguna khususnya ketika teks visual untuk konten minim, atau meskipun terdapat teks visual namun tidak cukup untuk menyampaikan tujuan atau makna secara penuh.

Mencoba Menggunakan ARIA Label

1. Menggunakannya dalam Kode

Misalnya, ada tombol yang langsung menuju situs web FramerFramer. Jika tombol ini tidak memiliki teks, pengguna pembaca layar mungkin tidak dapat mengenali fungsi tombol ini. Dalam kasus seperti ini, penggunaan aria-label dapat secara jelas menyampaikan tujuannya.

<button aria-label="Framer 웹사이트로 이동하기">
  <!-- Framer 아이콘 또는 그래픽 요소 -->
</button>

Dengan menetapkan aria-label seperti ini, ikon saja akan tetap terlihat di layar, namun pembaca layar dapat dengan tepat mengidentifikasi fungsi tombol sebagai "Pergi ke situs web FramerFramer".

2. Menggunakannya di FramerFramer

Di dalam FramerFramer, ada juga fitur yang memungkinkan Anda menambahkan aria-label dengan mudah di panel properti sebelah kanan di bagian Accessibility > Aria Label tanpa pemrograman tambahan.

Dengan demikian, Anda dapat secara signifikan meningkatkan inklusivitas dan keterjangkauan situs web, memastikan pengalaman yang lebih baik bagi semua pengguna. Silakan manfaatkan aria-label untuk membuat situs web yang lebih ramah pengguna.

Tulisan ini adalah adaptasi dan terjemahan dari konten blog resmi FramerFramer ‘Improving Accessibility with ARIA Labels’.